/* ============================================================
   custom.css · Cowork session overrides
   H1-on-hero · 深色品牌蓝渐变 · 极简首屏
   ============================================================ */

/* ============================================================
   R14-T (2026-04-22) · 夺回被 bootstrap 劫持的短名 token
   ============================================================
   critical.html 加载顺序:
     tokens.base → theme-N → aoyun.css → color-override → complete-theme
     → bootstrap.min.css → font-awesome → custom.css
   aoyun.css L7085/L10185 把 --primary 桥到 --color-primary (theme-aware),
   但 bootstrap.min.css 之后的 :root { --primary: #007bff; } 把桥砸了 (同 :root
   特异性, 后声明胜). 用户看到的 .faq-detail-link 冷蓝按钮、任何 var(--primary)
   的消费者都被它吃掉.

   custom.css 是最后加载的文件, 在这里 :root 重新声明 5 个短名 token, 彻底压住
   bootstrap 的遗留 hex. 5 个名字都是 bootstrap 4.4 style guide 的保留名:
     --primary  / --danger  / --warning  / --info  / --success
   ============================================================ */
:root {
    --primary:  var(--color-primary);         /* R14-T: 原 bootstrap #007bff 蓝 */
    --danger:   var(--color-danger);          /* R14-T: 原 bootstrap #dc3545 */
    --warning:  var(--color-warning);         /* R14-T: 原 bootstrap #ffc107 */
    --info:     var(--color-info-bright);     /* R14-T: 原 bootstrap #17a2b8 */
    --success:  var(--color-success);         /* R14-T: 原 bootstrap #28a745 */
}

/* ============================================================
   1. 通用 Hero Banner (top.html) — 深色主题渐变 + H1 嵌入
   适用所有非首页模板
   R14-L 主题化 (2026-04-22):
     原硬编码 #0f172a / #1e3a8a / #3730a3 (slate + blue + indigo) 替换为
     --color-bg-darker / --color-primary-active / --color-primary-hover,
     随 theme-N 自动联动 (theme-3 呈现 深咖→深琥珀→琥珀)。
   ============================================================ */
.hero-banner {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 320px;
    padding: 72px 20px;
    background: linear-gradient(135deg, var(--color-bg-darker) 0%, var(--color-primary-active) 55%, var(--color-primary-hover) 100%);
    overflow: hidden;
    color: #ffffff;
    margin-bottom: 40px;
}

.hero-banner::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 18% 22%, rgba(var(--color-primary-rgb), 0.28), transparent 55%),
        radial-gradient(circle at 82% 78%, rgba(var(--color-primary-rgb), 0.22), transparent 60%);
    pointer-events: none;
    z-index: 1;
}

.hero-banner-inner {
    position: relative;
    z-index: 2;
    max-width: 960px;
    width: 100%;
    text-align: center;
    margin: 0 auto;
}

.hero-banner-title {
    margin: 0;
    font-size: clamp(1.85rem, 4vw, 2.75rem);
    line-height: 1.22;
    font-weight: 800;
    letter-spacing: -0.01em;
    color: #ffffff;
    text-shadow: 0 2px 20px rgba(0, 0, 0, 0.25);
}

.hero-banner-subtitle {
    margin: 14px auto 0;
    max-width: 720px;
    font-size: clamp(0.95rem, 1.6vw, 1.12rem);
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.85);
}

@media (max-width: 768px) {
    .hero-banner {
        min-height: 220px;
        padding: 48px 16px;
        margin-bottom: 24px;
    }
    .hero-banner-title {
        font-size: 1.6rem;
    }
    .hero-banner-subtitle {
        font-size: 0.92rem;
        margin-top: 10px;
    }
}

/* ============================================================
   2. 首页 index-banner (Banner.html) — 轮播 + H1 overlay
   H1 居中浮在轮播正中,代码顺序紧随 header
   ============================================================ */
.index-banner {
    position: relative;
    overflow: hidden;
    margin-bottom: 40px;
}

.index-banner .banner-stage {
    position: relative;
    /* R14-L: was #0f172a slate-900, 改为主题 dark 底以避免加载期闪蓝 */
    background: var(--color-bg-dark);
}

.index-banner .banner-swiper-pc {
    display: block;
}

.index-banner .banner-swiper-mobile {
    display: none;
}

.index-banner .banner-img-wrapper {
    width: 100%;
    overflow: hidden;
}

.index-banner .banner-img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
}

.index-banner .banner-tint {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(10, 15, 30, 0.30) 0%, rgba(10, 15, 30, 0.65) 100%);
    pointer-events: none;
    z-index: 2;
}

.index-banner-overlay {
    position: absolute;
    inset: 0;
    z-index: 5;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 32px 20px;
    color: #ffffff;
    pointer-events: none;
}

.index-banner-overlay-inner {
    max-width: 960px;
    pointer-events: auto;
}

.index-banner-title {
    margin: 0;
    font-size: clamp(2rem, 4.5vw, 3rem);
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: -0.01em;
    color: #ffffff;
    text-shadow: 0 4px 24px rgba(0, 0, 0, 0.45);
}

.index-banner-subtitle {
    margin: 18px auto 0;
    max-width: 760px;
    font-size: clamp(1rem, 1.8vw, 1.2rem);
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.92);
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.35);
}

.index-banner .swiper-pagination {
    position: absolute;
    bottom: 18px;
    left: 0;
    right: 0;
    z-index: 10;
    text-align: center;
}

@media (max-width: 768px) {
    .index-banner {
        margin-bottom: 24px;
    }
    .index-banner .banner-swiper-pc {
        display: none;
    }
    .index-banner .banner-swiper-mobile {
        display: block;
    }
    .index-banner-title {
        font-size: 1.7rem;
    }
    .index-banner-subtitle {
        font-size: 0.95rem;
        margin-top: 12px;
    }
}

/* ============================================================
   3. 产品中心 pdt-card 网格 (productlist.html)
   ============================================================ */
.product-family-grid {
    margin-top: 16px;
}

.product-family-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: var(--card-bg-elevated); /* R14-Q: was #ffffff, 深色主题反白不可见 */
    border-radius: 12px;
    overflow: hidden;
    box-shadow: var(--shadow-sm); /* R14-Q */
    transition: transform .25s ease, box-shadow .25s ease;
    color: inherit;
    text-decoration: none;
    margin-bottom: 24px;
}
.product-family-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg); /* R14-Q */
    text-decoration: none;
    color: inherit;
}

.product-family-thumb {
    width: 100%;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: var(--color-bg-secondary); /* R14-Q: was #f1f5f9 */
}
.product-family-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s ease;
}
.product-family-card:hover .product-family-thumb img {
    transform: scale(1.03);
}

.product-family-body {
    padding: 20px 20px 22px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 1;
}

.product-family-name {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 700;
    /* R14-L: was #0f172a */
    color: var(--color-text);
    line-height: 1.35;
}

.product-family-badge {
    display: inline-block;
    align-self: flex-start;
    padding: 4px 10px;
    /* R14-L: was #eef2ff / #4338ca indigo pair, 改为主色 light + active 随主题 */
    background: var(--color-primary-light);
    color: var(--color-primary-active);
    font-size: 0.78rem;
    border-radius: 999px;
    font-weight: 500;
    line-height: 1.2;
}

.product-family-slogan {
    margin: 0;
    /* R14-L: was #1e293b */
    color: var(--color-text-secondary);
    font-size: 0.92rem;
    font-weight: 500;
    line-height: 1.5;
}

.product-family-desc {
    margin: 0;
    color: #64748b;
    font-size: 0.88rem;
    line-height: 1.6;
    flex: 1;
}

.product-family-more {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    /* R14-L: was #4338ca indigo, 改为主色随主题 */
    color: var(--color-primary);
    font-weight: 600;
    font-size: 0.9rem;
    margin-top: 8px;
}
.product-family-more i {
    transition: transform .2s ease;
}
.product-family-card:hover .product-family-more i {
    transform: translateX(3px);
}

.product-family-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--color-bg-secondary); /* R14-Q: was #f8fafc */
    color: var(--color-text-muted); /* R14-Q: was #94a3b8 */
    font-size: 0.85rem;
}

/* ============================================================
   4. 底部次级导航 (foot.html · 专题 / 合规 / 品牌)
   --- 2026-04-20 C4 重构: 平行三列, 不再嵌套缩进 ---
   ============================================================ */
.footer-secondary-nav {
    margin-top: 28px;
    padding-top: 24px;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.footer-secondary-nav > .row {
    row-gap: 24px;
}

.footer-secondary-nav .footer-nav-col {
    min-width: 0;
}

.footer-secondary-nav .footer-section-title {
    display: block;
    color: rgba(255, 255, 255, 0.92);
    font-size: 0.95rem;
    font-weight: 600;
    margin-bottom: 10px;
    text-decoration: none;
}
.footer-secondary-nav .footer-section-title:hover {
    color: #ffffff;
    text-decoration: underline;
}

.footer-secondary-nav .footer-nav-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.footer-secondary-nav .footer-nav-list a {
    color: rgba(255, 255, 255, 0.65);
    font-size: 0.86rem;
    text-decoration: none;
}
.footer-secondary-nav .footer-nav-list a:hover {
    color: #ffffff;
}

.footer-nav-col-single .footer-section-desc {
    color: rgba(255, 255, 255, 0.55);
    font-size: 0.82rem;
    line-height: 1.55;
    margin: 0;
}

/* ============================================================
   4.5 Cross-Link 内链模块 (comm/cross-link/*.html)
   --- 2026-04-20 C5 重构: 统一骨架, 7 个模块共享 ---
   ============================================================ */
.cross-link {
    margin: 32px 0;
    padding: 24px;
    border-radius: 12px;
    background: var(--color-bg-secondary);
    border: 1px solid var(--color-border);
}

.cross-link-header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}

.cross-link-header-sr {
    margin: 0;
    padding: 0;
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
}

.cross-link-title {
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--color-text);
    margin: 0;
}

.cross-link-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.cross-link-item-link {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    text-decoration: none;
    color: var(--color-text);
    padding: 6px 0;
    border-bottom: 1px dashed var(--color-border-light);
    transition: color .15s ease;
}
.cross-link-item-link:hover { color: var(--color-primary); }
.cross-link-item-link:hover .cross-link-item-title { text-decoration: underline; }

.cross-link-item-title {
    flex: 1 1 auto;
    font-size: 0.92rem;
    line-height: 1.45;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cross-link-item-date {
    flex: 0 0 auto;
    font-size: 0.78rem;
    color: var(--color-text-muted);
    font-variant-numeric: tabular-nums;
}

/* --- Related Topic 网格 --- */
.cross-link-topic-grid {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 12px;
}

.cross-link-topic-card {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 12px 14px;
    border-radius: 10px;
    background: var(--color-bg-primary);
    border: 1px solid var(--color-border);
    color: var(--color-text);
    text-decoration: none;
    transition: transform .15s ease, border-color .15s ease;
}
.cross-link-topic-card:hover {
    transform: translateY(-1px);
    border-color: var(--color-primary);
}

.cross-link-topic-name {
    font-size: 0.95rem;
    font-weight: 600;
}
.cross-link-topic-desc {
    font-size: 0.78rem;
    color: var(--color-text-muted);
    line-height: 1.4;
}

/* --- Tag Cloud --- */
.cross-link-tag-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.cross-link-tag-chip {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    border-radius: 999px;
    font-size: 0.82rem;
    background: var(--color-bg-primary);
    border: 1px solid var(--color-border);
    color: var(--color-text);
    text-decoration: none;
    transition: all .15s ease;
}
.cross-link-tag-chip:hover {
    background: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-text-on-primary, #ffffff);
}

/* --- Cross Entry Cards --- */
.cross-link-entry-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 16px;
}
.cross-link-entry-card {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 16px 18px;
    border-radius: 12px;
    background: var(--color-bg-primary);
    border: 1px solid var(--color-border);
    color: var(--color-text);
    text-decoration: none;
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.cross-link-entry-card:hover {
    transform: translateY(-2px);
    border-color: var(--color-primary);
    /* R14-L: was rgba(37, 99, 235, 0.08) 硬蓝, 改为主色 rgb 联动 */
    box-shadow: 0 6px 16px rgba(var(--color-primary-rgb), 0.08);
}
.cross-link-entry-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 10px;
    background: var(--color-primary-light);
    color: var(--color-primary);
    flex: 0 0 auto;
}
.cross-link-entry-icon .icon {
    width: 22px;
    height: 22px;
    fill: currentColor;
}
.cross-link-entry-body {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1 1 auto;
    min-width: 0;
}
.cross-link-entry-name {
    font-size: 0.98rem;
    font-weight: 600;
}
.cross-link-entry-desc {
    font-size: 0.82rem;
    color: var(--color-text-muted);
    line-height: 1.5;
}
.cross-link-entry-cta {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--color-primary);
    margin-top: 4px;
}

/* --- Anchor Jump --- */
.cross-link-anchor-list {
    list-style: decimal inside;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 0.88rem;
    color: var(--color-text);
}
.cross-link-anchor-list a {
    color: inherit;
    text-decoration: none;
}
.cross-link-anchor-list a:hover {
    color: var(--color-primary);
    text-decoration: underline;
}

/* --- Back Top (inline) --- */
.cross-link-back-top {
    margin: 32px 0 0;
    text-align: right;
}
.cross-link-back-top-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border-radius: 8px;
    background: var(--color-bg-primary);
    border: 1px solid var(--color-border);
    font-size: 0.86rem;
    color: var(--color-text);
    text-decoration: none;
    transition: all .15s ease;
}
.cross-link-back-top-link .icon { width: 14px; height: 14px; fill: currentColor; }
.cross-link-back-top-link:hover {
    border-color: var(--color-primary);
    color: var(--color-primary);
}

/* ============================================================
   5. 边缘页 hero 装饰 (404/message/ledger-duibi/search/tags)
   依托基础 .hero-banner,附加局部装饰
   ============================================================ */
.hero-banner-404 {
    /* R14-L: was #0b1120 / #1e1b4b / #312e81 slate-indigo 渐变 */
    background: linear-gradient(135deg, var(--color-bg-darkest, #040302) 0%, var(--color-bg-dark) 50%, var(--color-primary-active) 100%);
}

.notfound-code {
    font-size: clamp(4rem, 12vw, 8rem);
    font-weight: 900;
    line-height: 1;
    letter-spacing: -0.05em;
    /* R14-L: was #60a5fa / #a78bfa 蓝紫文本渐变 */
    background: linear-gradient(135deg, var(--color-primary-tint) 0%, var(--color-primary-light) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    margin-bottom: 12px;
}

.notfound-actions {
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 24px;
}

.btn-primary-lg,
.btn-outline-lg {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 28px;
    border-radius: 999px;
    font-size: 0.98rem;
    font-weight: 600;
    text-decoration: none;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.btn-primary-lg {
    background: #ffffff;
    /* R14-L: was #1e3a8a 蓝字, 改为主题 active 色 */
    color: var(--color-primary-active);
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.15);
}
.btn-primary-lg:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.2);
    color: var(--color-primary-hover);
    text-decoration: none;
}

.btn-outline-lg {
    background: transparent;
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.6);
}
.btn-outline-lg:hover {
    background: rgba(255, 255, 255, 0.12);
    color: #ffffff;
    text-decoration: none;
}

/* ============================================================
   7. 重构新增样式 (2026-04-20)
   - 覆盖: topic-pillar / topic-hero / topic-list / topic-sidebar / topic-fallback
          product-list / product-card
          policy-header / policy-layout / policy-sidebar
          policy-index-header / policy-index-intro / policy-list
          sidebar-block / sidebar-title
   - 策略: 使用 tokens.base.css 变量, 确保主题覆盖可生效
   ============================================================ */

/* ----- 通用侧栏 block ----- */
.sidebar-block {
    background: var(--card-bg);
    border: 1px solid var(--card-border);
    border-radius: var(--radius-lg);
    padding: var(--space-5, 20px);
    margin-bottom: var(--space-5, 20px);
}
.sidebar-block + .sidebar-block { margin-top: 0; }
.sidebar-title {
    font-size: 1.02rem;
    font-weight: 700;
    color: var(--color-text-primary);
    margin: 0 0 var(--space-3, 12px);
    padding-bottom: var(--space-2, 8px);
    border-bottom: 2px solid var(--color-primary);
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

/* ============================================================
   topic-index.html · Pillar Matrix
   ============================================================ */
.topic-index-hero {
    padding: var(--space-10, 40px) 0 var(--space-8, 32px);
    text-align: center;
}
.topic-index-title {
    font-size: clamp(1.7rem, 3vw, 2.3rem);
    font-weight: 800;
    color: var(--color-text-primary);
    margin: 0 0 var(--space-3, 12px);
}
.topic-index-intro {
    font-size: 1.02rem;
    color: var(--color-text-muted);
    max-width: 780px;
    margin: 0 auto;
    line-height: 1.7;
}
.topic-pillar-matrix {
    display: flex;
    flex-direction: column;
    gap: var(--space-10, 40px);
    padding-bottom: var(--space-12, 48px);
}
.topic-pillar {
    background: var(--color-bg-section);
    border: 1px solid var(--card-border);
    border-radius: var(--radius-xl);
    padding: var(--space-6, 24px) var(--space-5, 20px);
}
.topic-pillar-header {
    text-align: center;
    margin-bottom: var(--space-5, 20px);
}
.topic-pillar-title {
    font-size: 1.35rem;
    font-weight: 700;
    color: var(--color-text-primary);
    margin: 0 0 var(--space-2, 8px);
}
.topic-pillar-desc {
    font-size: 0.95rem;
    color: var(--color-text-muted);
    margin: 0;
}
.topic-pillar-grid {
    /* row 继承 bootstrap; 仅调节内部卡片 */
    margin: 0 -10px;
}
.topic-pillar-grid > [class*="col-"] {
    padding: 10px;
}
.topic-pillar-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: var(--card-bg-elevated, var(--card-bg));
    border: 1px solid var(--card-border);
    border-radius: var(--radius-lg);
    padding: var(--space-4, 16px) var(--space-5, 20px);
    transition: var(--transition-base, all 0.2s ease);
}
.topic-pillar-card:hover {
    border-color: var(--color-primary);
    box-shadow: var(--shadow-card-hover);
    transform: translateY(-2px);
}
.topic-pillar-card-body {
    flex: 1;
    margin-bottom: var(--space-3, 12px);
}
.topic-pillar-card-desc {
    font-size: 0.85rem;
    color: var(--color-primary);
    font-weight: 600;
    margin: 0 0 var(--space-1, 4px);
    letter-spacing: 0.02em;
}
.topic-pillar-card-desc.is-blank { display: none; }
.topic-pillar-card-title {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--color-text-primary);
    margin: 0;
    line-height: 1.35;
}
.topic-pillar-card-cta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--color-primary);
    font-size: 0.9rem;
    font-weight: 600;
    text-decoration: none;
}
.topic-pillar-card-cta:hover {
    color: var(--color-primary-hover);
    text-decoration: none;
}

/* ============================================================
   topic.html · 聚合详情页
   ============================================================ */
.topic-hero {
    padding: var(--space-8, 32px) 0 var(--space-6, 24px);
    border-bottom: 1px solid var(--card-border);
    margin-bottom: var(--space-6, 24px);
}
.topic-hero-title {
    font-size: clamp(1.6rem, 3vw, 2.2rem);
    font-weight: 800;
    color: var(--color-text); /* R14-R: 直接吃 theme-N 的 --color-text, 不走 primary 别名 */
    margin: 0 0 var(--space-2, 8px);
}
.topic-hero-label {
    display: inline-block;
    padding: 4px 12px;
    background: var(--badge-primary-bg);
    color: var(--badge-primary-text);
    border: 1px solid var(--badge-primary-border);
    border-radius: var(--radius-full);
    font-size: 0.85rem;
    font-weight: 600;
    margin-bottom: var(--space-3, 12px);
}
.topic-hero-label.is-blank { display: none; }
.topic-hero-desc {
    font-size: 1rem;
    color: var(--color-text-secondary); /* R14-R: was --color-text-muted, 深主题下太灰吃对比, 提档到 secondary */
    line-height: 1.7;
    max-width: 820px;
    margin: 0;
}
.topic-hero-desc.is-blank { display: none; }

.topic-layout {
    margin-bottom: var(--space-10, 40px);
}
.topic-main {
    padding-right: var(--space-4, 16px);
}
@media (max-width: 991px) {
    .topic-main { padding-right: 0; }
}

.topic-list-grid {
    margin: 0 -10px var(--space-5, 20px);
}
.topic-list-grid > [class*="col-"] {
    padding: 10px;
}
.topic-list-card {
    height: 100%;
    background: var(--card-bg);
    border: 1px solid var(--card-border);
    border-radius: var(--radius-lg);
    overflow: hidden;
    transition: var(--transition-base, all 0.2s ease);
}
.topic-list-card:hover {
    border-color: var(--color-primary);
    box-shadow: var(--shadow-card-hover);
    transform: translateY(-2px);
}
.topic-list-card-link {
    display: flex;
    flex-direction: column;
    height: 100%;
    color: inherit;
    text-decoration: none;
}
.topic-list-card-link:hover,
.topic-list-card-link:focus {
    color: inherit;
    text-decoration: none;
}
.topic-list-card-thumb {
    aspect-ratio: 5 / 3;
    overflow: hidden;
    background: var(--color-bg-section-alt);
}
.topic-list-card-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}
.topic-list-card:hover .topic-list-card-thumb img {
    transform: scale(1.04);
}
.topic-list-card-body {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: var(--space-4, 16px) var(--space-5, 20px);
}
.topic-list-card-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2, 8px);
    font-size: 0.8rem;
    color: var(--color-text-muted);
    margin-bottom: var(--space-2, 8px);
    flex-wrap: wrap;
}
.topic-list-card-meta .fa {
    margin-right: 4px;
    opacity: 0.75;
}
.topic-list-card-title {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--color-text-primary);
    margin: 0 0 var(--space-2, 8px);
    line-height: 1.4;
    /* 两行截断 */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.topic-list-card-desc {
    font-size: 0.88rem;
    color: var(--color-text-muted);
    line-height: 1.6;
    margin: 0 0 var(--space-3, 12px);
    flex: 1;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.topic-list-card-desc.is-blank { display: none; }
.topic-list-card-more {
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--color-primary);
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: auto;
}

/* R14-I-1: .topic-fallback / .topic-fallback-title 9 行 dead code 删除（2026-04-22）
   · grep -r 'topic-fallback' template/ apps/ core/ 仅 custom.css 自身 + 2 份历史文档注释
   · HTML/JS/PHP 0 引用，确认 dead code，安全删除 */

.topic-sidebar {
    padding-left: var(--space-2, 8px);
}
@media (max-width: 991px) {
    .topic-sidebar { padding-left: 0; margin-top: var(--space-6, 24px); }
}
.topic-sidebar-info-body {
    font-size: 0.9rem;
    color: var(--color-text-muted);
    line-height: 1.7;
}
.topic-sidebar-info-text,
.topic-sidebar-info-note { margin: 0 0 var(--space-2, 8px); }
.topic-sidebar-info-text.is-blank,
.topic-sidebar-info-note.is-blank { display: none; }
.topic-sidebar-nav {
    padding: 0;
    margin: 0;
}
.topic-sidebar-nav-item {
    padding: 0;
    margin-bottom: 6px;
    list-style: none;
}
.topic-sidebar-nav-item a {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    color: var(--color-text-muted);
    text-decoration: none;
    border-radius: var(--radius-sm);
    transition: background 0.15s ease, color 0.15s ease;
    font-size: 0.9rem;
}
.topic-sidebar-nav-item a:hover {
    background: var(--color-bg-section);
    color: var(--color-primary);
    text-decoration: none;
}
.topic-sidebar-nav-item.is-active a {
    background: var(--color-primary-tint, rgba(0, 150, 150, 0.08));
    color: var(--color-primary);
    font-weight: 600;
}
.topic-sidebar-cta-text {
    font-size: 0.88rem;
    color: var(--color-text-muted);
    margin: 0 0 var(--space-3, 12px);
    line-height: 1.6;
}
.topic-sidebar-cta-btn { width: 100%; }

/* ============================================================
   productlist-content.html · 终端产品列表
   ============================================================ */
.product-list-page {
    padding-bottom: var(--space-10, 40px);
}
.product-list-header {
    padding: var(--space-8, 32px) 0 var(--space-5, 20px);
    border-bottom: 1px solid var(--card-border);
    margin-bottom: var(--space-6, 24px);
    text-align: center;
}
.product-list-title {
    font-size: clamp(1.7rem, 3vw, 2.3rem);
    font-weight: 800;
    color: var(--color-text-primary);
    margin: 0 0 var(--space-2, 8px);
}
.product-list-subtitle {
    color: var(--color-primary);
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 var(--space-3, 12px);
}
.product-list-desc {
    max-width: 760px;
    margin: 0 auto;
    color: var(--color-text-muted);
    line-height: 1.7;
    font-size: 0.95rem;
}
.product-list-section { margin-bottom: var(--space-8, 32px); }
.product-list-grid {
    margin: 0 -10px;
}
.product-list-grid > [class*="col-"] {
    padding: 10px;
}
.product-card {
    height: 100%;
    background: var(--card-bg);
    border: 1px solid var(--card-border);
    border-radius: var(--radius-lg);
    overflow: hidden;
    transition: var(--transition-base, all 0.2s ease);
}
.product-card:hover {
    border-color: var(--color-primary);
    box-shadow: var(--shadow-card-hover);
    transform: translateY(-3px);
}
.product-card-link {
    display: flex;
    flex-direction: column;
    height: 100%;
    color: inherit;
    text-decoration: none;
}
.product-card-link:hover,
.product-card-link:focus {
    color: inherit;
    text-decoration: none;
}
.product-card-thumb {
    position: relative;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: var(--color-bg-section-alt);
}
.product-card-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}
.product-card:hover .product-card-thumb img {
    transform: scale(1.04);
}
.product-card-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    padding: 4px 10px;
    font-size: 0.72rem;
    font-weight: 700;
    border-radius: var(--radius-sm);
    z-index: 2;
    letter-spacing: 0.02em;
}
.product-card-badge-top {
    background: #ef4444;
    color: #fff;
}
.product-card-badge-recommend {
    background: var(--color-primary);
    color: var(--color-text-on-primary);
    top: 10px;
    left: auto;
    right: 10px;
}
.product-card-body {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: var(--space-4, 16px) var(--space-5, 20px);
}
.product-card-title {
    font-size: 1.02rem;
    font-weight: 700;
    color: var(--color-text-primary);
    margin: 0 0 var(--space-2, 8px);
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.product-card-desc {
    font-size: 0.85rem;
    color: var(--color-text-muted);
    line-height: 1.55;
    margin: 0 0 var(--space-3, 12px);
    flex: 1;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.product-card-meta {
    display: flex;
    align-items: center;
    gap: var(--space-3, 12px);
    font-size: 0.8rem;
    color: var(--color-text-muted);
    margin-bottom: var(--space-2, 8px);
    flex-wrap: wrap;
}
.product-card-meta .fa { margin-right: 4px; opacity: 0.75; }
.product-card-price {
    color: #ef4444;
    font-weight: 700;
}
.product-card-price-ori {
    /* R14-W: 拆平嵌套 if 后独立渲染，视觉与原"嵌入价标签"保持一致 */
    display: inline-block;
    margin-left: 6px;
    color: #9ca3af;
    font-size: 0.85em;
    font-weight: 400;
    vertical-align: baseline;
    text-decoration: line-through;
}
.product-card-more {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--color-primary);
    font-size: 0.88rem;
    font-weight: 600;
    margin-top: auto;
}

/* ============================================================
   policy-index.html · 合规入口
   ============================================================ */
.policy-index-page {
    padding-bottom: var(--space-10, 40px);
}
.policy-index-header {
    padding: var(--space-8, 32px) 0 var(--space-5, 20px);
    text-align: center;
    border-bottom: 1px solid var(--card-border);
    margin-bottom: var(--space-6, 24px);
}
.policy-index-title {
    font-size: clamp(1.7rem, 3vw, 2.2rem);
    font-weight: 800;
    color: var(--color-text-primary);
    margin: 0 0 var(--space-2, 8px);
}
.policy-index-subtitle {
    color: var(--color-text-muted);
    font-size: 1rem;
    margin: 0;
}
.policy-index-intro {
    max-width: 860px;
    margin: 0 auto var(--space-6, 24px);
    padding: var(--space-4, 16px) var(--space-5, 20px);
    background: var(--color-bg-section);
    border-left: 4px solid var(--color-primary);
    border-radius: var(--radius-md);
}
.policy-index-intro-body {
    font-size: 0.95rem;
    color: var(--color-text-muted);
    line-height: 1.7;
    margin: 0;
}
.policy-index-intro-body p { margin: 0; }

/* ============================================================
   policy 共享列表 (policy-index)
   ============================================================ */
.policy-list {
    display: flex;
    flex-direction: column;
    gap: var(--space-2, 8px);
    max-width: 860px;
    margin: 0 auto;
}
.policy-list-item {
    display: flex;
    align-items: center;
    gap: var(--space-3, 12px);
    padding: var(--space-4, 16px) var(--space-5, 20px);
    background: var(--card-bg);
    border: 1px solid var(--card-border);
    border-radius: var(--radius-md);
    text-decoration: none;
    color: inherit;
    transition: var(--transition-base, all 0.2s ease);
}
.policy-list-item:hover {
    border-color: var(--color-primary);
    box-shadow: var(--shadow-card-hover);
    transform: translateX(2px);
    color: inherit;
    text-decoration: none;
}
.policy-list-icon {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--color-primary-tint, rgba(0, 150, 150, 0.08));
    color: var(--color-primary);
    border-radius: var(--radius-md);
    font-size: 1.1rem;
}
.policy-list-body {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}
.policy-list-title {
    font-size: 1rem;
    font-weight: 700;
    color: var(--color-text-primary);
}
.policy-list-desc {
    font-size: 0.85rem;
    color: var(--color-text-muted);
}
.policy-list-more {
    flex-shrink: 0;
    color: var(--color-text-muted);
    font-size: 1rem;
}
.policy-list-item:hover .policy-list-more {
    color: var(--color-primary);
}

/* ============================================================
   policy.html · 单个合规详情页
   ============================================================ */
.policy-page { padding-bottom: var(--space-10, 40px); }
.policy-header {
    margin-bottom: var(--space-5, 20px);
    padding-bottom: var(--space-4, 16px);
    border-bottom: 1px solid var(--card-border);
}
.policy-title {
    font-size: clamp(1.5rem, 2.5vw, 2rem);
    font-weight: 800;
    color: var(--color-text-primary);
    margin: 0 0 var(--space-3, 12px);
}
.policy-layout {
    margin-top: var(--space-4, 16px);
}
.policy-main {
    background: var(--card-bg);
    border: 1px solid var(--card-border);
    border-radius: var(--radius-lg);
    padding: var(--space-6, 24px) var(--space-7, 28px);
}
@media (max-width: 991px) {
    .policy-main { padding: var(--space-4, 16px) var(--space-5, 20px); }
}
.policy-article-meta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-4, 16px);
    font-size: 0.88rem;
    color: var(--color-text-muted);
    margin-bottom: var(--space-4, 16px);
    padding-bottom: var(--space-3, 12px);
    border-bottom: 1px dashed var(--card-border);
}
.policy-article-meta .fa { margin-right: 4px; opacity: 0.75; }
.policy-article-content {
    font-size: 0.98rem;
    color: var(--color-text-primary);
    line-height: 1.85;
}
.policy-article-content h2,
.policy-article-content h3 {
    color: var(--color-text-primary);
    margin-top: var(--space-5, 20px);
    margin-bottom: var(--space-3, 12px);
}
.policy-article-content p {
    margin: 0 0 var(--space-3, 12px);
}
.policy-article-footer {
    margin-top: var(--space-5, 20px);
    padding-top: var(--space-4, 16px);
    border-top: 1px dashed var(--card-border);
}
.policy-last-updated {
    font-size: 0.88rem;
    color: var(--color-text-muted);
    margin: 0;
}
.policy-sidebar {
    padding-left: var(--space-2, 8px);
}
@media (max-width: 991px) {
    .policy-sidebar { padding-left: 0; margin-top: var(--space-5, 20px); }
}
.policy-sidebar-nav {
    padding: 0;
    margin: 0;
}
.policy-sidebar-nav-item {
    padding: 0;
    margin-bottom: 6px;
    list-style: none;
}
.policy-sidebar-nav-item a {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    color: var(--color-text-muted);
    text-decoration: none;
    border-radius: var(--radius-sm);
    transition: background 0.15s ease, color 0.15s ease;
    font-size: 0.9rem;
}
.policy-sidebar-nav-item a:hover {
    background: var(--color-bg-section);
    color: var(--color-primary);
    text-decoration: none;
}
.policy-sidebar-nav-item.is-active a {
    background: var(--color-primary-tint, rgba(0, 150, 150, 0.08));
    color: var(--color-primary);
    font-weight: 600;
}

/* ============================================================
   产品中心 product-hub-page (productlist.html 子栏目索引)
   ============================================================ */
.product-hub-page { padding-bottom: var(--space-10, 40px); }
.product-hub-intro {
    max-width: 880px;
    margin: var(--space-5, 20px) auto var(--space-6, 24px);
    padding: var(--space-4, 16px) var(--space-5, 20px);
    background: var(--color-bg-section);
    border-left: 4px solid var(--color-primary);
    border-radius: var(--radius-md);
}
.product-hub-intro-body p {
    margin: 0;
    font-size: 0.95rem;
    color: var(--color-text-muted);
    line-height: 1.7;
}
.product-families { margin-bottom: var(--space-8, 32px); }
.product-family-grid {
    margin: 0 -10px;
}
.product-family-grid > [class*="col-"] {
    padding: 10px;
}
.product-family-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: var(--card-bg);
    border: 1px solid var(--card-border);
    border-radius: var(--radius-lg);
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    transition: var(--transition-base, all 0.2s ease);
}
.product-family-card:hover {
    border-color: var(--color-primary);
    box-shadow: var(--shadow-card-hover);
    transform: translateY(-3px);
    color: inherit;
    text-decoration: none;
}
.product-family-thumb {
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: var(--color-bg-section-alt);
}
.product-family-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}
.product-family-card:hover .product-family-thumb img {
    transform: scale(1.04);
}
.product-family-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-text-muted);
    font-size: 0.85rem;
}
.product-family-body {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: var(--space-4, 16px) var(--space-5, 20px);
}
.product-family-badge {
    display: inline-block;
    padding: 3px 10px;
    background: var(--badge-primary-bg);
    color: var(--badge-primary-text);
    border: 1px solid var(--badge-primary-border);
    border-radius: var(--radius-full);
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    margin-bottom: var(--space-2, 8px);
    align-self: flex-start;
}
.product-family-name {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--color-text-primary);
    margin: 0 0 var(--space-2, 8px);
    line-height: 1.35;
}
.product-family-slogan {
    font-size: 0.88rem;
    color: var(--color-primary);
    font-weight: 600;
    margin: 0 0 var(--space-2, 8px);
}
.product-family-desc {
    font-size: 0.88rem;
    color: var(--color-text-muted);
    line-height: 1.6;
    margin: 0 0 var(--space-3, 12px);
    flex: 1;
}
.product-family-more {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--color-primary);
    font-size: 0.88rem;
    font-weight: 600;
    margin-top: auto;
}

/* ----- 交叉入口卡 (对比 / 选购指南 / FAQ 三卡) ----- */
.product-cross-entries { margin-bottom: var(--space-6, 24px); }
.cross-entry-card {
    display: flex;
    align-items: center;
    gap: var(--space-3, 12px);
    padding: var(--space-4, 16px) var(--space-5, 20px);
    background: var(--card-bg);
    border: 1px solid var(--card-border);
    border-radius: var(--radius-lg);
    color: inherit;
    text-decoration: none;
    transition: var(--transition-base, all 0.2s ease);
    height: 100%;
}
.cross-entry-card:hover {
    border-color: var(--color-primary);
    box-shadow: var(--shadow-card-hover);
    transform: translateY(-2px);
    color: inherit;
    text-decoration: none;
}
.cross-entry-icon {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--color-primary-tint, rgba(0, 150, 150, 0.08));
    color: var(--color-primary);
    border-radius: var(--radius-md);
    font-size: 1.3rem;
}
.cross-entry-body {
    flex: 1;
    min-width: 0;
}
.cross-entry-title {
    font-size: 1rem;
    font-weight: 700;
    color: var(--color-text-primary);
    margin: 0 0 4px;
}
.cross-entry-desc {
    font-size: 0.85rem;
    color: var(--color-text-muted);
    margin: 0;
}

/* ============================================================
   page-empty (产品列表空状态 / 通用空状态)
   ============================================================ */
.page-empty {
    text-align: center;
    padding: var(--space-10, 40px) var(--space-5, 20px);
    background: var(--color-bg-section);
    border: 1px dashed var(--card-border);
    border-radius: var(--radius-lg);
}
.page-empty-icon {
    font-size: 3rem;
    color: var(--color-text-muted);
    opacity: 0.35;
    margin-bottom: var(--space-3, 12px);
    display: block;
}
.page-empty-text {
    color: var(--color-text-muted);
    font-size: 0.95rem;
    margin: 0 0 var(--space-4, 16px);
}

/* ============================================================
   section-title (页内次级标题, topic-list/policy-index 复用)
   ============================================================ */
.section-title {
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--color-text-primary);
    margin: 0 0 var(--space-4, 16px);
    padding-bottom: var(--space-2, 8px);
    border-bottom: 2px solid var(--color-primary);
    display: inline-block;
}

/* ============================================================
   sr-only (无障碍视觉隐藏, 供 AIS/TTS 读屏使用)
   ============================================================ */
.sr-only {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* ----- topic / product meta 内 span & time 子类 ----- */
.topic-list-card-sort,
.topic-list-card-date,
.product-card-date {
    display: inline-flex;
    align-items: center;
}

/* ============================================================
   Page Hero — 列表页 / 内容页 统一首屏
   基于栏目公约: [sort:subname] 徽章 · [sort:name] H1 ·
   [sort:description] 副标题 · [sort:def1] CTA · [sort:def3] 脚注
   ============================================================ */

.page-hero {
    position: relative;
    overflow: hidden;
    color: #ffffff;
    /* R14-L: was slate→blue→indigo, 改为 深底→深主色→主色 hover, 随 theme-N 联动 */
    background: linear-gradient(135deg, var(--color-bg-darker) 0%, var(--color-primary-active) 55%, var(--color-primary-hover) 100%);
    margin-bottom: 40px;
}

.page-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    /* R14-L: was rgba(99,102,241) + rgba(59,130,246) 蓝紫 radial, 改用 primary-rgb */
    background:
        radial-gradient(circle at 18% 22%, rgba(var(--color-primary-rgb), 0.28), transparent 55%),
        radial-gradient(circle at 82% 78%, rgba(var(--color-primary-rgb), 0.22), transparent 60%);
    pointer-events: none;
    z-index: 1;
}

.page-hero-inner {
    position: relative;
    z-index: 2;
    max-width: 960px;
    margin: 0 auto;
    text-align: center;
}

/* ---- 列表页 variant (视觉 H1 + 丰富副文案) ---- */
.page-hero-list {
    padding: 72px 20px 64px;
}

.page-hero-list .page-hero-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
}

.page-hero-badge {
    display: inline-block;
    padding: 6px 14px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.16);
    border: 1px solid rgba(255, 255, 255, 0.24);
    backdrop-filter: blur(4px);
    font-size: 0.82rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    /* R14-Q: 原 --color-primary-light 在深色主题是低 α 背景色,不能当文字用 · Hero 常态深底用白字 */
    color: rgba(255, 255, 255, 0.92);
    text-transform: uppercase;
}

.page-hero-title {
    margin: 0;
    font-size: clamp(1.85rem, 4vw, 2.85rem);
    line-height: 1.22;
    font-weight: 800;
    letter-spacing: -0.01em;
    color: #ffffff;
    text-shadow: 0 2px 20px rgba(0, 0, 0, 0.25);
}

.page-hero-desc {
    max-width: 720px;
    margin: 0 auto;
    font-size: clamp(0.98rem, 1.4vw, 1.1rem);
    line-height: 1.65;
    color: rgba(255, 255, 255, 0.86);
}

.page-hero-cta-wrap {
    margin: 10px 0 0;
}

.page-hero-cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 28px;
    border-radius: 999px;
    background: #ffffff;
    /* R14-L: was #1e3a8a (blue-800), 改为主色 active */
    color: var(--color-primary-active);
    font-weight: 700;
    font-size: 0.95rem;
    text-decoration: none;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
    transition: transform .18s ease, box-shadow .18s ease;
}

.page-hero-cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 30px rgba(0, 0, 0, 0.22);
    /* R14-L: was #3730a3 (indigo-800), 改为主色 hover */
    color: var(--color-primary-hover);
}

.page-hero-cta-text {
    line-height: 1;
}

.page-hero-footnote {
    margin: 4px 0 0;
    font-size: 0.82rem;
    color: rgba(255, 255, 255, 0.6);
    letter-spacing: 0.04em;
}

/* ---- 内容页 variant (弱化 · 只放栏目徽章+口号 · 无 H1) ---- */
.page-hero-content {
    padding: 40px 20px 32px;
}

.page-hero-content .page-hero-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.page-hero-content .page-hero-badge {
    background: rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 255, 255, 0.22);
    font-size: 0.8rem;
}

.page-hero-subtitle {
    margin: 0;
    font-size: clamp(0.95rem, 1.3vw, 1.08rem);
    line-height: 1.55;
    color: rgba(255, 255, 255, 0.82);
    max-width: 640px;
}

/* ---- 自动隐藏空占位 (PbootCMS 输出空字符串时) ---- */
.page-hero-badge:empty,
.page-hero-desc:empty,
.page-hero-footnote:empty,
.page-hero-subtitle:empty,
.page-hero-cta-text:empty {
    display: none !important;
}

.page-hero-cta-wrap:has(.page-hero-cta-text:empty) {
    display: none !important;
}

/* 响应式微调 */
@media (max-width: 767px) {
    .page-hero-list { padding: 48px 16px 40px; }
    .page-hero-content { padding: 28px 16px 24px; }
    .page-hero-desc { font-size: 0.96rem; }
}

/* ============================================================
   单页模型 article header (about / contact) — 可见 H1
   ============================================================ */
.single-page-header {
    margin: 0 auto 32px;
    padding: 0 0 24px;
    border-bottom: 1px solid rgba(148, 163, 184, 0.25);
    text-align: left;
}

.single-page-title {
    margin: 0 0 10px;
    font-size: clamp(1.6rem, 3vw, 2.15rem);
    line-height: 1.28;
    font-weight: 800;
    letter-spacing: -0.01em;
    /* R14-L: was #0f172a */
    color: var(--color-text);
}

.single-page-lede {
    margin: 0;
    font-size: clamp(0.98rem, 1.3vw, 1.1rem);
    line-height: 1.7;
    /* R14-L: was #475569 slate-600 */
    color: var(--color-text-secondary);
}

.single-page-lede:empty { display: none; }

/* ============================================================
   产品详情页 H1 (product.html)
   ============================================================ */
.product-title-header {
    margin: 0 0 20px;
}

.product-title {
    margin: 0 0 8px;
    font-size: clamp(1.6rem, 2.8vw, 2rem);
    line-height: 1.3;
    font-weight: 800;
    /* R14-L: was #0f172a */
    color: var(--color-text);
}

.product-title-subtitle {
    margin: 0;
    font-size: 0.98rem;
    line-height: 1.6;
    /* R14-L: was #64748b slate-500 */
    color: var(--color-text-muted);
}

.product-title-subtitle:empty { display: none; }

/* ============================================================
   news.html · article-tags 空态自动隐藏
   ============================================================ */
.article-tags-inner:empty { display: none; }
.article-tags:has(.article-tags-inner:empty) { display: none; }

/* ============================================================
   content-prev-next · 内容 prev/next 模块 (独立 comm, 不嵌套 if)
   ============================================================ */
.content-prev-next {
    display: flex;
    gap: 16px;
    margin: 32px 0 24px;
    padding: 20px 0;
    border-top: 1px solid rgba(148, 163, 184, 0.25);
    border-bottom: 1px solid rgba(148, 163, 184, 0.25);
}

.content-prev-next-item {
    flex: 1 1 0;
    min-width: 0;
}

.content-prev-next-next {
    text-align: right;
}

.content-prev-next .nav-item {
    display: block;
    padding: 12px 16px;
    border-radius: 8px;
    /* R14-L: was #f8fafc / #0f172a slate, 改为主题 secondary 底 + 正文色 */
    background: var(--color-bg-secondary);
    color: var(--color-text);
    text-decoration: none;
    transition: background .18s ease, transform .18s ease;
}

.content-prev-next .nav-item:hover:not(.is-disabled) {
    /* R14-L: was #e0e7ff indigo-100, 改为主色 light 随主题 */
    background: var(--color-primary-light);
    transform: translateY(-1px);
}

.content-prev-next .nav-item.is-disabled {
    background: var(--color-bg-tertiary);
    color: var(--color-text-muted);
    cursor: not-allowed;
}

.content-prev-next .nav-label {
    display: block;
    font-size: 0.78rem;
    font-weight: 600;
    /* R14-L: was #64748b slate-500 */
    color: var(--color-text-muted);
    letter-spacing: 0.06em;
    margin-bottom: 4px;
    text-transform: uppercase;
}

.content-prev-next .nav-title {
    display: block;
    font-size: 0.95rem;
    line-height: 1.45;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 576px) {
    .content-prev-next { flex-direction: column; gap: 8px; }
    .content-prev-next-next { text-align: left; }
}

/* ============================================================
   sort-prev-next · 栏目 prev/next 模块
   ============================================================ */
.sort-prev-next {
    margin: 24px 0;
}

.sort-prev-next-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.sort-prev-next-item a {
    display: inline-block;
    padding: 8px 14px;
    border-radius: 999px;
    /* R14-L: was #f1f5f9 / #1e293b slate pair */
    background: var(--color-bg-tertiary);
    color: var(--color-text);
    text-decoration: none;
    font-size: 0.9rem;
    transition: background .18s ease;
}

.sort-prev-next-item a:hover {
    /* R14-L: was #e0e7ff indigo-100 */
    background: var(--color-primary-light);
}

.sort-prev-next-item.is-current a {
    /* R14-L: was #1e3a8a blue-800 (截图"蓝不蓝"主凶), 改为主色 */
    background: var(--color-primary);
    color: var(--color-text-on-primary, #ffffff);
}

/* ============================================================
   pagination · is-empty 空态 (page-inner.html 单层 if 驱动)
   ============================================================ */
.pagination-wrapper.is-empty {
    display: none;
}

.pagination-wrapper .pagination-link.page-disabled,
.pagination-wrapper span.page-pre.page-disabled,
.pagination-wrapper span.page-next.page-disabled {
    color: var(--color-text-muted); /* R14-Q: was #94a3b8 */
    background: var(--color-bg-secondary); /* R14-Q: was #f1f5f9 */
    cursor: not-allowed;
    pointer-events: none;
}

/* ============================================================
   position_single · 单页面 breadcrumb 视觉微调
   ============================================================ */
.site-breadcrumb-single .breadcrumb-label {
    font-weight: 600;
    color: var(--color-text-secondary); /* R14-Q: was #475569 */
}


/* ============================================================
   R4 · footer-shortcuts 图标按钮栏 (专题聚合 + 4 个法律合规)
   ============================================================ */
.footer-shortcuts {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    padding: 14px 0 4px;
    margin-top: 24px;
}

.footer-shortcut-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.06);
    color: rgba(255, 255, 255, 0.82);
    font-size: 13px;
    line-height: 1.2;
    text-decoration: none;
    transition: background-color 0.2s ease, color 0.2s ease, transform 0.15s ease;
    white-space: nowrap;
}

.footer-shortcut-btn i {
    font-size: 14px;
    width: 16px;
    text-align: center;
}

.footer-shortcut-btn:hover,
.footer-shortcut-btn:focus-visible {
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
    text-decoration: none;
    outline: none;
    transform: translateY(-1px);
}

.footer-shortcut-btn:focus-visible {
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.4);
}

.footer-shortcut-topic {
    /* R14-L: was rgba(56,130,246,...) + #93c5fd 硬蓝族, 改为主色 rgb 联动 */
    background: rgba(var(--color-primary-rgb), 0.16);
    color: var(--color-primary-tint);
}
.footer-shortcut-topic:hover,
.footer-shortcut-topic:focus-visible {
    background: rgba(var(--color-primary-rgb), 0.28);
    color: #fff;
}

.footer-shortcut-legal {
    /* inherits default gray style */
}

.footer-shortcut-text {
    display: inline-block;
}

@media (max-width: 575px) {
    .footer-shortcuts {
        justify-content: center;
    }
    .footer-shortcut-btn {
        padding: 6px 12px;
        font-size: 12px;
    }
}

/* ============================================================
   R4 · footer-widget-title (联系我们第5柱链接化)
   ============================================================ */
.footer-widget-title .footer-section-title {
    color: inherit;
    text-decoration: none;
    transition: color 0.2s ease;
}
.footer-widget-title .footer-section-title:hover,
.footer-widget-title .footer-section-title:focus-visible {
    color: #fff;
    text-decoration: none;
}


/* ============================================================
   R5 · 联系我们页面专用样式
   匹配 contact.html 使用的 .contact-card / .channel-card / .contact-cta 等新版选择器
   旧版 aoyun.css 里的 .contact-page 规则是给旧模板用的,这里给新结构补齐
   ============================================================ */

/* 单页公共头 (沿用 single-page-header) */
.contact-page .single-page-header {
    text-align: center;
    padding: 32px 0 28px;
}
.contact-page .single-page-title {
    font-size: 34px;
    font-weight: 700;
    color: var(--color-text-primary, #1f2937);
    margin: 0 0 12px;
    line-height: 1.3;
}
.contact-page .single-page-lede {
    font-size: 16px;
    color: var(--color-text-secondary, #6b7280);
    max-width: 760px;
    margin: 0 auto;
    line-height: 1.7;
}

/* section 标题 */
.contact-page .section-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--color-text-primary, #1f2937);
    margin: 0 0 24px;
    padding-bottom: 12px;
    border-bottom: 2px solid var(--color-primary, #3882f6);
    display: inline-block;
}

/* ============ contact-cards: 电话 / 邮箱 / 在线客服 / 地址 / 工时 / 信用码 ============ */
.contact-cards {
    margin: 24px 0 36px;
}
.contact-cards .row {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -12px;
}
.contact-cards [class*="col-"] {
    padding: 12px;
}

.contact-card {
    background: var(--card-bg-elevated);              /* R14-Q: was #fff, 深色主题可见 */
    border: 1px solid var(--color-border-light);      /* R14-Q: was rgba(0,0,0,0.06) */
    border-radius: 14px;
    padding: 24px 20px;
    height: 100%;
    box-shadow: var(--shadow-xs);                     /* R14-Q: was 0 2px 8px rgba(0,0,0,0.04) */
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
}
.contact-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow-sm);                     /* R14-Q: was 0 8px 22px rgba(0,0,0,0.08) */
    border-color: rgba(var(--color-primary-rgb), 0.28);
}

.contact-card-icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(var(--color-primary-rgb), 0.14), rgba(var(--color-primary-rgb), 0.06));
    color: var(--color-primary, #3882f6);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}

.contact-card-title {
    font-size: 14px;
    font-weight: 600;
    color: var(--color-text-secondary, #6b7280);
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.contact-card-value,
.contact-card-value a {
    font-size: 16px;
    color: var(--color-text-primary, #1f2937);
    font-weight: 500;
    margin: 0;
    line-height: 1.6;
    font-style: normal;
    word-break: break-word;
    text-decoration: none;
    display: block;
}

a.contact-card-value:hover,
.contact-card-value a:hover {
    color: var(--color-primary, #3882f6);
    text-decoration: none;
}

/* ============ contact-content-section: 服务说明 ============ */
.contact-content-section {
    margin: 36px 0;
    padding: 28px;
    background: var(--card-bg-elevated); /* R14-Q: was #fff, 深色主题反白不可见 */
    border-radius: 14px;
    border: 1px solid var(--color-border-light); /* R14-Q */
}
.contact-content-section .contact-content {
    font-size: 15px;
    line-height: 1.85;
    color: var(--color-text-primary, #1f2937);
}
.contact-content-section .contact-content p {
    margin: 0 0 12px;
}
.contact-content-section .contact-content p:last-child {
    margin-bottom: 0;
}

/* ============================================================
   R14-V (2026-04-22) · contact-content 正文富媒体宽高约束
   ------------------------------------------------------------
   后台富文本编辑器插入的 <img> 默认带原图像素 width/height (如 1920px),
   会把 .contact-content-section (最大容器宽度 ~ 1140px 减 padding) 撑破
   出边界造成横向滚动. 这里强制 max-width:100% + height:auto 让图片按
   容器等比缩放, 同时给 iframe / video / table / pre 兜底避免同类溢出.
   选择器锁在 .contact-content 内部, 不会影响页面其他区块.
   ============================================================ */
.contact-content img,
.contact-content-section .contact-content img {
    max-width: 100%;
    height: auto;
    display: inline-block;
    border-radius: 8px;
    margin: 12px 0;
    box-shadow: var(--shadow-xs);
}
.contact-content iframe,
.contact-content video,
.contact-content-section .contact-content iframe,
.contact-content-section .contact-content video {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 12px 0;
}
.contact-content table,
.contact-content-section .contact-content table {
    max-width: 100%;
    display: block;
    overflow-x: auto;
    margin: 12px 0;
}
.contact-content pre,
.contact-content-section .contact-content pre {
    max-width: 100%;
    overflow-x: auto;
    white-space: pre-wrap;
    word-wrap: break-word;
}

/* ============ contact-channels: 微信 / X / Telegram / YouTube / TikTok ============ */
.contact-channels {
    margin: 36px 0;
}
.contact-channels .row {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -12px;
}
.contact-channels [class*="col-"] {
    padding: 12px;
}

.channel-card {
    background: var(--card-bg-elevated); /* R14-Q: was #fff, 深色主题反白不可见 */
    border: 1px solid var(--color-border-light); /* R14-Q */
    border-radius: 14px;
    padding: 24px 20px;
    height: 100%;
    box-shadow: var(--shadow-xs); /* R14-Q */
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
    text-align: center;
}
.channel-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow-md); /* R14-Q */
    border-color: rgba(var(--color-primary-rgb), 0.28);
}

.channel-title {
    font-size: 16px;
    font-weight: 600;
    color: var(--color-text-primary, #1f2937);
    margin: 0 0 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.channel-title i {
    color: var(--color-primary, #3882f6);
    font-size: 18px;
}

.channel-qr {
    display: block;
    width: 180px;
    height: 180px;
    max-width: 100%;
    margin: 0 auto 12px;
    border-radius: 10px;
    border: 1px solid rgba(0, 0, 0, 0.06);
    padding: 8px;
    background: #fff;
}

.channel-caption {
    font-size: 13px;
    color: var(--color-text-secondary, #6b7280);
    margin: 0;
    line-height: 1.5;
}
.channel-caption:empty {
    display: none;
}

.channel-value,
a.channel-value {
    font-size: 15px;
    font-weight: 500;
    color: var(--color-text-primary, #1f2937);
    margin: 0;
    word-break: break-word;
    text-decoration: none;
    line-height: 1.6;
    display: block;
}
a.channel-value:hover {
    color: var(--color-primary, #3882f6);
}
/* R14-V: wechatid 为空时隐藏，避免 qr 下方留空白 */
.channel-value-wechatid:empty {
    display: none;
}
.channel-value-wechatid {
    margin-top: 10px;
    text-align: center;
    font-family: "SF Mono", Menlo, Consolas, monospace;
    font-size: 14px;
    color: var(--color-text-secondary, #6b7280);
    letter-spacing: 0.5px;
    user-select: all;
}

/* ============ contact-cta: 底部大按钮 ============ */
.contact-cta {
    text-align: center;
    margin: 36px 0 24px;
}

.btn-consult-lg {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 16px 48px;
    font-size: 17px;
    font-weight: 600;
    color: #fff;
    background: linear-gradient(135deg, var(--color-primary, #3882f6), var(--color-primary-hover, #1d4ed8));
    border-radius: 999px;
    border: none;
    text-decoration: none;
    box-shadow: 0 6px 18px rgba(var(--color-primary-rgb), 0.28);
    transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
}
.btn-consult-lg:hover,
.btn-consult-lg:focus-visible {
    color: #fff;
    text-decoration: none;
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(var(--color-primary-rgb), 0.36);
    filter: brightness(1.05);
    outline: none;
}
.btn-consult-lg i {
    font-size: 18px;
}

/* ============ 响应式 ============ */
@media (max-width: 767px) {
    .contact-page .single-page-title { font-size: 26px; }
    .contact-page .single-page-lede { font-size: 15px; }
    .contact-page .section-title { font-size: 18px; }
    .contact-card { padding: 18px 16px; }
    .contact-card-icon { width: 38px; height: 38px; font-size: 17px; }
    .contact-card-value,
    .contact-card-value a { font-size: 15px; }
    .channel-qr { width: 150px; height: 150px; }
    .btn-consult-lg { padding: 14px 32px; font-size: 15px; }
    .contact-content-section { padding: 20px 16px; }
}


/* ============================================================
   R6 · newslist-index / faqlist-index · 顶级栏目的子栏目目录页
   ------------------------------------------------------------
   模版文件:
     - html/newslist-index.html  (资讯类顶级栏目索引 hub)
     - html/faqlist-index.html   (FAQ 类顶级栏目索引 hub)
   用法: 后台 → 该栏目 → 列表模板 选 newslist-index.html / faqlist-index.html
   ============================================================ */

/* ===== 通用 hub header ===== */
.news-index-page .section-title,
.faq-index-page .section-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--color-text-primary, #1f2937);
    margin: 0 0 12px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--color-primary, #3882f6);
    display: inline-block;
}
.news-index-page .section-lede,
.faq-index-page .section-lede,
.news-index-hub-lede,
.faq-index-hub-lede {
    font-size: 15px;
    color: var(--color-text-secondary, #6b7280);
    margin: 0 0 28px;
    line-height: 1.7;
}

.news-index-hub,
.faq-index-hub,
.news-index-latest,
.faq-index-hot,
.faq-index-cta {
    margin: 28px 0 36px;
}

.news-index-hub-header,
.faq-index-hub-header {
    margin-bottom: 20px;
}

/* ===== news-index 分区卡 ===== */
.news-index-hub-grid,
.faq-index-hub-grid {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -12px;
}
.news-index-hub-col,
.faq-index-hub-col {
    padding: 12px;
    display: flex;
}

.news-index-section-card,
.faq-index-section-card {
    background: var(--card-bg-elevated); /* R14-Q: was #fff, 深色主题反白不可见 */
    border: 1px solid var(--color-border-light); /* R14-Q */
    border-radius: 14px;
    padding: 22px 22px 18px;
    box-shadow: var(--shadow-xs); /* R14-Q */
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
    width: 100%;
    display: flex;
    flex-direction: column;
}
.news-index-section-card:hover,
.faq-index-section-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow-md); /* R14-Q */
    border-color: rgba(var(--color-primary-rgb), 0.28);
}

.news-index-section-card-head,
.faq-index-section-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}
.news-index-section-card-title,
.faq-index-section-card-title {
    font-size: 17px;
    font-weight: 700;
    margin: 0;
    line-height: 1.4;
    color: var(--color-text-primary, #1f2937);
    flex: 1;
    min-width: 0;
}
.news-index-section-card-title a,
.faq-index-section-card-title a {
    color: inherit;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.news-index-section-card-title i,
.faq-index-section-card-title i {
    color: var(--color-primary, #3882f6);
    font-size: 18px;
    flex-shrink: 0;
}
.news-index-section-card-title a:hover,
.faq-index-section-card-title a:hover {
    color: var(--color-primary, #3882f6);
    text-decoration: none;
}

.news-index-section-card-count,
.faq-index-section-card-count {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    color: var(--color-text-secondary, #6b7280);
    background: rgba(var(--color-primary-rgb), 0.08);
    padding: 4px 10px;
    border-radius: 999px;
    white-space: nowrap;
    flex-shrink: 0;
}

.news-index-section-card-desc,
.faq-index-section-card-desc {
    font-size: 13px;
    color: var(--color-text-secondary, #6b7280);
    line-height: 1.7;
    margin: 0 0 14px;
}

/* 分区内的文章条目 */
.news-index-section-list,
.faq-index-section-list {
    flex: 1;
    margin: 0;
    padding: 0;
}
.news-index-section-item,
.faq-index-section-item {
    border-top: 1px dashed rgba(0, 0, 0, 0.06);
    padding: 0;
}
.news-index-section-item:first-child,
.faq-index-section-item:first-child {
    border-top: none;
}
.news-index-section-item a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 0;
    font-size: 14px;
    color: var(--color-text-primary, #1f2937);
    text-decoration: none;
    transition: color 0.15s ease;
}
.news-index-section-item a:hover .news-index-section-item-title {
    color: var(--color-primary, #3882f6);
}
.news-index-section-item-title {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.news-index-section-item-date {
    font-size: 12px;
    color: var(--color-text-secondary, #6b7280);
    flex-shrink: 0;
}

.faq-index-section-item a {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 0;
    font-size: 14px;
    color: var(--color-text-primary, #1f2937);
    text-decoration: none;
    transition: color 0.15s ease;
}
.faq-index-section-item a i {
    color: var(--color-primary, #3882f6);
    font-size: 11px;
    flex-shrink: 0;
}
.faq-index-section-item a:hover {
    color: var(--color-primary, #3882f6);
}

/* 查看更多 */
.news-index-section-card-more,
.faq-index-section-card-more {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid rgba(0, 0, 0, 0.06);
    font-size: 13px;
    color: var(--color-primary, #3882f6);
    text-decoration: none;
    font-weight: 500;
    align-self: flex-start;
}
.news-index-section-card-more:hover,
.faq-index-section-card-more:hover {
    color: var(--color-primary-hover, #1d4ed8);
    text-decoration: none;
}

/* ===== news-index 最新文章 (卡片大图) ===== */
.news-index-latest-grid {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -12px;
}
.news-index-latest-col {
    padding: 12px;
}
.news-index-latest-card {
    display: flex;
    flex-direction: column;
    background: var(--card-bg-elevated); /* R14-Q: was #fff, 深色主题反白不可见 */
    border: 1px solid var(--color-border-light); /* R14-Q */
    border-radius: 14px;
    overflow: hidden;
    box-shadow: var(--shadow-xs); /* R14-Q */
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    height: 100%;
    text-decoration: none;
    color: inherit;
}
.news-index-latest-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow-md); /* R14-Q */
    text-decoration: none;
    color: inherit;
}
.news-index-latest-card-thumb {
    aspect-ratio: 5 / 3;
    overflow: hidden;
    background: rgba(0, 0, 0, 0.04);
}
.news-index-latest-card-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.35s ease;
}
.news-index-latest-card:hover .news-index-latest-card-thumb img {
    transform: scale(1.05);
}
.news-index-latest-card-body {
    padding: 16px 18px 18px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
}
.news-index-latest-card-sort {
    font-size: 12px;
    color: var(--color-primary, #3882f6);
    font-weight: 500;
}
.news-index-latest-card-title {
    font-size: 15px;
    font-weight: 600;
    margin: 0;
    line-height: 1.5;
    color: var(--color-text-primary, #1f2937);
}
.news-index-latest-card-desc {
    font-size: 13px;
    color: var(--color-text-secondary, #6b7280);
    line-height: 1.7;
    margin: 0;
    flex: 1;
}
.news-index-latest-card-date {
    font-size: 12px;
    color: var(--color-text-secondary, #9ca3af);
    margin-top: auto;
}

/* ===== faq-index 热榜 ===== */
.faq-index-hot-list {
    counter-reset: none;
    padding: 0;
    margin: 0;
    background: var(--card-bg-elevated); /* R14-Q: was #fff, 深色主题反白不可见 */
    border: 1px solid var(--color-border-light); /* R14-Q */
    border-radius: 14px;
    overflow: hidden;
}
.faq-index-hot-item {
    border-top: 1px solid rgba(0, 0, 0, 0.04);
}
.faq-index-hot-item:first-child { border-top: none; }
.faq-index-hot-item a {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 20px;
    font-size: 14px;
    color: var(--color-text-primary, #1f2937);
    text-decoration: none;
    transition: background 0.15s ease;
}
.faq-index-hot-item a:hover {
    background: rgba(var(--color-primary-rgb), 0.04);
    text-decoration: none;
}
.faq-index-hot-rank {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    background: rgba(var(--color-primary-rgb), 0.12);
    color: var(--color-primary, #3882f6);
    font-size: 12px;
    font-weight: 700;
    border-radius: 6px;
    flex-shrink: 0;
}
/* R14-L: top-3 rank 勋章色 —— 1st 金 / 2nd 银 / 3rd 铜。
   1st/3rd 原本就是 amber/coral 装饰色, 保留;
   2nd 原为 indigo (#e0e7ff/#4f46e5) 与"蓝不蓝"截图吻合, 改中性银灰。 */
.faq-index-hot-item:nth-child(1) .faq-index-hot-rank { background: #fef3c7; color: #d97706; }
.faq-index-hot-item:nth-child(2) .faq-index-hot-rank { background: rgba(148, 163, 184, 0.2); color: var(--color-text-secondary); }
.faq-index-hot-item:nth-child(3) .faq-index-hot-rank { background: #fecaca; color: #dc2626; }
.faq-index-hot-title {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.faq-index-hot-sort {
    font-size: 12px;
    color: var(--color-text-secondary, #6b7280);
    white-space: nowrap;
    flex-shrink: 0;
}

/* ===== faq-index CTA ===== */
.faq-index-cta {
    background: linear-gradient(135deg, rgba(var(--color-primary-rgb), 0.08), rgba(var(--color-primary-rgb), 0.02));
    border: 1px solid rgba(var(--color-primary-rgb), 0.15);
    border-radius: 16px;
    padding: 36px 28px;
    text-align: center;
}
.faq-index-cta-title {
    font-size: 22px;
    font-weight: 700;
    margin: 0 0 10px;
    color: var(--color-text-primary, #1f2937);
}
.faq-index-cta-text {
    font-size: 15px;
    color: var(--color-text-secondary, #6b7280);
    margin: 0 0 20px;
    line-height: 1.7;
}
.faq-index-cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 32px;
    background: linear-gradient(135deg, var(--color-primary, #3882f6), var(--color-primary-hover, #1d4ed8));
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    border-radius: 999px;
    text-decoration: none;
    box-shadow: 0 6px 16px rgba(var(--color-primary-rgb), 0.26);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.faq-index-cta-btn:hover {
    color: #fff;
    text-decoration: none;
    transform: translateY(-2px);
    box-shadow: 0 10px 22px rgba(var(--color-primary-rgb), 0.34);
}


/* ============================================================
   R6 · topic.html 改版 · 栏目聚合型专题页 (去掉标签云)
   ============================================================ */
/* R14-R: 原 bg 是 rgba(primary, 0.08/0.02) 半透明叠加在父 bg 上;
   在 T10 / T2 / T6 等深底主题里, 如果父 bg 未显式漆黑, 会透出浏览器默认白,
   再叠一层 2% 橙 alpha → 视觉上是亚白色 hero + 白字 → 标题/描述字被白底吃掉.
   修: 改为 color-mix 配 --card-bg-elevated (theme-aware surface) 打底,
       强制 hero 面板永远是"当前主题的卡片面", 深主题 → 深;浅主题 → 浅;
       文本色同步切到 --color-text / --color-text-secondary 理论保底链. */
.topic-page .topic-hero {
    /* R14-S-DEPLOY: 第一行 bg 是 fallback — 旧浏览器 (Safari 15 / Chrome <111 / FF <113)
       不认 color-mix(), 会 drop 第二条声明, 保留 card-bg-elevated 平底 (仍 theme-aware).
       现代浏览器第二条覆盖第一条, 保留原设计的 subtle primary tint. */
    background: var(--card-bg-elevated);
    background: linear-gradient(135deg,
        color-mix(in srgb, var(--card-bg-elevated) 88%, var(--color-primary) 12%) 0%,
        var(--card-bg-elevated) 100%);
    border-radius: 16px;
    padding: 36px 32px;
    margin: 18px 0 28px;
    border: 1px solid var(--color-border);
}
.topic-page .topic-hero-inner {
    max-width: 880px;
}
.topic-page .topic-hero-label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 14px;
    background: rgba(var(--color-primary-rgb), 0.15);
    color: var(--color-primary);
    font-size: 12px;
    font-weight: 600;
    border-radius: 999px;
    margin-bottom: 14px;
    letter-spacing: 0.5px;
}
.topic-page .topic-hero-title {
    font-size: 32px;
    font-weight: 700;
    color: var(--color-text);
    margin: 0 0 12px;
    line-height: 1.3;
}
.topic-page .topic-hero-desc {
    font-size: 16px;
    color: var(--color-text-secondary);
    line-height: 1.75;
    margin: 0 0 14px;
}
.topic-page .topic-hero-meta {
    font-size: 13px;
    color: var(--color-text-secondary);
    margin: 0;
}
.topic-page .topic-hero-meta-label {
    font-weight: 600;
    color: var(--color-text);
    margin-right: 8px;
}
.topic-page .is-blank { display: none; }

.topic-page .topic-layout { margin: 0; }

.topic-page .topic-main .section-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--color-text-primary, #1f2937);
    margin: 0 0 10px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--color-primary, #3882f6);
    display: inline-block;
}
.topic-page .topic-main .section-lede {
    font-size: 14px;
    color: var(--color-text-secondary, #6b7280);
    margin: 0 0 20px;
    line-height: 1.7;
}

/* 主列表卡 */
.topic-list-grid {
    margin: 0 -12px 28px;
}
.topic-list-grid > [class*="col-"] {
    padding: 12px;
}
.topic-list-card {
    background: var(--card-bg-elevated); /* R14-Q: was #fff, 深色主题反白不可见 */
    border: 1px solid var(--color-border-light); /* R14-Q */
    border-radius: 14px;
    overflow: hidden;
    box-shadow: var(--shadow-xs); /* R14-Q */
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    height: 100%;
}
.topic-list-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow-md); /* R14-Q */
}
.topic-list-card-link {
    display: flex;
    flex-direction: column;
    height: 100%;
    color: inherit;
    text-decoration: none;
}
.topic-list-card-link:hover { color: inherit; text-decoration: none; }
.topic-list-card-thumb {
    aspect-ratio: 5 / 3;
    overflow: hidden;
    background: rgba(0, 0, 0, 0.04);
}
.topic-list-card-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.35s ease;
}
.topic-list-card:hover .topic-list-card-thumb img {
    transform: scale(1.05);
}
.topic-list-card-body {
    padding: 16px 18px 18px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
}
.topic-list-card-meta {
    display: flex;
    gap: 14px;
    font-size: 12px;
    color: var(--color-text-secondary, #9ca3af);
    flex-wrap: wrap;
}
.topic-list-card-meta i {
    margin-right: 4px;
    color: var(--color-primary, #3882f6);
}
.topic-list-card-title {
    font-size: 16px;
    font-weight: 600;
    margin: 0;
    line-height: 1.5;
    color: var(--color-text-primary, #1f2937);
}
.topic-list-card-desc {
    font-size: 13px;
    color: var(--color-text-secondary, #6b7280);
    line-height: 1.7;
    margin: 0;
    flex: 1;
}
.topic-list-card-more {
    font-size: 13px;
    color: var(--color-primary, #3882f6);
    margin-top: auto;
}

/* 相关专题 */
.topic-related {
    margin-top: 40px;
}
.topic-related-grid {
    margin: 0 -10px;
}
.topic-related-grid > [class*="col-"] {
    padding: 10px;
}
.topic-related-card {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px 18px;
    background: var(--card-bg-elevated); /* R14-Q: was #fff, 深色主题反白不可见 */
    border: 1px solid var(--color-border-light); /* R14-Q */
    border-radius: 12px;
    text-decoration: none;
    color: inherit;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
    height: 100%;
}
.topic-related-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-md); /* R14-Q */
    border-color: rgba(var(--color-primary-rgb), 0.28);
    text-decoration: none;
    color: inherit;
}
.topic-related-card-icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: linear-gradient(135deg, rgba(var(--color-primary-rgb), 0.14), rgba(var(--color-primary-rgb), 0.06));
    color: var(--color-primary, #3882f6);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 17px;
    flex-shrink: 0;
}
.topic-related-card-body {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}
.topic-related-card-title {
    font-size: 14px;
    font-weight: 600;
    color: var(--color-text-primary, #1f2937);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.topic-related-card-count {
    font-size: 12px;
    color: var(--color-text-secondary, #6b7280);
}
.topic-related-card-arrow {
    color: var(--color-text-secondary, #9ca3af);
    flex-shrink: 0;
}

/* 专题侧栏 */
.topic-sidebar .sidebar-block {
    background: var(--card-bg-elevated); /* R14-Q: was #fff, 深色主题反白不可见 */
    border: 1px solid var(--color-border-light); /* R14-Q */
    border-radius: 14px;
    padding: 18px 20px;
    margin-bottom: 18px;
    box-shadow: var(--shadow-xs); /* R14-Q */
}
.topic-sidebar .sidebar-title {
    font-size: 14px;
    font-weight: 700;
    color: var(--color-text-primary, #1f2937);
    margin: 0 0 14px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    display: flex;
    align-items: center;
    gap: 6px;
}
.topic-sidebar .sidebar-title i {
    color: var(--color-primary, #3882f6);
}

.topic-sidebar-info-text {
    font-size: 13px;
    color: var(--color-text-secondary, #6b7280);
    line-height: 1.75;
    margin: 0 0 8px;
}
.topic-sidebar-info-note {
    font-size: 12px;
    color: var(--color-text-secondary, #9ca3af);
    margin: 0;
    padding: 8px 10px;
    background: rgba(0, 0, 0, 0.02);
    border-radius: 6px;
}
.topic-sidebar-info-text.is-blank,
.topic-sidebar-info-note.is-blank { display: none; }

.topic-sidebar-nav {
    margin: 0;
}
.topic-sidebar-nav-item {
    margin-bottom: 4px;
}
.topic-sidebar-nav-item a {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 9px 12px;
    border-radius: 8px;
    font-size: 13px;
    color: var(--color-text-primary, #1f2937);
    text-decoration: none;
    transition: background 0.15s ease, color 0.15s ease;
}
.topic-sidebar-nav-item a:hover {
    background: rgba(var(--color-primary-rgb), 0.06);
    color: var(--color-primary, #3882f6);
    text-decoration: none;
}
.topic-sidebar-nav-item.is-active a {
    background: rgba(var(--color-primary-rgb), 0.1);
    color: var(--color-primary, #3882f6);
    font-weight: 600;
}
.topic-sidebar-nav-item a i {
    color: var(--color-primary, #3882f6);
    font-size: 12px;
}
.topic-sidebar-nav-item a span:first-of-type {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.topic-sidebar-nav-count {
    font-size: 11px;
    background: rgba(var(--color-primary-rgb), 0.08);
    color: var(--color-primary, #3882f6);
    padding: 1px 7px;
    border-radius: 999px;
    flex-shrink: 0;
}

.topic-sidebar-hot-list { margin: 0; padding: 0; }
.topic-sidebar-hot-item { margin-bottom: 6px; }
.topic-sidebar-hot-item a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    font-size: 13px;
    color: var(--color-text-primary, #1f2937);
    text-decoration: none;
    line-height: 1.5;
}
.topic-sidebar-hot-item a:hover {
    color: var(--color-primary, #3882f6);
    text-decoration: none;
}
.topic-sidebar-hot-rank {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    background: rgba(0, 0, 0, 0.05);
    color: var(--color-text-secondary, #6b7280);
    font-size: 11px;
    font-weight: 700;
    border-radius: 4px;
    flex-shrink: 0;
}
/* R14-L: 同 .faq-index-hot-item —— 2nd 改银灰去除 indigo 蓝。 */
.topic-sidebar-hot-item:nth-child(1) .topic-sidebar-hot-rank { background: #fef3c7; color: #d97706; }
.topic-sidebar-hot-item:nth-child(2) .topic-sidebar-hot-rank { background: rgba(148, 163, 184, 0.2); color: var(--color-text-secondary); }
.topic-sidebar-hot-item:nth-child(3) .topic-sidebar-hot-rank { background: #fecaca; color: #dc2626; }
.topic-sidebar-hot-title {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.topic-sidebar-cta-text {
    font-size: 13px;
    color: var(--color-text-secondary, #6b7280);
    line-height: 1.7;
    margin: 0 0 14px;
}
.topic-sidebar-cta-btn {
    display: inline-flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 16px;
    background: linear-gradient(135deg, var(--color-primary, #3882f6), var(--color-primary-hover, #1d4ed8));
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    border-radius: 10px;
    text-decoration: none;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.topic-sidebar-cta-btn:hover {
    color: #fff;
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(var(--color-primary-rgb), 0.3);
}

/* 响应式 */
@media (max-width: 991px) {
    .topic-sidebar { margin-top: 24px; }
}
@media (max-width: 767px) {
    .topic-page .topic-hero { padding: 24px 20px; }
    .topic-page .topic-hero-title { font-size: 24px; }
    .topic-page .topic-hero-desc { font-size: 14px; }
    .news-index-page .section-title,
    .faq-index-page .section-title,
    .topic-page .topic-main .section-title { font-size: 18px; }
    .news-index-section-card,
    .faq-index-section-card { padding: 18px 16px 16px; }
    .faq-index-cta { padding: 28px 20px; }
    .faq-index-cta-title { font-size: 18px; }
}

/* ============================================================
   R7-3 · 删除 footer-widget-title / footer-section-title 的
   装饰性渐变分割条 (联系我们 widget 下方的两条点缀线)
   ============================================================ */
.footer-widget-title,
.footer-widget-title .footer-section-title,
.footer-section-title {
    border-bottom: 0 !important;
    padding-bottom: 0 !important;
}
.footer-widget-title::after,
.footer-widget-title .footer-section-title::after,
.footer-section-title::after {
    content: none !important;
    display: none !important;
    background: none !important;
    height: 0 !important;
}
.footer-widget-title {
    margin-bottom: 16px !important;
}
.footer-nav-col .footer-section-title {
    margin-bottom: 14px !important;
}

/* ============================================================
   R7-4 · 消除页面顶部 (top-bar 之上) 的空白白条
   包含 html/body 默认 margin、top-bar 前后伪元素的意外占位、
   以及 top-bar 与 site-header 之间的潜在间隙
   ============================================================ */
html,
body {
    margin: 0 !important;
    padding: 0 !important;
}
/* R14-R: 根本修 · 站点从未显式漆 body 底, 浏览器默认白会从任意透明
   半透明元素 (如 .topic-page .topic-hero 的 8% alpha gradient) 中透出,
   深色主题被直接吃掉. 这里显式给 html/body 上 theme-aware 底色,
   同时把默认文字色切到 --color-text 以防任何遗漏的字段漏给浏览器默认黑. */
html {
    background: var(--color-bg-primary);
}
body {
    background: var(--color-bg-primary);
    color: var(--color-text);
}
.top-bar {
    margin-top: 0 !important;
    padding-top: 0;
}
.top-bar::before,
.top-bar::after {
    content: none !important;
    display: none !important;
    height: 0 !important;
    background: none !important;
}
.site-header {
    margin-top: 0 !important;
}
.site-header::before,
.site-header::after {
    content: none !important;
    display: none !important;
}

/* ============================================================
 * R8-1 / R8-2 · 列表略缩图统一长宽比
 *   产品类 4:5 (320x400)  — 首页热门、产品栏目卡、产品列表
 *   新闻类 3:2 (420x280)  — 首页新闻、资讯列表、资讯目录、专题文章卡
 * 使用 aspect-ratio + object-fit 约束，不依赖图片原始长宽
 * ============================================================ */

/* ----- 4:5 产品略缩图 ----- */
.index-products .product-image,
.product-family-thumb,
.product-card-thumb {
    position: relative;
    aspect-ratio: 4 / 5;
    overflow: hidden;
    background: #f5f7fa;
}

.index-products .product-image img,
.product-family-thumb img,
.product-card-thumb img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
    object-position: center;
    display: block;
}

.product-family-placeholder {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #a6adb7;
    font-size: 14px;
    background: #f5f7fa;
}

/* ----- 3:2 新闻 / 资讯 / 教程 / 专题略缩图 ----- */
.index-news .news-image,
.news-index-latest-card-thumb,
.topic-list-card-thumb,
.news-thumb {
    position: relative;
    aspect-ratio: 3 / 2;
    overflow: hidden;
    background: #f5f7fa;
    display: block;
}

.index-news .news-image a,
.index-news .news-image > a {
    display: block;
    width: 100%;
    height: 100%;
}

.index-news .news-image img,
.news-index-latest-card-thumb img,
.topic-list-card-thumb img,
.news-thumb img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
    object-position: center;
    display: block;
}

/* 响应式最小高度回退（防止老浏览器不支持 aspect-ratio） */
@supports not (aspect-ratio: 4 / 5) {
    .index-products .product-image,
    .product-family-thumb,
    .product-card-thumb { height: 0; padding-bottom: 125%; }
    .index-products .product-image > *,
    .product-family-thumb > *,
    .product-card-thumb > * { position: absolute; inset: 0; }
    .index-news .news-image,
    .news-index-latest-card-thumb,
    .topic-list-card-thumb,
    .news-thumb { height: 0; padding-bottom: 66.666%; }
    .index-news .news-image > *,
    .news-index-latest-card-thumb > *,
    .topic-list-card-thumb > *,
    .news-thumb > * { position: absolute; inset: 0; }
}

/* ============================================================
   模板 404 页 + tags.html 停用页（2026-04-21）
   root 404.html 是静态兜底页（无依赖）
   template/404.html 走 PbootCMS 模板，保留站点壳（header/footer）
   这里补齐它独有的 .notfound-suggestions / .suggestion-card 样式
   ============================================================ */

/* 404 hero 已在上方 .hero-banner-404 / .notfound-code / .notfound-actions 定义过，
   这里补 404 下半段的"常用入口"卡片网格 */
.notfound-page {
    padding-top: 40px;
    padding-bottom: 60px;
}
.notfound-suggestions {
    margin-top: 8px;
}
.notfound-suggestions .section-title {
    text-align: center;
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--color-text);
    margin-bottom: 28px;
    letter-spacing: -0.01em;
}

/* 通用的建议卡片（/404 和 /tags/ 停用页共用） */
.suggestion-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-height: 120px;
    padding: 20px 16px;
    background: var(--color-bg-primary);
    border: 1px solid var(--color-border);
    border-radius: 14px;
    text-decoration: none;
    color: var(--color-text-secondary);
    text-align: center;
    transition: transform 0.18s ease, box-shadow 0.18s ease,
                border-color 0.18s ease, color 0.18s ease;
    margin-bottom: 16px;
}
.suggestion-card:hover,
.suggestion-card:focus-visible {
    transform: translateY(-2px);
    border-color: var(--color-primary);
    color: var(--color-primary);
    /* R14-L: was rgba(37, 99, 235, 0.12) 硬蓝, 改为主色 rgb 联动 */
    box-shadow: 0 8px 20px rgba(var(--color-primary-rgb), 0.12);
    text-decoration: none;
}
.suggestion-icon {
    font-size: 1.8rem;
    color: var(--color-primary);
    line-height: 1;
}
.suggestion-card:hover .suggestion-icon {
    transform: scale(1.08);
    transition: transform 0.18s ease;
}
.suggestion-name {
    font-size: 0.95rem;
    font-weight: 600;
    line-height: 1.35;
    word-break: break-word;
}

/* tags.html 停用页 */
.tags-disabled-page {
    padding-top: 56px;
    padding-bottom: 80px;
}
.tags-disabled-hero {
    /* R14-L: was slate→indigo-darker→indigo-800 渐变, 改为主题联动 */
    background: linear-gradient(135deg, var(--color-bg-darker) 0%, var(--color-primary-active) 55%, var(--color-primary-hover) 100%);
    border-radius: 20px;
    padding: 48px 24px;
    color: #fff;
    text-align: center;
    margin-bottom: 40px;
    box-shadow: 0 12px 32px rgba(15, 23, 42, 0.18);
}
.tags-disabled-hero-inner {
    max-width: 640px;
    margin: 0 auto;
}
.tags-disabled-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.18);
    color: #fbbf24;
    font-size: 1.6rem;
    margin-bottom: 18px;
}
.tags-disabled-title {
    font-size: clamp(1.5rem, 4vw, 2.1rem);
    font-weight: 700;
    letter-spacing: -0.01em;
    margin-bottom: 12px;
    color: #ffffff;
}
.tags-disabled-desc {
    font-size: 1rem;
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.82);
    margin-bottom: 28px;
}
.tags-disabled-actions {
    display: flex;
    gap: 14px;
    justify-content: center;
    flex-wrap: wrap;
}
.tags-disabled-hint .section-title {
    text-align: center;
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--color-text);
    margin-bottom: 24px;
}

@media (max-width: 575px) {
    .tags-disabled-hero { padding: 36px 18px; }
    .suggestion-card { min-height: 100px; padding: 16px 12px; }
    .suggestion-icon { font-size: 1.5rem; }
    .suggestion-name { font-size: 0.88rem; }
}

/* ============================================================
   R12-11A · CLS 第一批（Task #41 · 2026-04-21 并批落地）
   纯加法 · 仅在 custom.css 末端追加 · 不改其他文件
   目标：为首页 Banner 与文章封面补齐 aspect-ratio，消除 LCP 前 CLS
   并批范围：A-1 (Swiper Banner) + A-3 (article-cover)
   冻结项：A-2 Font Awesome / theme-3 / 第二批按页加载
   ============================================================ */

/* ----- A-1 · 首页 Banner Swiper 图片比例兜底 ----- */
/* 对齐 Banner.html 中 PC <img width=1920 height=600> 与
   Mobile <img width=750 height=1000> 的固有宽高，消除图片加载前的容器塌陷 */
.index-banner .banner-swiper-pc .banner-img {
    aspect-ratio: 1920 / 600;
}
@media (max-width: 768px) {
    .index-banner .banner-swiper-mobile .banner-img {
        aspect-ratio: 750 / 1000;
    }
}

/* ----- A-3 · 文章详情页封面比例对齐 ----- */
/* aoyun.css L7436 已有 .article-page .article-cover { aspect-ratio: 16 / 9 }
   news.html L54 <img width=1200 height=630> (≈1.905:1) 与 16/9 (≈1.778:1) 不一致
   修法：对齐到图片真实比例 1200/630，CSS 末端赢家覆盖旧值
   视觉变化：容器略矮 ~6.7%，换取图片完整显示 + CLS 消除 */
.article-page .article-cover {
    aspect-ratio: 1200 / 630;
}

/* ====== R14-W · faq-list-answer 扁平化 CSS 兜底 ======
   faq-list-answer.html 原 3 分支互斥（含 2x "&&" 组合）重构为 else 分支内同时渲染
   description + content fallback，靠 CSS 做"有 desc 用 desc，否则用 content"的选择：
   - 空 description 直接 display:none
   - 有 description 时隐藏 content fallback（相邻兄弟选择器） */
.faq-answer-desc:empty {
    display: none;
}
.faq-answer-desc:not(:empty) ~ .faq-answer-content-fallback {
    display: none;
}
