/* ============================================================
   产品功能能力页共享样式
   服务：insight / planning / boards / season / platform / plm / overview
   主色：站点蓝 #1677FF（对齐 common.css：--color-primary）
   用色规范：蓝色仅用于可点击内容；不可点击文字使用中性色
   ============================================================ */
:root{
    --in-primary:#1677FF;
    --in-primary-hover:#005FD8;
    --in-primary-active:#004BB0;
    --in-primary-light:#E6F4FF;
    --in-text:#0F172A;
    --in-sub:#64748B;
    --in-border:#E2E8F0;
    --in-bg-soft:#F8FAFC;
    --in-green:#10B981;
    --in-amber:#F59E0B;
    --in-red:#EF4444;
}

/* ===== 面包屑 ===== */
.in-crumb{max-width:1200px;margin:0 auto;padding:22px 24px 0;font-size:.8125rem;}
.in-crumb a{color:#646A73;text-decoration:none;}
.in-crumb a:hover{color:var(--in-primary);}
.in-crumb .sep{margin:0 6px;color:#CBD5E1;}
.in-crumb .current{color:var(--in-text);font-weight:600;}

/* ===== Hero ===== */
.in-hero{background:linear-gradient(135deg,#E6F4FF 0%,#FFFFFF 55%,#F8FAFC 100%);overflow:hidden;}
.in-hero .in-container{max-width:1200px;margin:0 auto;padding:64px 24px;display:flex;gap:56px;align-items:center;}
.in-hero-text{flex:1;min-width:0;}
.in-hero-badge{display:inline-flex;align-items:center;gap:8px;font-size:.8125rem;font-weight:600;color:var(--in-primary);background:#fff;border:1px solid #91CAFF;border-radius:100px;padding:6px 14px;margin-bottom:20px;}
.in-hero-badge svg{width:14px;height:14px;}
.in-hero h1{font-size:clamp(30px,3.6vw,46px);line-height:1.2;font-weight:700;color:var(--in-text);margin:0 0 18px;}
.in-hero h1 span{color:var(--in-primary);}
.in-hero p{font-size:1.0625rem;line-height:1.8;color:var(--in-sub);margin:0 0 28px;max-width:560px;}
.in-hero-actions{display:flex;gap:14px;flex-wrap:wrap;}
.in-btn{display:inline-flex;align-items:center;justify-content:center;border:none;cursor:pointer;font-size:1rem;border-radius:10px;padding:13px 26px;font-weight:600;transition:background .2s,transform .15s,box-shadow .2s;font-family:inherit;}
.in-btn-primary{background:var(--in-primary);color:#fff;box-shadow:0 8px 20px rgba(22,119,255,.25);}
.in-btn-primary:hover{background:var(--in-primary-hover);}
.in-btn-primary:active{background:var(--in-primary-active);transform:scale(.97);}
.in-btn-secondary{background:#fff;color:var(--in-text);border:1px solid #D8DEE9;}
.in-btn-secondary:hover{background:var(--in-primary-light);color:var(--in-primary);}
.in-btn-lg{font-size:1.0625rem;padding:15px 30px;}
.in-hero-visual{flex:1;min-width:0;}

/* 浏览器风格 mock */
.in-win{background:#fff;border-radius:16px;box-shadow:0 24px 60px rgba(15,23,42,.12);border:1px solid var(--in-border);overflow:hidden;}
.in-win-head{display:flex;align-items:center;gap:8px;padding:13px 18px;border-bottom:1px solid var(--in-border);background:#FBFCFE;}
.in-win-head .dot{width:10px;height:10px;border-radius:50%;}
.in-win-head .dot:nth-child(1){background:#FF5F57;}
.in-win-head .dot:nth-child(2){background:#FFBD2E;}
.in-win-head .dot:nth-child(3){background:#28C840;}
.in-win-head span{margin-left:8px;font-size:13px;color:#94A3B8;}
.in-win-body{padding:22px;}
.in-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.in-kpi{background:var(--in-bg-soft);border:1px solid #EEF2F7;border-radius:12px;padding:14px;}
.in-kpi b{display:block;font-size:22px;color:var(--in-text);}
.in-kpi b.up{color:var(--in-green);}
.in-kpi span{font-size:12px;color:var(--in-sub);}
.in-heat{margin-top:16px;background:#fff;border:1px solid #EEF2F7;border-radius:12px;padding:14px 16px;}
.in-heat-row{display:flex;align-items:center;gap:12px;margin-bottom:10px;font-size:13px;}
.in-heat-row:last-child{margin-bottom:0;}
.in-heat-row .lb{flex:0 0 96px;color:var(--in-sub);}
.in-heat-row .bar{flex:1;height:8px;border-radius:4px;background:#E6F4FF;overflow:hidden;}
.in-heat-row .bar i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,#1677FF,#69B1FF);}
.in-heat-row em{font-style:normal;flex:0 0 54px;text-align:right;font-weight:600;color:var(--in-primary);font-size:13px;}

/* ===== 链路定位条 ===== */
.in-flow{background:#0F172A;}
.in-flow .in-flow-in{max-width:1200px;margin:0 auto;padding:36px 24px;text-align:center;}
.in-flow h2{color:#fff;font-size:20px;margin:0 0 22px;font-weight:600;}
.in-flow-steps{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;}
.in-flow-step{font-size:.8125rem;padding:7px 14px;border-radius:100px;background:rgba(255,255,255,.08);color:#CBD5E1;border:1px solid rgba(255,255,255,.12);}
.in-flow-step.on{background:var(--in-primary);color:#fff;border-color:var(--in-primary);box-shadow:0 0 0 4px rgba(22,119,255,.25);}
.in-flow-arrow{color:#475569;font-weight:700;}

/* ===== 通用 section ===== */
.in-sec{padding:88px 0;}
.in-sec-alt{background:var(--in-bg-soft);}
.in-container{max-width:1200px;margin:0 auto;padding:0 24px;}
.in-sec-head{max-width:760px;margin:0 auto 52px;text-align:center;}
.in-sec-head .kicker{display:inline-block;font-size:.8125rem;font-weight:600;color:var(--in-primary);letter-spacing:.06em;margin-bottom:12px;}
.in-sec-head h2{font-size:clamp(26px,2.8vw,36px);line-height:1.25;color:var(--in-text);margin:0 0 14px;}
.in-sec-head p{color:var(--in-sub);font-size:1.0625rem;line-height:1.8;margin:0;}

/* ===== 能力卡 ===== */
.in-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
.in-card{background:#fff;border:1px solid var(--in-border);border-radius:16px;padding:26px 22px;transition:transform .2s,box-shadow .2s,border-color .2s;}
.in-card:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(15,23,42,.08);border-color:#91CAFF;}
.in-card .in-ico{width:52px;height:52px;border-radius:14px;background:var(--in-primary-light);display:flex;align-items:center;justify-content:center;margin-bottom:18px;}
.in-card .in-ico svg{width:26px;height:26px;stroke:var(--in-primary);}
.in-card h3{font-size:1.15rem;color:var(--in-text);margin:0 0 10px;}
.in-card p{font-size:.9375rem;line-height:1.75;color:var(--in-sub);margin:0;}
.in-card .in-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px;}
.in-card .in-tag{font-size:12px;padding:4px 10px;border-radius:100px;background:var(--in-primary-light);color:var(--in-primary);}

/* ===== 模块详情 ===== */
.in-mod{display:flex;align-items:center;gap:60px;}
.in-mod+.in-mod{margin-top:72px;}
.in-mod-text{flex:1;min-width:0;}
.in-mod-text .ino{display:inline-flex;align-items:center;gap:8px;font-size:.8125rem;font-weight:700;color:var(--in-primary);margin-bottom:10px;}
.in-mod-text h2{font-size:clamp(22px,2.2vw,30px);color:var(--in-text);margin:0 0 12px;line-height:1.3;}
.in-mod-text>p{color:var(--in-sub);line-height:1.8;margin:0 0 18px;}
.in-mod-text ul{list-style:none;padding:0;margin:0;}
.in-mod-text li{display:flex;gap:10px;color:#334155;font-size:.96875rem;line-height:1.7;margin-bottom:10px;align-items:flex-start;}
.in-mod-text li svg{width:18px;height:18px;flex:0 0 auto;margin-top:3px;}
.in-mod-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px;}
.in-mod-tag{font-size:12px;padding:4px 10px;border-radius:100px;background:#F1F5F9;color:#475569;}
.in-mod-visual{flex:1;min-width:0;}

/* 模拟小屏组件 */
.in-panel{background:#fff;border:1px solid var(--in-border);border-radius:14px;padding:18px;box-shadow:0 12px 32px rgba(15,23,42,.06);}
.in-panel .ph{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;}
.in-panel .ph b{font-size:14px;color:var(--in-text);}
.in-panel .ph span{font-size:12px;color:var(--in-primary);cursor:pointer;}
.in-panel table{width:100%;border-collapse:collapse;font-size:13px;}
.in-panel th,.in-panel td{border-bottom:1px solid #F1F5F9;padding:9px 6px;text-align:left;color:#334155;}
.in-panel th{color:#94A3B8;font-weight:500;}
.in-chip{display:inline-block;font-size:12px;padding:3px 9px;border-radius:100px;}
.in-chip.b{background:#E6F4FF;color:var(--in-primary);}
.in-chip.g{background:#D1FAE5;color:#065F46;}
.in-chip.a{background:#FEF3C7;color:#92400E;}

/* ===== FAQ ===== */
.in-faq{max-width:860px;margin:0 auto;}
.in-faq details{background:#fff;border:1px solid var(--in-border);border-radius:12px;padding:20px 22px;margin-bottom:14px;transition:box-shadow .2s;}
.in-faq details[open]{box-shadow:0 8px 28px rgba(15,23,42,.06);}
.in-faq summary{cursor:pointer;font-weight:600;color:var(--in-text);font-size:1rem;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px;}
.in-faq summary::-webkit-details-marker{display:none;}
.in-faq summary::after{content:'+';font-size:22px;color:var(--in-primary);line-height:1;transition:transform .2s;}
.in-faq details[open] summary::after{content:'\2212';}
.in-faq .in-faq-a{color:var(--in-sub);font-size:.9375rem;line-height:1.85;padding-top:12px;}

/* 衔接区表格 */
.in-map{width:100%;border-collapse:collapse;font-size:.9375rem;background:#fff;border-radius:12px;overflow:hidden;border:1px solid var(--in-border);}
.in-map th,.in-map td{padding:14px 16px;text-align:left;border-bottom:1px solid #EEF2F7;}
.in-map th{background:var(--in-primary-light);color:var(--in-text);font-weight:600;}
.in-map td{color:#334155;}

/* 滚动进入动画 */
.animate-on-scroll{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s ease;}
.animate-on-scroll.visible{opacity:1;transform:none;}

/* ===== 响应式 ===== */
@media (max-width:1024px){
    .in-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:860px){
    .in-hero .in-container,.in-mod{flex-direction:column;gap:32px;}
    .in-mod-visual{width:100%;}
    .in-kpis{grid-template-columns:repeat(2,1fr);}
    .in-flow-steps{flex-direction:column;align-items:center;}
}
@media (max-width:640px){
    .in-sec{padding:64px 0;}
    .in-grid{grid-template-columns:1fr;}
    .in-hero .in-container{padding:44px 20px;}
}

/* ===== 文字用色规范：仅“可点击”内容使用蓝色 ===== */
.page-content a:not(.in-btn){color:var(--in-primary);text-decoration:none;}
.page-content a:not(.in-btn):hover{color:var(--in-primary-hover);}
a.in-chip{color:var(--in-primary);background:var(--in-primary-light);text-decoration:none;}
a.in-chip:hover{color:var(--in-primary-hover);}
/* 不可点击的蓝色文字改为中性色 */
.in-hero-badge{color:#475569;}
.in-hero-badge{border-color:#E5E7EB;}
.in-sec-head .kicker{color:#64748B;}
.in-mod-text .ino{color:#475569;}
.in-panel .ph span{color:#64748B;cursor:default;}
.in-card .in-tag{background:#EEF2F6;color:#334155;}
.in-mod-tag{background:#EEF2F6;color:#334155;}
.in-chip.b{background:#EEF2F6;color:#334155;}
/* 若 .in-chip.b 本身是可点击的 <a>，则恢复为链接蓝 */
a.in-chip.b{background:var(--in-primary-light);color:var(--in-primary);}