/* view403.css —— 噢易云 LISS 基本版解决方案 专用样式 */

:root {
      --brand: #ff6a00;
      --brand-dark: #e25e00;
      --brand-soft: #fff3e9;
      --ink: #1d2330;
      --ink-2: #4a5468;
      --line: #e8ebf1;
      --bg-soft: #f7f9fc;
      --radius: 14px;
      --shadow: 0 8px 30px rgba(29, 35, 48, .06);
      --shadow-lg: 0 16px 48px rgba(29, 35, 48, .12);
    }

.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

.mt-block { margin-top: 2rem; }

.section-title { font-size: clamp(1.6rem, 3vw, 2.2rem); margin-bottom: .8rem; text-wrap: balance; }

.sub-block + .sub-block { margin-top: 2.8rem; }

.sub-block p { color: var(--ink-2); font-size: 1rem; line-height: 1.92; margin: 0; }

/* 编号要点列表（方案概述 / 三类机制） */

/* 方案架构：整图（按原图像素取上限，不放大防糊） */

/* 核心技术能力 / 方案价值：编号卡 */

.value-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; }

.value-grid--c2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.value-card { min-width: 0; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 1.7rem 1.6rem; box-shadow: var(--shadow); transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }

.value-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); border-color: rgba(255,106,0,.35); }

.value-head { display: flex; align-items: center; gap: .65rem; margin-bottom: 1.05rem; }

.value-no { flex: none; width: 1.7rem; height: 1.7rem; border-radius: 8px; background: var(--brand-soft); border: 1px solid rgba(255,106,0,.18); color: var(--brand-dark); font-weight: 700; font-size: .82rem; line-height: 1; display: inline-flex; align-items: center; justify-content: center; }

.value-title { font-size: 1.06rem; margin: 0; line-height: 1.45; }

.value-desc { margin: 0; color: var(--ink-2); font-size: .93rem; line-height: 1.85; }

@media (max-width: 991.98px) { .value-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

@media (max-width: 575.98px) { .value-grid { grid-template-columns: 1fr; } }

/* 应用场景：图标卡 */

.scene-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }

.scene-grid--c4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.scene-card { min-width: 0; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 1.5rem 1.4rem; box-shadow: var(--shadow); transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }

.scene-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); border-color: rgba(255,106,0,.35); }

.scene-head { display: flex; align-items: center; gap: .7rem; margin-bottom: .75rem; }

.scene-ico { flex: none; width: 2.3rem; height: 2.3rem; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; background: var(--brand-soft); color: var(--brand-dark); font-size: 1.08rem; }

.scene-card h3 { font-size: 1.02rem; margin: 0; line-height: 1.45; }

.scene-card p { margin: 0; color: var(--ink-2); font-size: .92rem; line-height: 1.8; }

@media (max-width: 991.98px) { .scene-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

@media (max-width: 991.98px) { .scene-grid--c4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

@media (max-width: 575.98px) { .scene-grid { grid-template-columns: 1fr; } }

/* 典型案例：图文卡片 */

.case-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }

.case-grid.cols-2 { grid-template-columns: repeat(2, 1fr); }

.case-grid .item { position: relative; display: flex; flex-direction: column; height: 100%; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; transition: transform .2s ease, box-shadow .2s ease; }

.case-grid .item:hover { transform: translateY(-4px); box-shadow: var(--shadow); }

.case-grid .item:hover .cover-img-56 > img { transform: translate(-50%,-50%) scale(1.05); }

.case-grid .item .text { display: flex; flex-direction: column; flex: 1 1 auto; padding: 1.25rem 1.35rem; }

.case-grid .item h3 { font-size: 1.05rem; font-weight: 600; line-height: 1.5; margin-bottom: .6rem; color: var(--ink); transition: color .2s linear; }

.case-grid .item:hover h3 { color: var(--brand); }

.case-grid .item p { color: var(--ink-2); font-size: .92rem; line-height: 1.78; margin-bottom: 0; }

.case-grid .item span.case-more { display: inline-block; margin-top: auto; padding-top: 10px; color: var(--brand); font-size: .85rem; }

.case-grid .item > a { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 3; }

@media (max-width: 991.98px) { .case-grid, .case-grid.cols-2 { grid-template-columns: 1fr; } }

/* FAQ：手写 JS 切 .show */

.cta h2 { color: #fff; }

.cta p { margin-bottom: 1.5rem; }

.cta .btn-light { border-radius: 999px; padding: .7rem 1.8rem; font-weight: 600; font-size: .95rem; line-height: 1.5; color: var(--brand-dark); background: #fff; border: none; box-shadow: 0 6px 18px rgba(0,0,0,.12); transition: transform .15s ease, box-shadow .15s ease, background .2s ease; }

.cta .btn-ghost { border-radius: 999px; padding: .7rem 1.8rem; font-weight: 600; font-size: .95rem; line-height: 1.5; color: #fff; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.45); backdrop-filter: blur(4px); transition: transform .15s ease, background .2s ease, border-color .2s ease; }