/* ============================================================
   Banner 底部一体化坞（.lc-hero-dock）
   ------------------------------------------------------------
   背景：低代码/对比系列页的 banner 上下原本各挂了几条独立窄条
   （hero 上方：30 秒答案 + 本页下一步；hero 下方：关联选型资源 /
   AI 选型双轨 / 双轨提示 / 选型辅助导航），首屏"满满当当"。

   本文件把这些模块收进 banner 卡片内的一个坞里，统一成：
     行1  双轨标签 + 30 秒答案
     行2  4 个入口方块（2 个关联选型 + 2 条双轨）
     行3  本页下一步（CTA 胶囊）
     行4  辅助链接（选型导航 | 双轨延伸）
     行5  双轨提示（弱化）
   仅样式层收拢，DOM 里的 <!-- ..._START/END --> 标记保持不变，
   因此 scripts/bake_page_modules.py 仍可在坞内原地重建模块。

   注：cn-shell-density.css / 页面内联 <style> 对 .organic-snippet、
   .entry-next-path、.ai-fusion-rail-* 用了高优先级甚至 !important，
   坞内需要覆盖的部分同样带 !important。
   v20261011c
   ============================================================ */

.lc-hero-dock {
    --lc-dock-line: rgba(16, 185, 129, 0.20);
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    grid-auto-rows: min-content !important;
    align-items: start !important;
    gap: 8px 10px !important;
    width: auto !important;
    max-width: none !important;
    margin: 14px auto 2px !important;
    padding: 12px 14px 13px !important;
    background: #fff !important;
    border: 1px solid var(--lc-dock-line) !important;
    border-radius: 16px !important;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.06) !important;
    box-sizing: border-box !important;
    text-align: left !important;
}

/* 拆掉各模块自带的壳，让内部元素直接成为坞的网格项 */
.lc-hero-dock > .lc-pair-bar,
.lc-hero-dock .ai-fusion-rail-shell,
.lc-hero-dock .ai-fusion-rail-shell > .ai-fusion-rail,
.lc-hero-dock .ai-fusion-rail-shell .ai-fusion-rail__grid {
    display: contents !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
    box-shadow: none !important;
    max-width: none !important;
}

/* ── 行 1：双轨标签 + 30 秒答案 ── */
.lc-hero-dock .ai-fusion-rail__eyebrow {
    order: 1 !important;
    grid-column: 1 / span 2 !important;
    margin: 0 !important;
    padding: 0 !important;
    height: auto !important;
    font-size: 0.8rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.02em !important;
    line-height: 1.5 !important;
    text-transform: none !important;
    color: #0f766e !important;
}

.lc-hero-dock > .organic-snippet-wrap,
.lc-hero-dock > .cont-hero-snippet {
    order: 2 !important;
    grid-column: 3 / -1 !important;
    margin: 0 !important;
    padding: 0 !important;
    max-width: none !important;
    width: auto !important;
}

.lc-hero-dock .organic-snippet {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: baseline !important;
    gap: 4px 8px !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: none !important;
    box-shadow: none !important;
    font-size: 0.8rem !important;
    line-height: 1.5 !important;
}

/* 坞内常驻显示，不再 3 秒收起 */
.lc-hero-dock .organic-snippet.organic-snippet--dismissed {
    opacity: 1 !important;
    visibility: visible !important;
    max-height: none !important;
    overflow: visible !important;
    pointer-events: auto !important;
}

.lc-hero-dock .organic-snippet__close,
.lc-hero-dock .organic-snippet-pill {
    display: none !important;
}

.lc-hero-dock .organic-snippet__label {
    margin: 0 !important;
    padding: 1px 8px !important;
    font-size: 0.68rem !important;
    line-height: 1.5 !important;
}

.lc-hero-dock .organic-snippet__lead {
    margin: 0 !important;
    font-size: 0.8rem !important;
    line-height: 1.5 !important;
    color: #475569 !important;
}

.lc-hero-dock .organic-snippet__lead strong {
    color: #0f172a !important;
}

/* 其 CTA 目标已在下面"行 3"重复出现 */
.lc-hero-dock .organic-snippet__cta {
    display: none !important;
}

/* ── 行 2：4 个入口方块 ── */
.lc-hero-dock .lc-pair-bar__item,
.lc-hero-dock .ai-fusion-rail__track {
    grid-column: span 1 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 1px !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 9px 11px !important;
    border-radius: 11px !important;
    box-shadow: none !important;
    transform: none !important;
    text-align: left !important;
}

.lc-hero-dock .lc-pair-bar__item { order: 3 !important; }
.lc-hero-dock .ai-fusion-rail__track { order: 4 !important; }

.lc-hero-dock .lc-pair-bar__item:hover,
.lc-hero-dock .ai-fusion-rail__track:hover {
    border-color: #10b981 !important;
}

.lc-hero-dock .lc-pair-bar__label,
.lc-hero-dock .ai-fusion-rail__who {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 0.68rem !important;
    font-weight: 600 !important;
    line-height: 1.45 !important;
    color: #0f766e !important;
}

.lc-hero-dock .lc-pair-bar__item strong,
.lc-hero-dock .ai-fusion-rail__track strong {
    display: block !important;
    margin: 0 !important;
    font-size: 0.86rem !important;
    line-height: 1.3 !important;
}

.lc-hero-dock .lc-pair-bar__desc,
.lc-hero-dock .ai-fusion-rail__track span:last-child {
    display: block !important;
    margin: 0 !important;
    font-size: 0.72rem !important;
    line-height: 1.4 !important;
    color: #94a3b8 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.lc-hero-dock .lc-pair-bar__arrow {
    display: none !important;
}

/* ── 行 3：本页下一步 ── */
.lc-hero-dock .entry-next-path {
    order: 5 !important;
    grid-column: 1 / -1 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 6px 10px !important;
    max-width: none !important;
    margin: 2px 0 0 !important;
    padding: 9px 0 0 !important;
    border: 0 !important;
    border-top: 1px dashed #e6edf5 !important;
    border-radius: 0 !important;
    background: none !important;
    box-shadow: none !important;
    text-align: left !important;
}

.lc-hero-dock .entry-next-path__lead {
    margin: 0 !important;
    font-size: 0.76rem !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    color: #94a3b8 !important;
}

.lc-hero-dock .entry-next-path__lead strong {
    color: #64748b !important;
    font-weight: 600 !important;
}

.lc-hero-dock .entry-next-path__actions {
    grid-template-columns: repeat(3, minmax(0, auto)) !important;
    gap: 6px !important;
    width: auto !important;
}

/* ── 行 4：辅助链接 ── */
.lc-hero-dock .lc-guide-bar {
    order: 6 !important;
    grid-column: 1 / span 2 !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
    border: 0 !important;
}

.lc-hero-dock .lc-guide-bar-inner {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 4px 10px !important;
    max-width: none !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 0.78rem !important;
    line-height: 1.6 !important;
}

.lc-hero-dock .ai-fusion-rail__foot {
    order: 7 !important;
    grid-column: 3 / -1 !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 0.78rem !important;
    line-height: 1.6 !important;
    color: #94a3b8 !important;
}

.lc-hero-dock .ai-fusion-rail__foot a {
    color: #059669 !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}

/* ── 行 5：双轨提示（弱化） ── */
.lc-hero-dock .ai-dual-track-hint {
    order: 8 !important;
    grid-column: 1 / -1 !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: none !important;
    font-size: 0.76rem !important;
    line-height: 1.6 !important;
    color: #94a3b8 !important;
}

.lc-hero-dock .ai-dual-track-hint strong {
    color: #64748b !important;
    font-weight: 600 !important;
}

.lc-hero-dock .ai-dual-track-hint em {
    font-size: 0.72rem !important;
}

/* 坞在 hero 内时，收一下 banner 底部留白 */
section[id="hero"]:has(> .container > .lc-hero-dock),
section[id="hero"]:has(.lc-hero-dock) {
    padding-bottom: 18px !important;
}

/* 直接挂在 hero 下（hero 内没有 .container）时，自行对齐 1440 壳 */
.lc-hero-dock--flush {
    width: min(calc(100% - 2 * var(--shell-gutter, 20px)), var(--lc-shell-max, 1440px)) !important;
    max-width: var(--lc-shell-max, 1440px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* ── 变体 ── */

/* 只有一对入口方块：每个撑 2 格，横向填满 4 列 */
.lc-hero-dock--tiles-2 .lc-pair-bar__item,
.lc-hero-dock--tiles-2 .ai-fusion-rail__track {
    grid-column: span 2 !important;
}

/* 没有入口方块：30 秒答案 / 导航独占整行 */
.lc-hero-dock--no-tiles > .organic-snippet-wrap,
.lc-hero-dock--no-tiles > .cont-hero-snippet,
.lc-hero-dock--no-tiles .lc-guide-bar {
    grid-column: 1 / -1 !important;
}

/* 最瘦形态（只有 30 秒答案 + 下一步）：一行排开 */
.lc-hero-dock--slim {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px 20px !important;
}

.lc-hero-dock--slim > .organic-snippet-wrap,
.lc-hero-dock--slim > .cont-hero-snippet {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
}

.lc-hero-dock--slim .entry-next-path {
    flex: 0 1 auto !important;
    grid-column: auto !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

@media (max-width: 1100px) {
    .lc-hero-dock {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .lc-hero-dock--tiles-2 .lc-pair-bar__item,
    .lc-hero-dock--tiles-2 .ai-fusion-rail__track {
        grid-column: span 1 !important;
    }

    .lc-hero-dock .ai-fusion-rail__eyebrow,
    .lc-hero-dock > .organic-snippet-wrap,
    .lc-hero-dock > .cont-hero-snippet,
    .lc-hero-dock .lc-guide-bar,
    .lc-hero-dock .ai-fusion-rail__foot {
        grid-column: 1 / -1 !important;
    }
}

@media (max-width: 640px) {
    .lc-hero-dock {
        grid-template-columns: 1fr !important;
        gap: 8px !important;
        margin-top: 12px !important;
        padding: 12px !important;
        border-radius: 14px !important;
    }

    .lc-hero-dock .lc-pair-bar__item,
    .lc-hero-dock .ai-fusion-rail__track {
        grid-column: 1 / -1 !important;
    }

    .lc-hero-dock--slim {
        align-items: flex-start !important;
    }

    .lc-hero-dock .lc-pair-bar__desc,
    .lc-hero-dock .ai-fusion-rail__track span:last-child {
        white-space: normal !important;
        overflow: visible !important;
    }

    .lc-hero-dock .entry-next-path__actions {
        grid-template-columns: 1fr 1fr !important;
        width: 100% !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .lc-hero-dock * {
        transition: none !important;
    }
}