/* 页面级样式 — 提取自 网站前端模板/solutions.html */
/* ================= 解决方案页专属布局（文档库） ================= */
:root{--sol-art-op:.15} /* 深色模式下 Hero 背景图透明度 10% */
html[data-theme="light"]{--sol-art-op:.15}
.sol-hero{position:relative;overflow:hidden;padding:140px 0 70px;
background-image:
radial-gradient(ellipse 55% 80% at 90% 0%,rgba(139,92,246,.12),transparent 60%),
radial-gradient(ellipse 45% 60% at 5% 90%,rgba(34,211,238,.1),transparent 60%);
background-repeat:no-repeat;background-color:var(--bg)}
/* 背景图独立成层，便于控制透明度 */
.sol-hero::before{content:"";position:absolute;inset:0;pointer-events:none;
background:url("/assets/images/banner5.jpg") center/cover no-repeat;opacity:var(--sol-art-op)}
.sol-hero>*{position:relative;z-index:1}
.sol-hero h1{font-size:clamp(34px,5vw,54px);font-weight:900}
/* 手机端：hero 渐变标题是 fit-content 收缩块，text-align:center 管不到，需 margin auto 居中 */
@media(max-width:600px){
.sol-hero h1{margin-left:auto;margin-right:auto}
}
.sol-hero .sub{margin-top:16px;color:var(--txt2);font-size:16px;max-width:640px}
/* --- 方案库：两个渐变头文档面板 --- */
.sol-library{padding:40px 0 110px;display:grid;gap:44px}
.doc-panel{border-radius:24px;border:1px solid var(--line);overflow:hidden;background:linear-gradient(170deg,var(--panel),var(--bg2))}
.doc-panel-head{position:relative;padding:34px 38px;overflow:hidden;display:flex;align-items:center;gap:22px;border-bottom:1px solid var(--line)}
.doc-panel-head.web{background:linear-gradient(120deg,rgba(34,211,238,.16),rgba(59,130,246,.1) 55%,rgba(34,211,238,.05))}
.doc-panel-head.mon{background:linear-gradient(120deg,rgba(139,92,246,.16),rgba(59,130,246,.1) 55%,rgba(139,92,246,.05))}
.doc-panel-head::after{content:"";position:absolute;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.06),transparent 70%);top:-120px;right:-40px}
.doc-panel-head .icon-box{width:66px;height:66px;border-radius:18px;display:grid;place-items:center;font-size:32px;flex:none;background:rgba(255,255,255,.06);border:1px solid var(--line2)}
.doc-panel-head h2{font-size:clamp(20px,2.6vw,28px);font-weight:800;position:relative;z-index:1}
.doc-panel-head small{display:block;font-family:var(--mono);font-size:11px;color:var(--txt3);letter-spacing:.22em;margin-top:6px;font-weight:400}
.doc-panel-head .cnt{margin-left:auto;text-align:right;flex:none;position:relative;z-index:1}
.doc-panel-head .cnt b{font-family:var(--mono);font-size:34px;font-weight:700;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;display:block;line-height:1}
.doc-panel-head .cnt span{font-size:11.5px;color:var(--txt3)}
/* --- 文件卡网格 --- */
.doc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr));gap:16px;padding:28px}
@media (max-width:560px){ .doc-grid{grid-template-columns:1fr;padding:20px 14px;gap:12px} }
.doc-card{display:flex;align-items:center;gap:16px;padding:20px 22px;border-radius:14px;border:1px solid var(--line);
background:var(--veil);transition:.35s cubic-bezier(.22,.9,.3,1);position:relative;overflow:hidden}
.doc-card:hover{transform:translateY(-4px);border-color:var(--cyan);background:var(--veil2);box-shadow:0 14px 36px rgba(0,0,0,.25)}
.doc-card .file{width:46px;height:56px;flex:none;position:relative}
.doc-card .file::before{content:"";position:absolute;inset:0;border-radius:6px;background:linear-gradient(160deg,var(--panel2),var(--panel));border:1px solid var(--line2)}
.doc-card .file::after{content:"";position:absolute;top:0;right:0;width:14px;height:14px;background:var(--panel2);border-left:1px solid var(--line2);border-bottom:1px solid var(--line2);clip-path:polygon(100% 0,0 0,100% 100%)}
.doc-card .file .em{position:absolute;inset:0;display:grid;place-items:center;font-size:20px;z-index:1}
.doc-card .info{min-width:0}
.doc-card h4{font-size:14.5px;font-weight:600;line-height:1.5;color:var(--txt2);transition:.3s;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.doc-card:hover h4{color:var(--txt)}
.doc-card .fmeta{margin-top:8px;display:flex;gap:14px;font-family:var(--mono);font-size:11px;color:var(--txt3)}
.doc-card .fmeta .tag{color:var(--cyan)}
.doc-card .arrow{margin-left:auto;color:var(--txt3);transition:.3s;flex:none;transform:translateX(-4px);opacity:0}
.doc-card:hover .arrow{transform:none;opacity:1;color:var(--cyan)}
.doc-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2.5px;background:var(--grad);transform:scaleY(0);transition:.35s}
.doc-card:hover::before{transform:scaleY(1)}
/* --- 底部咨询横幅 --- */
.sol-cta{border-radius:24px;padding:52px 40px;text-align:center;position:relative;overflow:hidden;border:1px solid var(--line2);
background:linear-gradient(130deg,rgba(34,211,238,.1),rgba(139,92,246,.12))}
.sol-cta h3{font-size:clamp(20px,3vw,28px);font-weight:800}
.sol-cta p{margin-top:12px;color:var(--txt2)}
@media(max-width:640px){
.sol-library{padding:40px 20px 110px}
}
.faq-list{max-width:900px;margin:8px auto 0;display:grid;gap:14px}
.faq-item{position:relative;overflow:hidden;--accent:#22d3ee;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.02));border:1px solid rgba(120,160,200,.16);border-left:3px solid var(--accent);border-radius:16px;padding:20px 22px;transition:.35s cubic-bezier(.4,0,.2,1);box-shadow:0 6px 22px -16px var(--accent)}
.faq-item h3{position:relative;font-size:16.5px;font-weight:700;margin:0 0 8px;color:var(--txt)}
.faq-item h3::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:9px;background:var(--accent);box-shadow:0 0 10px var(--accent);vertical-align:middle}
.faq-item p{position:relative;margin:0;color:var(--txt2);line-height:1.85;font-size:14.5px}
.faq-item:hover{border-color:var(--accent);transform:translateY(-3px);box-shadow:0 14px 38px -12px var(--accent)}
.faq-item:nth-child(1){--accent:#22d3ee}
.faq-item:nth-child(2){--accent:#3b82f6}
.faq-item:nth-child(3){--accent:#8b5cf6}