/* ============================================================
   零碳智谷 落地页专属样式 (zhigu.css)
   ============================================================ */

/* 圆形播放按钮 */
.zhigu-play {
    width: 90px; height: 90px; border-radius: 50%;
    background: #242424; border: none;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 4px 10px rgba(94, 92, 88, .9);
    transition: transform .3s, background .3s; cursor: pointer;
}
.zhigu-play:hover { transform: scale(1.08); background: #000; }
.zhigu-play::after {
    content: ''; border-left: 22px solid #fff;
    border-top: 14px solid transparent; border-bottom: 14px solid transparent;
    margin-left: 6px;
}

/* 卖点图标项（颜色继承父级） */
.zhigu-feat { text-align: center; }
.zhigu-feat img { width: 56px; height: 56px; margin: 0 auto 14px; display: block; object-fit: contain; }
.zhigu-feat span { font-size: var(--fs-body); font-weight: 600; line-height: 1.4; display: block; }

/* 卖点图标行：分散对齐，无宽度限制 */
.zhigu-feat-row {
    display: flex; justify-content: space-between; align-items: flex-start;
}
.zhigu-feat-row .zhigu-feat { flex: 0 0 auto; }

/* 六层安全防护 特色图标：强制 3 列网格（覆盖 jgjn-section-featureicons 的 flex 布局，
   因 tailwind.css 先于 common.css 加载，此处需显式覆盖 display 才能生效） */
.jgjn-section-featureicons.grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.jgjn-section-featureicons.grid span {
    display: block;
    width: 100%;
    text-align: center;
}

/* 聚光云APP 圆点要点列表 */
.app-list { list-style: none; padding: 0; margin: 0; }
.app-list li {
    position: relative; padding-left: 24px; margin-bottom: 18px;
    font-size: var(--fs-body-sm-20); line-height: 1.6; color: rgba(255, 255, 255, .92);
}
.app-list li::before {
    content: ''; position: absolute; left: 0; top: 11px;
    width: 8px; height: 8px; border-radius: 50%; background: #fff;
}

/* 全域适配储能 三列 */
/* section 顶部大标题（整段共用，非单列标题） */
.scope-title {
    padding: 64px 24px 24px;
    text-align: center;
}
.scope-col {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    padding: 50px 24px; min-height: 600px; text-align: center;
}
.scope-col--1 { background: #494949; }
.scope-col--2 { background: #2D2B2B; }
.scope-col--3 { background: #000000; }
.scope-dots { list-style: none; padding: 0; margin: 18px 0; text-align: left; }
.scope-dots li {
    position: relative; padding-left: 20px; margin-bottom: 10px;
    font-size: var(--fs-caption-16); line-height: 1.5; color: #fff;
}
.scope-dots li::before {
    content: ''; position: absolute; left: 0; top: 9px;
    width: 6px; height: 6px; border-radius: 50%; background: #fff;
}

@media (max-width: 768px) {
    .zhigu-play { width: 64px; height: 64px; }
    .zhigu-play::after { border-left-width: 15px; border-top-width: 10px; border-bottom-width: 10px; }
    .zhigu-feat img { width: 42px; height: 42px; }
    .zhigu-feat span { font-size: var(--fs-caption-16); }
    .app-list li { font-size: var(--fs-caption-16); }
    .scope-col { min-height: auto; padding: 56px 24px; }
    .scope-title { padding: 48px 24px 8px; }
}