/*
 * site-bundle.css — 由 build_css.py 自动合并（请勿手工编辑本文件）
 * 源顺序: inline > mobile > optimize > eycitHeader > eycitFab > design-system > tech-layer > utilities
 * 修改请改对应源文件后重新生成。
 */
/* ===== inline.css ===== */
/* 易云城IT运维服务 - 完整样式 v2 */
*{box-sizing:border-box}
:root{--primary:#1a6fd4;--primary-light:#e8f0fe;--primary-dark:#1452a5;--secondary:#1e3a5f;--accent:#10b981;--accent-light:#d1fae5;--bg-white:#fff;--bg-light:#f8fafc;--bg-gray:#f1f5f9;--text-dark:#1e293b;--text:#334155;--text-gray:#64748b;--text-light:#94a3b8;--border:#e2e8f0;--border-light:#f1f5f9;--radius:12px;--radius-sm:8px;--radius-xs:4px;--shadow:0 2px 12px rgba(0,0,0,.06);--shadow-sm:0 1px 4px rgba(0,0,0,.04);--shadow-lg:0 8px 30px rgba(0,0,0,.08);--font-main:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif}
html{font-size:16px;-webkit-text-size-adjust:100%}
body{font-family:var(--font-main);color:var(--text-dark);background:var(--bg-light);margin:0;line-height:1.6}
a{color:var(--primary);text-decoration:none}
a:hover{color:var(--primary-dark)}
img{max-width:100%;height:auto;display:block}
ul,ol{list-style:none;padding:0;margin:0}
.container{width:100%;max-width:1180px;margin:0 auto;padding:0 20px}
/* 防止grid布局被内容撑爆 */
main{min-width:0;overflow-wrap:anywhere}
/* 顶部公告条 */
.top-bar{background:var(--secondary);color:rgba(255,255,255,.85);font-size:13px;padding:7px 0}
.top-bar .container{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:5px}
.top-bar-left{display:flex;align-items:center;gap:15px}
.top-bar-left i{color:var(--accent);font-size:12px}
.top-bar-right{display:flex;align-items:center;gap:12px}
.top-bar-right a{color:rgba(255,255,255,.8);font-size:12px}
.top-bar-right a:hover{color:#fff}
.ml-20{margin-left:15px}
/* 主导航 */
.main-header{background:var(--bg-white);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:100;box-shadow:var(--shadow-sm)}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:70px}
.logo a{display:flex;align-items:center;text-decoration:none}
.logo-text{display:flex;align-items:center;gap:8px}
.logo-icon{font-size:28px;color:var(--primary)}
.logo-name{font-size:1.25rem;font-weight:800;color:var(--text-dark)}
.main-nav ul{display:flex;align-items:center;gap:4px}
.main-nav li a{display:block;padding:8px 16px;font-size:14px;font-weight:600;color:var(--text);border-radius:4px;transition:all .2s}
.main-nav li a:hover{background:var(--primary-light);color:var(--primary)}
.main-nav li.active>a{background:var(--primary-light);color:var(--primary);font-weight:700}
.main-nav .dropdown{display:none;position:absolute;background:var(--bg-white);border-radius:var(--radius-sm);box-shadow:var(--shadow-lg);padding:8px;min-width:180px;z-index:200}
.main-nav li.has-dropdown{position:relative}
.main-nav li.has-dropdown:hover>.dropdown{display:block}
.main-nav .dropdown li a{padding:8px 14px;font-size:13px;white-space:nowrap}
/* 按钮 */
.btn{display:inline-flex;align-items:center;gap:6px;padding:10px 22px;border-radius:50px;font-weight:600;font-size:14px;border:none;cursor:pointer;transition:all .25s;text-decoration:none;line-height:1.4}
.btn-primary{background:var(--primary);color:#fff}
.btn-primary:hover{background:var(--primary-dark);color:#fff}
.btn-sm{padding:7px 16px;font-size:13px}
.btn-block{display:flex;width:100%;justify-content:center}
.btn-white{background:#fff;color:var(--primary)}
.btn-accent{background:var(--accent);color:#fff}
.btn-lg{padding:14px 28px;font-size:15px}
.btn-outline{background:transparent;border:2px solid var(--primary);color:var(--primary)}
/* 英雄区 */
.hero{background:linear-gradient(135deg,#0f172a 0%,#1a3a6e 50%,#1a6fd4 100%);padding:60px 0;color:#fff}
.hero-inner{display:grid;grid-template-columns:1fr 340px;gap:40px;align-items:start}
.hero-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:50px;padding:5px 16px;font-size:13px;margin-bottom:20px;color:rgba(255,255,255,.8)}
.hero-badge .dot{width:8px;height:8px;background:var(--accent);border-radius:50%}
.hero-title{font-size:2.2rem;font-weight:800;line-height:1.25;margin-bottom:12px}
.hero-title .highlight{color:var(--accent)}
.hero-subtitle{font-size:14px;color:rgba(255,255,255,.65);margin-bottom:8px;line-height:1.5}
.hero-desc{font-size:15px;color:rgba(255,255,255,.75);margin-bottom:24px;line-height:1.6}
.hero-btns{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:30px}
.hero-stats{display:flex;gap:24px;flex-wrap:wrap}
.hero-stat{text-align:center}
.hero-stat-num{font-size:1.8rem;font-weight:800;color:var(--accent)}
.hero-stat-label{font-size:12px;color:rgba(255,255,255,.5);margin-top:2px}
.hero-card{background:rgba(255,255,255,.08);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.15);border-radius:var(--radius);padding:24px}
.hero-service-list{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.hero-service-item{display:flex;align-items:center;gap:8px;padding:8px 12px;background:rgba(255,255,255,.06);border-radius:var(--radius-xs);color:rgba(255,255,255,.85);font-size:13px;transition:all .2s}
.hero-service-item:hover{background:rgba(255,255,255,.12);color:#fff}
.hero-service-item i{color:var(--accent);width:16px;text-align:center}
/* 三步引导卡片 */
.guide-three-step{padding:40px 0;background:var(--bg-light)}
.guide-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.guide-card{background:var(--bg-white);border-radius:var(--radius);padding:28px;border:1px solid var(--border);transition:all .3s;text-decoration:none;display:block;position:relative}
.guide-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}
.guide-card-icon{font-size:36px;margin-bottom:14px}
.guide-card-title{font-size:1.1rem;font-weight:700;color:var(--text-dark);margin-bottom:8px}
.guide-card-desc{font-size:14px;color:var(--text-gray);line-height:1.6;margin-bottom:14px}
.guide-card-link{font-size:14px;font-weight:600}
.guide-card--blue .guide-card-link{color:var(--primary)}
.guide-card--green .guide-card-link{color:var(--accent)}
.guide-card--orange .guide-card-link{color:#f59e0b}
/* 区块通用 */
.section{padding:50px 0}
.section-header{text-align:center;margin-bottom:35px}
.section-badge{display:inline-flex;align-items:center;gap:6px;background:var(--primary-light);color:var(--primary);padding:4px 14px;border-radius:50px;font-size:13px;font-weight:700;margin-bottom:12px}
.section-title{font-size:1.7rem;font-weight:800;color:var(--text-dark);margin-bottom:10px;line-height:1.3}
.section-subtitle{font-size:15px;color:var(--text-gray);max-width:600px;margin:0 auto;line-height:1.6}
.section-more{text-align:center;margin-top:30px}
/* 服务卡片 */
.services-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px}
.service-card{background:var(--bg-white);border-radius:var(--radius);padding:28px;border:1px solid var(--border);transition:all .3s;position:relative;text-decoration:none;display:block}
.service-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-3px);border-color:var(--primary-light)}
.service-icon{width:50px;height:50px;background:var(--primary-light);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;margin-bottom:16px;font-size:22px;color:var(--primary)}
.service-name{font-size:1.05rem;font-weight:700;color:var(--text-dark);margin-bottom:8px}
.service-desc{font-size:13px;color:var(--text-gray);line-height:1.7;margin-bottom:12px}
.service-price{font-size:12px;color:var(--accent);font-weight:600}
.service-arrow{position:absolute;top:24px;right:20px;color:var(--text-light);font-size:14px;opacity:0;transition:all .3s}
.service-card:hover .service-arrow{opacity:1;right:16px}
/* 统计数字区 */
.stats-section{padding:50px 0;background:linear-gradient(135deg,var(--secondary),#0f1d33)}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center}
.stat-item{padding:20px}
.stat-num{font-size:2.5rem;font-weight:800;color:#fff;margin-bottom:6px}
.stat-unit{font-size:1.2rem;color:var(--accent);font-weight:600}
.stat-label{font-size:14px;color:rgba(255,255,255,.6)}
/* 面包屑 */
.breadcrumb{background:var(--bg-white);border-bottom:1px solid var(--border-light);padding:12px 0;font-size:13px}
.breadcrumb-inner{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.breadcrumb-inner a{color:var(--text-gray)}
.breadcrumb-inner a:hover{color:var(--primary)}
.breadcrumb-sep{color:var(--text-light);font-size:14px}
/* 侧边栏 */
.sidebar-widget{background:var(--bg-white);border-radius:var(--radius);padding:22px;margin-bottom:20px;border:1px solid var(--border)}
.sidebar-widget-title{font-size:1rem;font-weight:700;color:var(--text-dark);margin-bottom:16px;padding-bottom:10px;border-bottom:2px solid var(--primary-light)}
/* 文章详情 */
.article-detail{background:var(--bg-white);border-radius:var(--radius);padding:35px;box-shadow:var(--shadow);border:1px solid var(--border)}
.article-detail-title{font-size:1.6rem;font-weight:800;color:var(--text-dark);line-height:1.35;margin-bottom:16px}
.article-detail-meta{display:flex;flex-wrap:wrap;gap:16px;font-size:13px;color:var(--text-gray);margin-bottom:25px;padding-bottom:20px;border-bottom:1px solid var(--border-light)}
/* 文章列表 */
.article-card{display:flex;gap:16px;padding:18px;background:var(--bg-white);border-radius:var(--radius-sm);border:1px solid var(--border);transition:all .25s}
.article-card:hover{box-shadow:var(--shadow);border-color:var(--primary-light)}
.article-card-img{width:220px;min-height:160px;border-radius:var(--radius-xs);overflow:hidden;flex-shrink:0}
.article-card-img img{width:100%;height:100%;object-fit:cover}
.article-card-body{flex:1}
.article-card-title{font-size:1rem;font-weight:700;color:var(--text-dark);line-height:1.4}
.article-card-excerpt{font-size:14px;color:var(--text-gray);line-height:1.6}
.article-card-meta{font-size:12px;color:var(--text-light);display:flex;gap:14px}
/* 文章标签 */
.article-tags{margin-top:25px;padding-top:18px;border-top:1px solid var(--border-light);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.article-tag{display:inline-block;padding:3px 12px;background:var(--primary-light);color:var(--primary);font-size:12px;border-radius:50px}
.article-tag:hover{background:var(--primary);color:#fff}
/* 页脚 */
.main-footer{margin-top:auto;background:var(--secondary);color:rgba(255,255,255,.7)}
.footer-bottom{padding:20px 0;border-top:1px solid rgba(255,255,255,.08);font-size:13px}
.footer-bottom-inner{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px}
.footer-bottom a{color:rgba(255,255,255,.6)}
.footer-bottom a:hover{color:#fff}
/* 文章内容 */
.article-content{font-size:15px;line-height:1.85;color:var(--text)}
.article-content h2{font-size:1.25rem;font-weight:700;color:var(--text-dark);margin:28px 0 14px;padding-bottom:8px;border-bottom:1px solid var(--border-light)}
.article-content h3{font-size:1.1rem;font-weight:700;color:var(--text-dark);margin:24px 0 10px}
.article-content p{margin-bottom:16px}
.article-content ul,.article-content ol{margin:10px 0 16px 20px;list-style:disc}
.article-content ol{list-style:decimal}
.article-content li{margin-bottom:6px}
.article-content code{background:var(--bg-light);padding:2px 6px;border-radius:3px;font-size:.9em;color:#e83e8c}
.article-content pre{background:#1e293b;color:#e2e8f0;padding:18px;border-radius:var(--radius-sm);overflow-x:auto;font-size:13px;margin:16px 0}
.article-content pre code{background:none;color:inherit;padding:0}
.article-content blockquote{border-left:4px solid var(--primary);padding:12px 18px;margin:16px 0;background:var(--primary-light);border-radius:0 var(--radius-sm) var(--radius-sm) 0}
.article-content img{margin:20px auto;border-radius:var(--radius-sm);max-width:100%}
.article-content table{width:100%;border-collapse:collapse;margin:16px 0;font-size:14px}
.article-content th,.article-content td{padding:10px 14px;border:1px solid var(--border);text-align:left}
.article-content th{background:var(--primary-light);font-weight:700}
.article-content tr:nth-child(even){background:var(--bg-light)}
/* 响应式 */
@media(max-width:992px){.hero-inner{grid-template-columns:1fr}.hero-card{margin-top:30px}.guide-cards{grid-template-columns:1fr}.main-nav li a{padding:6px 10px;font-size:13px}.services-grid{grid-template-columns:repeat(2,1fr)}.stats-grid{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:1fr 1fr}}
@media(max-width:768px){.top-bar-right{display:none}.main-nav{display:none}.header-inner{height:55px}.logo-name{font-size:1rem}.services-grid{grid-template-columns:1fr}.hero-title{font-size:1.6rem}.section-title{font-size:1.3rem}.stats-grid{grid-template-columns:repeat(2,1fr);gap:12px}.stat-num{font-size:2rem}.guide-cards{grid-template-columns:1fr}.hero-stats{justify-content:center}.article-card{flex-direction:column}.article-card-img{width:100%;height:180px}.footer-bottom-inner{flex-direction:column;text-align:center}.float-contact{display:none}.footer-grid{grid-template-columns:1fr}}
@media(max-width:480px){.section{padding:32px 0}.article-detail{padding:18px}.article-detail-title{font-size:1.25rem}.article-content{font-size:14px}.sidebar-widget{padding:16px}}

/* 为什么选择我们 - 8大优势卡片 */
.why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.why-item{background:var(--bg-white);border-radius:var(--radius);padding:18px 18px;border:1px solid var(--border);transition:all .3s;text-align:center;display:flex;flex-direction:column;align-items:center}
.why-item:hover{box-shadow:var(--shadow-sm);transform:translateY(-2px);border-color:var(--primary-light)}
.why-icon{width:44px;height:44px;background:linear-gradient(135deg,var(--primary),#3b82f6);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 10px;font-size:20px;color:#fff;flex-shrink:0}
.why-title{font-size:1rem;font-weight:700;color:var(--text-dark);margin-bottom:4px}
.why-desc{font-size:12px;color:var(--text-gray);line-height:1.6}
@media(max-width:992px){.why-grid{grid-template-columns:repeat(2,1fr);gap:10px}}
@media(max-width:768px){.why-grid{grid-template-columns:repeat(2,1fr);gap:8px}.why-item{padding:14px 12px}}
@media(max-width:480px){.why-grid{grid-template-columns:1fr;gap:8px}.why-item{padding:14px 12px}}

/* 文章分类筛选药丸 */
.cat-filter-wrap{background:var(--bg-white);border:1px solid var(--border);border-radius:var(--radius-sm);padding:14px 16px;margin-bottom:20px}
.cat-filter-label{font-size:13px;font-weight:700;color:var(--text-dark);margin-bottom:10px;display:flex;align-items:center;gap:6px}
.cat-filter-scroll{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px;-webkit-overflow-scrolling:touch}
.cat-pill{display:flex;align-items:center;gap:4px;padding:6px 14px;border-radius:50px;font-size:13px;font-weight:600;color:var(--text);background:var(--bg-light);border:1px solid var(--border);text-decoration:none;white-space:nowrap;transition:all .15s;flex-shrink:0}
.cat-pill:hover{background:var(--primary-light);color:var(--primary);border-color:var(--primary-light)}
.cat-pill.active{background:var(--primary);color:#fff;border-color:var(--primary)}
.cat-pill-icon{font-size:12px;opacity:.7}
.cat-pill.active .cat-pill-icon{opacity:1}
.cat-pill-name{font-size:inherit}
.cat-pill-count{font-size:11px;background:rgba(0,0,0,.08);padding:0 6px;border-radius:10px;line-height:1.6}
.cat-pill.active .cat-pill-count{background:rgba(255,255,255,.2)}
/* 子分类标签 */
.sub-cat-wrap{display:flex;align-items:center;gap:6px;padding:10px 0;margin-bottom:16px;flex-wrap:wrap;border-bottom:1px solid var(--border-light)}
.sub-cat-label{font-size:12px;color:var(--text-light);font-weight:600;margin-right:4px}
.sub-pill{display:inline-flex;align-items:center;gap:4px;padding:4px 12px;border-radius:50px;font-size:12px;font-weight:600;color:var(--text-gray);background:var(--bg-white);border:1px solid var(--border);text-decoration:none;transition:all .15s}
.sub-pill:hover{background:var(--primary-light);color:var(--primary);border-color:var(--primary-light)}
.sub-pill.active{background:var(--primary);color:#fff;border-color:var(--primary)}
.sub-pill-count{font-size:10px;color:var(--text-light);margin-left:2px}
.sub-pill.active .sub-pill-count{color:rgba(255,255,255,.7)}
/* 侧边分类项 */
.sidebar-cat-item{display:flex;align-items:center;gap:8px;padding:10px 14px;font-size:13px;color:var(--text);text-decoration:none;border-radius:var(--radius-xs);transition:all .15s;margin-bottom:2px}
.sidebar-cat-item:hover{background:var(--primary-light);color:var(--primary)}
.sidebar-cat-item.active{background:var(--primary);color:#fff;font-weight:600}

/* 装机配置器 */
.builder-budget-pills{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.budget-pill{display:inline-flex;padding:7px 16px;border-radius:50px;font-size:13px;font-weight:600;color:var(--primary);background:rgba(26,111,212,.08);border:1px solid rgba(26,111,212,.15);text-decoration:none;transition:all .2s}
.budget-pill:hover{background:var(--primary);color:#fff;border-color:var(--primary)}
.builder-layout{display:grid;grid-template-columns:1fr 320px;gap:24px;align-items:start}
.builder-main{min-width:0}
.builder-sidebar{position:sticky;top:90px}
.builder-scene-bar{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap}
.scene-btn{display:inline-flex;padding:8px 16px;border-radius:8px;font-size:13px;font-weight:600;color:var(--text);background:var(--bg-white);border:1px solid var(--border);text-decoration:none;cursor:pointer;transition:all .2s}
.scene-btn:hover{background:var(--primary-light);color:var(--primary);border-color:var(--primary-light)}
.scene-btn.active{background:var(--primary);color:#fff;border-color:var(--primary)}
.builder-row{background:var(--bg-white);border:1px solid var(--border);border-radius:var(--radius-sm);overflow:hidden;margin-bottom:12px}
.builder-row-label{display:flex;align-items:center;gap:10px;padding:12px 16px;font-size:14px;font-weight:700;color:var(--text-dark);background:var(--bg-light);border-bottom:1px solid var(--border-light);cursor:pointer}
.builder-row-label i{color:var(--primary)}
.builder-row-icon{transition:transform .2s}
.builder-products{padding:12px;display:none}
.builder-products.open{display:block}
.builder-products-inner{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.builder-product-item{display:flex;gap:10px;padding:10px;border-radius:8px;border:1px solid var(--border);cursor:pointer;transition:all .15s;position:relative}
.builder-product-item:hover{border-color:var(--primary-light);background:var(--bg-light)}
.builder-product-item.selected{border-color:var(--primary);background:var(--primary-light)}
.none-item{text-align:center;padding:30px;color:var(--text-light);font-size:13px}
.bpi-content{flex:1;min-width:0}
.bpi-name{font-size:13px;font-weight:600;color:var(--text-dark);margin-bottom:4px;line-height:1.3}
.bpi-spec{font-size:11px;color:var(--text-light);margin-bottom:4px}
.bpi-tags{display:flex;flex-wrap:wrap;gap:3px;margin-bottom:4px}
.bpi-tag{font-size:10px;padding:1px 6px;border-radius:4px;background:var(--bg-gray);color:var(--text-gray)}
.bpi-price{font-size:16px;font-weight:800;color:var(--primary)}
.bpi-badge{position:absolute;top:4px;right:4px;font-size:9px;padding:1px 6px;border-radius:4px;background:#f59e0b;color:#fff;font-weight:700}
.bpi-stock{font-size:10px;color:var(--accent)}
.peripheral-btn,.peripheral-item{border:1px dashed var(--border);border-radius:8px;padding:20px;text-align:center;font-size:13px;color:var(--text-light);cursor:pointer;transition:all .2s}
.peripheral-btn:hover,.peripheral-item:hover{background:var(--bg-light);border-color:var(--primary-light);color:var(--primary)}
.builder-summary{background:var(--bg-white);border-radius:var(--radius);padding:24px;border:1px solid var(--border)}
.builder-summary-title{font-size:1rem;font-weight:700;color:var(--text-dark);margin-bottom:16px;padding-bottom:10px;border-bottom:2px solid var(--primary-light);display:flex;align-items:center;gap:8px}
.builder-total{display:flex;justify-content:space-between;align-items:center;padding:14px;background:var(--primary-light);border-radius:8px;margin:16px 0}
.builder-total-price{font-size:1.5rem;font-weight:900;color:var(--primary)}
.builder-clear-btn{display:block;width:100%;padding:10px;border:1px solid var(--border);border-radius:6px;background:var(--bg-white);color:var(--text-gray);font-size:13px;cursor:pointer;text-align:center;transition:all .15s;margin-top:8px}
.builder-clear-btn:hover{background:var(--bg-light);color:var(--text)}
@media(max-width:992px){.builder-layout{grid-template-columns:1fr}.builder-sidebar{position:static}}
@media(max-width:768px){.cat-filter-scroll{gap:4px}.cat-pill{padding:5px 10px;font-size:12px}.builder-products-inner{grid-template-columns:1fr}.builder-budget-pills{width:100%}.builder-budget-pills .budget-pill{flex:1;text-align:center}}
@media(max-width:480px){.why-grid{grid-template-columns:1fr;gap:10px}}

/* 页脚 */
.footer-main{padding:40px 0 20px;background:var(--secondary);color:rgba(255,255,255,.7)}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.5fr;gap:30px}
.footer-col h3{font-size:1.1rem;font-weight:700;color:#fff;margin-bottom:16px;display:flex;align-items:center;gap:8px}
.footer-col h4{font-size:14px;font-weight:700;color:#fff;margin-bottom:12px}
.footer-col ul li{margin-bottom:8px}
.footer-col ul li a{color:rgba(255,255,255,.6);font-size:13px}
.footer-col ul li a:hover{color:#fff}
.footer-desc{font-size:13px;color:rgba(255,255,255,.5);line-height:1.7;margin-bottom:16px}
.footer-social{display:flex;gap:10px}
.footer-social a{width:36px;height:36px;background:rgba(255,255,255,.08);border-radius:50%;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.6);font-size:16px;transition:all .2s;text-decoration:none}
.footer-social a:hover{background:var(--primary);color:#fff}
.phone-num{color:var(--accent);font-size:1.1rem;font-weight:700;text-decoration:none}
.qrcode-hint{font-size:12px;color:rgba(255,255,255,.4);display:flex;align-items:center;gap:4px}
.mt-15{margin-top:15px}
.text-green{color:var(--accent)}
/* 页脚联系方式 */
.footer-contact ul li{display:flex;align-items:flex-start;gap:10px;margin-bottom:14px}
.footer-contact ul li i{color:var(--accent);font-size:16px;margin-top:2px;flex-shrink:0;width:18px;text-align:center}
.footer-contact ul li strong{display:block;font-size:12px;color:rgba(255,255,255,.5);margin-bottom:2px;font-weight:400}
.footer-contact ul li span,.footer-contact ul li a{font-size:14px;color:rgba(255,255,255,.85);display:block}
.footer-contact ul li a:hover{color:#fff}
/* section-bg */
.section-bg{background:var(--bg-gray)}
/* 软件卡片图标占位 */
.software-icon-placeholder{width:56px;height:56px;background:linear-gradient(135deg,var(--primary),var(--secondary));border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;font-size:24px;color:#fff;margin-bottom:14px}
/* 联系咨询区域 */
.contact-section{background:linear-gradient(135deg,#1e293b 0%,#0f172a 100%);color:#fff;padding:60px 0}
.contact-inner{display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:start}
.contact-left{padding-right:20px}
.contact-title{font-size:1.8rem;font-weight:800;color:#fff;margin-bottom:15px}
.contact-subtitle{font-size:15px;color:rgba(255,255,255,.7);margin-bottom:30px;line-height:1.6}
.contact-info-list{display:flex;flex-direction:column;gap:16px}
.contact-info-item{display:flex;align-items:flex-start;gap:14px;padding:16px;background:rgba(255,255,255,.06);border-radius:var(--radius-sm);border:1px solid rgba(255,255,255,.1)}
.contact-info-item i{font-size:22px;color:var(--accent);width:28px;text-align:center;margin-top:2px;flex-shrink:0}
.contact-info-item div{flex:1}
.contact-info-item strong{display:block;font-size:14px;color:#fff;margin-bottom:4px}
.contact-info-item span{font-size:13px;color:rgba(255,255,255,.7);display:block;line-height:1.5}
.contact-right{position:sticky;top:90px}
.contact-form{background:var(--bg-white);border-radius:var(--radius);padding:30px;box-shadow:var(--shadow-lg)}
.form-title{font-size:1.15rem;font-weight:800;color:var(--text-dark);margin-bottom:20px;padding-bottom:14px;border-bottom:2px solid var(--primary-light);display:flex;align-items:center;gap:8px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}
.form-label{font-size:13px;font-weight:600;color:var(--text-dark);margin-bottom:4px;display:block}
.form-tip{font-size:12px;color:var(--text-light);margin-top:10px}
@media(max-width:768px){.contact-inner{grid-template-columns:1fr}.contact-left{padding-right:0}.form-row{grid-template-columns:1fr}.contact-right{position:static}}
/* 浮动联系 */
.float-contact{position:fixed;right:0;top:50%;transform:translateY(-50%);z-index:9999;display:flex;flex-direction:column;gap:1px}
.float-item{width:48px;min-height:56px;background:var(--primary);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;position:relative;transition:all .3s;font-size:18px;border:none;padding:6px 4px;gap:3px}
.float-item:hover{background:var(--primary-dark);width:52px}
.float-item a{color:#fff;text-decoration:none;display:flex;flex-direction:column;align-items:center;gap:3px;width:100%}
.float-item i{font-size:18px}
.float-item span{font-size:10px;line-height:1;font-weight:600}
.float-urgent{background:#dc2626}
.float-urgent:hover{background:#b91c1c}
.float-wechat{background:var(--accent)}
.float-wechat:hover{background:#059669}
.float-quote{background:#f59e0b}
.float-quote:hover{background:#d97706}
.float-phone{background:var(--primary)}
.float-top{background:#475569}
.float-top:hover{background:#334155}
.float-popup{display:none;position:absolute;right:56px;top:50%;transform:translateY(-50%);background:#fff;border-radius:10px;padding:16px;box-shadow:0 8px 30px rgba(0,0,0,.15);min-width:200px;z-index:9998}
.float-item:hover .float-popup{display:block}
.float-popup-left{right:56px}
.float-urgent-tip{background:#fef2f2;border:1px solid #fecaca;color:#991b1b;font-size:13px;white-space:nowrap}
/* 移动端底部工具栏 */
.mobile-action-bar{position:fixed;bottom:0;left:0;right:0;z-index:999;background:var(--bg-white);border-top:1px solid var(--border);display:none;align-items:center;justify-content:space-around;padding:6px 0 env(safe-area-inset-bottom,6px);box-shadow:0 -2px 12px rgba(0,0,0,.06)}
.mobile-action-bar a,.mobile-action-bar button{display:flex;flex-direction:column;align-items:center;gap:2px;color:var(--text-gray);text-decoration:none;font-size:10px;font-weight:600;padding:4px 6px;border:none;background:none;cursor:pointer}
.mobile-action-bar a i,.mobile-action-bar button i{font-size:20px;margin-bottom:1px}
.mobile-action-bar .bar-quote i{color:#f59e0b}
.mobile-action-bar .bar-call i{color:#dc2626}
.mobile-action-bar .bar-wechat i{color:var(--accent)}
/* 软件卡片 - 美观三列布局 */
.software-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:18px;margin-top:20px}
.software-card{background:var(--bg-white);border-radius:14px;overflow:hidden;border:1px solid var(--border);transition:all .35s;text-decoration:none;display:flex;flex-direction:column}
.software-card:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,0.06);border-color:var(--primary-light)}
.software-card-icon-wrap{padding:16px;display:flex;justify-content:center;background:linear-gradient(180deg,var(--bg-light) 0%,var(--bg-white) 100%)}
.software-card-icon{width:52px;height:52px;border-radius:14px;object-fit:cover;box-shadow:0 2px 8px rgba(0,0,0,0.06)}
.software-card-icon-placeholder{width:52px;height:52px;border-radius:14px;background:linear-gradient(135deg,var(--primary),var(--secondary));display:flex;align-items:center;justify-content:center;font-size:22px;color:#fff;box-shadow:0 2px 8px rgba(var(--primary-rgb),0.15)}
.software-card-body{flex:1;padding:0 18px 18px;display:flex;flex-direction:column}
.software-card-title{font-size:15px;font-weight:700;color:var(--text-dark);margin-bottom:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.software-card-tags{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:10px}
.software-card-tag{padding:2px 8px;border-radius:4px;font-size:11px;font-weight:600;background:#f1f5f9;color:#64748b}
.software-card-tag-free{background:#d1fae5;color:#065f46}
.software-card-desc{font-size:13px;color:var(--text-gray);line-height:1.6;margin-bottom:auto;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.software-card-footer{display:flex;justify-content:space-between;align-items:center;margin-top:12px;padding-top:10px;border-top:1px solid var(--border)}
.software-card-meta{font-size:12px;color:var(--text-light);display:flex;align-items:center;gap:4px}
.software-card-download{width:28px;height:28px;border-radius:50%;background:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center;font-size:13px;transition:all .2s}
.software-card:hover .software-card-download{background:var(--primary-dark);transform:translateX(4px)}
@media(max-width:992px){.software-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}}
@media(max-width:768px){.software-grid{grid-template-columns:1fr}.software-card-icon-wrap{padding:14px}.software-card-icon,.software-card-icon-placeholder{width:48px;height:48px}}
/* 分页 */
.pagination{display:flex;justify-content:center;gap:6px;margin-top:30px}
.pagination a,.pagination span{display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:36px;padding:0 10px;border:1px solid var(--border);border-radius:var(--radius-xs);font-size:14px;color:var(--text);background:var(--bg-white);text-decoration:none;transition:all .2s}
.pagination a:hover{border-color:var(--primary);color:var(--primary)}
.pagination .active{background:var(--primary);color:#fff;border-color:var(--primary)}
/* 表单 */
.form-control{width:100%;padding:10px 14px;border:1px solid var(--border);border-radius:var(--radius-xs);font-size:14px;outline:none;transition:border .2s;color:var(--text-dark)}
.form-control:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(26,111,212,.1)}
/* 报价弹窗 */
.quote-modal-overlay{align-items:center;justify-content:center}
.quote-type-btn{cursor:pointer}
.quote-type-btn:hover{border-color:var(--primary)!important}
.quote-type-btn.selected{border-color:var(--primary)!important;background:var(--primary-light)}
.service-radio:checked+.quote-type-btn{border-color:var(--primary)!important;background:var(--primary-light)}
/* 响应式补充 */
@media(max-width:768px){.footer-grid{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}.float-contact{display:none}}
@media(max-width:480px){.footer-grid{grid-template-columns:1fr}}

/* ===== 硬件产品中心样式（IT设备） ===== */
/* 通用按钮 */
.btn-secondary{display:inline-flex;align-items:center;gap:6px;padding:10px 22px;border-radius:50px;font-weight:600;font-size:14px;border:2px solid var(--border);cursor:pointer;transition:all .25s;text-decoration:none;line-height:1.4;background:var(--bg-white);color:var(--text)}
.btn-secondary:hover{background:var(--bg-light);color:var(--text-dark);border-color:var(--text-light)}

/* 硬件英雄区 */
.hw-hero{background:linear-gradient(135deg,#0f172a 0%,#1e3a5f 50%,#2563eb 100%);padding:40px 0;color:#fff}
.hw-hero-inner{display:flex;gap:30px;align-items:center;justify-content:space-between}
.hw-hero-title{font-size:1.8rem;font-weight:800;margin-bottom:12px;display:flex;align-items:center;gap:12px}
.hw-hero-sub{font-size:15px;color:rgba(255,255,255,.7);margin-bottom:20px;line-height:1.6}
.hw-hero-stats{display:flex;gap:20px;flex-wrap:wrap}
.hw-hero-stat{text-align:center;min-width:80px}
.hw-hero-stat strong{font-size:1.5rem;font-weight:800;color:var(--accent);display:block}
.hw-hero-stat span{font-size:12px;color:rgba(255,255,255,.5)}
.hw-hero-actions{display:flex;flex-direction:column;gap:10px;flex-shrink:0}
.hw-hero-btn-build,.hw-hero-btn-call{display:flex;flex-direction:column;align-items:center;padding:14px 28px;border-radius:12px;text-decoration:none;text-align:center;transition:all .25s}
.hw-hero-btn-build{background:var(--accent);color:#fff}
.hw-hero-btn-build:hover{background:#059669;color:#fff;transform:translateY(-2px)}
.hw-hero-btn-build span{font-weight:700;font-size:14px}
.hw-hero-btn-build small{font-size:11px;opacity:.8}
.hw-hero-btn-call{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:#fff}
.hw-hero-btn-call:hover{background:rgba(255,255,255,.2);color:#fff}
.hw-hero-btn-call span{font-weight:700;font-size:14px}
.hw-hero-btn-call small{font-size:11px;opacity:.8}

/* 侧边分类 */
.hw-sidebar-cat{background:var(--bg-white);border-radius:var(--radius);border:1px solid var(--border);overflow:hidden}
.hw-sidebar-cat-title{padding:14px 16px;font-weight:700;font-size:15px;color:var(--text-dark);border-bottom:1px solid var(--border);background:var(--bg-light);display:flex;align-items:center;gap:8px}
.hw-sidebar-cat-item{display:flex;align-items:center;gap:8px;padding:11px 16px;font-size:14px;color:var(--text);text-decoration:none;border-bottom:1px solid var(--border-light);transition:all .15s}
.hw-sidebar-cat-item:last-child{border-bottom:none}
.hw-sidebar-cat-item:hover{background:var(--primary-light);color:var(--primary)}
.hw-sidebar-cat-item.active{background:var(--primary);color:#fff;font-weight:600}
.hw-sidebar-cat-item em{margin-left:auto;font-style:normal;font-size:12px;color:var(--text-light);background:var(--bg-gray);padding:1px 8px;border-radius:10px}
.hw-sidebar-cat-item.active em{background:rgba(255,255,255,.2);color:rgba(255,255,255,.8)}

/* 方案卡片 */
.hw-solution-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.hw-solution-card{background:var(--bg-white);border-radius:var(--radius);padding:24px;border:1px solid var(--border);text-decoration:none;position:relative;transition:all .25s;display:block}
.hw-solution-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px);border-color:var(--primary-light)}
.hw-solution-card.popular{border-color:#fbbf24}
.hw-solution-badge{position:absolute;top:12px;right:12px;background:linear-gradient(135deg,#f59e0b,#ef4444);color:#fff;font-size:10px;font-weight:700;padding:2px 10px;border-radius:20px}
.hw-solution-name{font-size:14px;font-weight:700;color:var(--text-dark);margin-bottom:6px}
.hw-solution-price{font-size:13px;color:var(--primary);margin-bottom:2px}
.hw-solution-price strong{font-size:1.3rem}
.hw-solution-budget{font-size:11px;color:var(--text-light);margin-bottom:8px}
.hw-solution-tags{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:10px}
.hw-solution-tags span{background:var(--primary-light);color:var(--primary);font-size:11px;padding:2px 8px;border-radius:4px;font-weight:600}
.hw-solution-cta{font-size:13px;color:var(--primary);font-weight:600}

/* 工具栏 */
.hw-list-toolbar{display:flex;align-items:center;gap:12px;margin-bottom:20px;flex-wrap:wrap;background:var(--bg-white);padding:14px 18px;border-radius:var(--radius-sm);border:1px solid var(--border)}
.hw-sort-tabs{display:flex;gap:4px;flex-shrink:0}
.hw-sort-tab{padding:6px 12px;border-radius:6px;font-size:13px;color:var(--text-gray);text-decoration:none;transition:all .15s}
.hw-sort-tab:hover{background:var(--bg-light);color:var(--text-dark)}
.hw-sort-tab.active{background:var(--primary);color:#fff;font-weight:600}

/* 产品网格 */
.hw-product-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px}
.hw-product-card{background:var(--bg-white);border-radius:var(--radius);border:1px solid var(--border);overflow:hidden;position:relative;transition:all .3s}
.hw-product-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px);border-color:var(--primary-light)}
.hw-card-badge{position:absolute;top:10px;left:10px;z-index:2;font-size:11px;font-weight:700;padding:3px 10px;border-radius:4px;color:#fff}
.hw-card-badge.hot{background:linear-gradient(135deg,#ef4444,#f97316)}
.hw-card-badge.rec{background:linear-gradient(135deg,#3b82f6,#6366f1)}
.hw-card-img{display:block;background:#f8f9fa;height:180px;overflow:hidden;text-decoration:none;position:relative}
.hw-card-img img{width:100%;height:100%;object-fit:contain;padding:12px;transition:transform .2s}
.hw-card-img:hover img{transform:scale(1.03)}
.hw-card-icon-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:48px;color:var(--text-light);background:var(--bg-light)}
.hw-card-body{padding:16px}
.hw-card-cat{font-size:11px;color:var(--text-light);margin-bottom:6px;display:flex;align-items:center;gap:4px}
.hw-card-name{margin:0 0 8px;font-size:14px;font-weight:700;line-height:1.3}
.hw-card-name a{color:var(--text-dark);text-decoration:none}
.hw-card-name a:hover{color:var(--primary)}
.hw-card-specs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.hw-card-specs span{font-size:11px;color:var(--text-gray);background:var(--bg-light);padding:2px 8px;border-radius:4px}
.hw-card-specs span em{font-style:normal;color:var(--text-light);margin-right:3px}
.hw-card-footer{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.hw-card-price{display:flex;align-items:baseline;gap:1px}
.hw-price-sym{font-size:13px;font-weight:700;color:var(--primary)}
.hw-price-num{font-size:1.2rem;font-weight:800;color:var(--primary)}
.hw-stock{font-size:11px;font-weight:600;padding:2px 8px;border-radius:10px}
.hw-stock.in{background:#d1fae5;color:#065f46}
.hw-stock.pre{background:#fef3c7;color:#92400e}
.hw-stock.out{background:#fee2e2;color:#991b1b}
.hw-card-actions{display:flex;gap:6px}
.hw-card-btn{flex:1;padding:8px;border-radius:6px;font-size:12px;font-weight:600;text-decoration:none;text-align:center;transition:all .15s}
.hw-card-btn.detail{background:var(--primary-light);color:var(--primary)}
.hw-card-btn.detail:hover{background:var(--primary);color:#fff}
.hw-card-btn.add{background:var(--bg-light);color:var(--text-gray);display:flex;align-items:center;justify-content:center;flex:0 0 36px}
.hw-card-btn.add:hover{background:var(--primary-light);color:var(--primary)}

/* 服务承诺条 */
.hw-promise-bar{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:35px;padding:20px;background:var(--bg-white);border-radius:var(--radius);border:1px solid var(--border)}
.hw-promise-item-bar{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--text)}
.hw-promise-item-bar i{font-size:20px;color:var(--primary);width:28px;text-align:center}
.hw-promise-item-bar div strong{display:block;font-weight:700;font-size:13px;color:var(--text-dark)}
.hw-promise-item-bar div span{font-size:11px;color:var(--text-light)}

/* 硬件详情页 */
.hw-detail-card{background:var(--bg-white);border-radius:var(--radius);padding:30px;margin-bottom:25px;border:1px solid var(--border)}
.hw-detail-header{display:flex;align-items:center;gap:10px;margin-bottom:14px;flex-wrap:wrap}
.hw-detail-cat{background:var(--primary-light);color:var(--primary);padding:4px 12px;border-radius:6px;font-size:12px;font-weight:600;display:flex;align-items:center;gap:6px}
.hw-badge{display:inline-block;padding:3px 10px;border-radius:6px;font-size:11px;font-weight:700;color:#fff}
.hw-badge.hot{background:linear-gradient(135deg,#ef4444,#f97316)}
.hw-badge.rec{background:linear-gradient(135deg,#3b82f6,#6366f1)}
.hw-detail-title{font-size:1.5rem;font-weight:800;color:var(--text-dark);margin-bottom:14px;line-height:1.35}
.hw-detail-meta{display:flex;flex-wrap:wrap;gap:16px;font-size:13px;color:var(--text-gray);padding-bottom:16px;border-bottom:1px solid var(--border-light)}

/* 规格表 */
.hw-spec-table{background:var(--bg-light);border-radius:var(--radius-sm);overflow:hidden;margin:18px 0}
.hw-spec-title{padding:12px 16px;font-weight:700;font-size:14px;color:var(--text-dark);background:var(--border-light);display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--border)}
.hw-spec-table table{width:100%;border-collapse:collapse;font-size:13px}
.hw-spec-table th,.hw-spec-table td{padding:10px 16px;border-bottom:1px solid var(--border);text-align:left}
.hw-spec-table th{width:130px;color:var(--text-gray);font-weight:600;background:var(--bg-white)}
.hw-spec-table tr:last-child th,.hw-spec-table tr:last-child td{border-bottom:none}

/* 价格卡片 */
.hw-price-card{background:var(--bg-white);border-radius:var(--radius);padding:24px;border:1px solid var(--border);position:sticky;top:90px}
.hw-price-label{font-size:13px;color:var(--text-gray);margin-bottom:8px}
.hw-price-main{font-size:2rem;font-weight:800;color:var(--primary);margin-bottom:6px}
.hw-price-main span{font-size:inherit}
.hw-price-updated{font-size:12px;color:var(--text-light);margin-bottom:8px}
.hw-price-note{font-size:12px;color:var(--text-light);margin-bottom:16px;display:flex;align-items:center;gap:4px;padding:8px 12px;background:#fef9c3;border-radius:6px;color:#92400e}
.hw-btn-inquiry,.hw-btn-call{display:block;text-align:center;padding:12px;border-radius:8px;font-weight:700;font-size:14px;text-decoration:none;margin-bottom:10px;transition:all .2s}
.hw-btn-inquiry{background:var(--primary);color:#fff}
.hw-btn-inquiry:hover{background:var(--primary-dark);color:#fff}
.hw-btn-call{background:#dc2626;color:#fff}
.hw-btn-call:hover{background:#b91c1c;color:#fff}
.hw-promise-list{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:16px}
.hw-promise-item{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text);padding:8px 10px;background:var(--bg-light);border-radius:6px}
.hw-promise-item i{color:var(--accent);width:16px;text-align:center}

/* 迷你卡片 */
.hw-card-mini{display:flex;gap:12px;align-items:center;padding:14px;background:var(--bg-white);border-radius:var(--radius-sm);border:1px solid var(--border);text-decoration:none;transition:all .2s}
.hw-card-mini:hover{box-shadow:var(--shadow);border-color:var(--primary-light)}
.hw-card-mini-icon{width:44px;height:44px;background:var(--primary-light);border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:20px;color:var(--primary);flex-shrink:0}

/* 询价表单 */
.hw-inquiry-form-wrap{background:var(--bg-white);border-radius:var(--radius);padding:35px;border:1px solid var(--border)}
.hw-inquiry-title{font-size:1.3rem;font-weight:800;color:var(--text-dark);margin-bottom:6px;display:flex;align-items:center;gap:10px}
.hw-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.hw-form-group{display:flex;flex-direction:column;gap:6px}
.hw-form-group label{font-size:13px;font-weight:600;color:var(--text-dark)}
.hw-form-group label em{color:#ef4444}
.hw-form-group input,.hw-form-group textarea{padding:10px 14px;border:1px solid var(--border);border-radius:var(--radius-xs);font-size:14px;outline:none;transition:border .2s;color:var(--text-dark);font-family:inherit}
.hw-form-group input:focus,.hw-form-group textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(26,111,212,.1)}
.hw-form-full{grid-column:1/-1}
.hw-btn-submit{display:block;width:100%;padding:14px;background:var(--primary);color:#fff;border:none;border-radius:8px;font-weight:700;font-size:15px;cursor:pointer;transition:all .2s;margin-top:16px}
.hw-btn-submit:hover{background:var(--primary-dark)}

/* 硬件响应式 */
@media(max-width:992px){.hw-hero-inner{flex-direction:column}.hw-hero-actions{flex-direction:row;width:100%}.hw-hero-btn-build,.hw-hero-btn-call{flex:1}.hw-product-grid{grid-template-columns:repeat(2,1fr)}.hw-promise-bar{grid-template-columns:repeat(3,1fr)}.hw-form-grid{grid-template-columns:1fr}}
@media(max-width:768px){.hw-hero-title{font-size:1.4rem}.hw-hero-stats{gap:12px}.hw-product-grid{grid-template-columns:repeat(2,1fr)}.hw-promise-bar{grid-template-columns:repeat(2,1fr)}.hw-card-specs{display:none}.hw-detail-card{padding:20px}.hw-detail-title{font-size:1.2rem}.hw-price-card{position:static}}
@media(max-width:480px){.hw-product-grid{grid-template-columns:1fr}.hw-promise-bar{grid-template-columns:1fr}.hw-solution-grid{grid-template-columns:1fr}.hw-inquiry-form-wrap{padding:20px}
/* AI客服悬浮按钮样式 */
.float-ai{background:linear-gradient(135deg,#6366f1,#8b5cf6)}
.float-ai:hover{background:linear-gradient(135deg,#4f46e5,#7c3aed)}
}

/* ===== 转化率优化(CRO)动画样式 ===== */
@keyframes pulse-badge{0%,100%{opacity:1}50%{opacity:.7}}
@keyframes pulse-btn{0%,100%{transform:scale(1);box-shadow:0 6px 28px rgba(245,158,11,.4)}50%{transform:scale(1.03);box-shadow:0 8px 32px rgba(245,158,11,.5)}}
@keyframes pulse-green{0%{box-shadow:0 0 0 0 rgba(16,185,129,.6)}70%{box-shadow:0 0 0 8px rgba(16,185,129,0)}100%{box-shadow:0 0 0 0 rgba(16,185,129,0)}}
@keyframes bounce-subtle{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes glow-primary{0%,100%{box-shadow:0 0 0 0 rgba(26,111,212,.4)}50%{box-shadow:0 0 20px 4px rgba(26,111,212,.3)}}
@keyframes slideInUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

/* 服务卡片hover增强 */
.service-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-4px);border-color:var(--primary)}
.service-card:hover .service-icon{transform:scale(1.05);background:var(--primary);color:#fff}

/* CTA按钮脉冲 */
.btn-pulse{animation:pulse-btn 2s infinite}
.btn-glow{animation:glow-primary 2s infinite}

/* 信任徽章动画 */
.trust-badge{animation:bounce-subtle 3s infinite}

/* FAQ展开动画 */
.faq-answer{transition:all .3s ease}

/* 数字统计动画 */
.hero-stat-num{animation:fadeIn .5s ease-out}

/* 移动端优化 */
@media(max-width:768px){
.hero-title{font-size:1.5rem;line-height:1.35}
.hero-btns{flex-direction:column}
.hero-btns .btn{width:100%;justify-content:center}
.stats-grid{grid-template-columns:repeat(2,1fr)}
.faq-item{padding:14px 16px}
}
@media(max-width:480px){
.hero-title{font-size:1.3rem}
.hero-badge{font-size:11px;padding:4px 12px}
.btn-lg{padding:12px 20px;font-size:14px}
}
/* 浮动按钮脉冲 + 报价弹窗动画 */
@keyframes pulse-book{0%,100%{box-shadow:0 4px 20px rgba(249,115,22,0.5);transform:scale(1)}50%{box-shadow:0 6px 30px rgba(249,115,22,0.8);transform:scale(1.08)}}
.float-book:hover{animation-play-state:paused;transform:scale(1.12)!important}
@keyframes modalIn{from{opacity:0;transform:translateY(40px) scale(0.95)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes slideUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
.quote-modal-overlay{display:flex}
/* ===== mobile.css ===== */
/* ============================================
   易云城移动端响应式样式 mobile.css
   断点：768px（平板/手机）、480px（小屏手机）
   说明：旧 .main-nav / .mobile-menu-btn / .mobile-action-bar 移动菜单
        已被 .eycit-burger + .eycit-nav（header.js 控制）与
        .eycit-mobile-bar（EycitFab）替代，相关死代码已删除。
   ============================================ */

/* ===== 平板及以下 (≤992px) ===== */
@media (max-width: 992px) {
  .container { padding-left: 16px; padding-right: 16px; }

  /* 文章页两栏 → 单栏 */
  .article-layout,
  div[style*="grid-template-columns:minmax(0,1fr) 300px"] {
    grid-template-columns: 1fr !important;
  }

  /* 侧边栏移到下方 */
  .article-layout > aside,
  div[style*="grid-template-columns:minmax(0,1fr) 300px"] > aside {
    order: 2;
  }

  /* 服务卡片 3列 → 2列 */
  .services-grid { grid-template-columns: repeat(2, 1fr) !important; }

  /* 硬件产品 4列 → 2列 */
  .hw-product-grid { grid-template-columns: repeat(2, 1fr) !important; }
}

/* ===== 手机端 (≤768px) ===== */
@media (max-width: 768px) {
  /* body底部留空，避免被底部工具栏遮挡 */
  body { padding-bottom: 60px; }

  /* ---------- 通用布局调整 ---------- */
  .container { padding-left: 14px; padding-right: 14px; }

  /* 文章页两栏 → 单栏 */
  div[style*="grid-template-columns:minmax(0,1fr) 300px"] {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }

  /* 文章卡片：横向 → 纵向堆叠 */
  article[style*="grid-template-columns:220px minmax(0,1fr)"] {
    grid-template-columns: 1fr !important;
  }
  article[style*="grid-template-columns:220px minmax(0,1fr)"] > div:first-child {
    min-height: 120px !important;
    max-height: 140px;
  }

  /* 服务卡片 → 单列 */
  .services-grid { grid-template-columns: 1fr !important; }

  /* 硬件产品 → 单列 */
  .hw-product-grid { grid-template-columns: 1fr !important; }

  /* hero区域 */
  .hero-title { font-size: 1.5rem !important; }
  .hero-btns { flex-direction: column !important; }
  .hero-btns .btn { width: 100%; justify-content: center; }

  /* 分区标题 */
  .section-title { font-size: 1.3rem !important; }

  /* 信任数据条 → 2列 */
  div[style*="grid-template-columns:repeat(4,1fr)"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  /* 快速联系入口 → 2列 */
  div[style*="grid-template-columns:repeat(4,1fr)"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  /* 侧边栏热门文章 */
  .sidebar-widget { padding: 16px !important; }

  /* 浮动联系栏隐藏（已有底部工具栏替代） */
  .float-contact { display: none !important; }

  /* 表单网格 → 单列 */
  div[style*="grid-template-columns:1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }

  /* 分页 */
  .pagination a { padding: 6px 10px; font-size: 13px; }

  /* 底部footer */
  .footer-grid { grid-template-columns: 1fr 1fr !important; }
  .footer-brand { grid-column: 1 / -1 !important; }
}

/* ===== 小屏手机 (≤480px) ===== */
@media (max-width: 480px) {
  .hero-title { font-size: 1.3rem !important; }
  .hero-badge { font-size: 11px !important; padding: 4px 12px !important; }
  .btn-lg { padding: 12px 20px !important; font-size: 14px !important; }

  .section-title { font-size: 1.15rem !important; }
  .section-subtitle { font-size: 13px !important; }

  /* 文章标题 */
  h2 { font-size: 1rem !important; }

  /* 信任数据条 → 2列 */
  div[style*="grid-template-columns:repeat(4,1fr)"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  div[style*="grid-template-columns:repeat(2,1fr)"] {
    grid-template-columns: 1fr 1fr !important;
  }

  /* footer → 单列 */
  .footer-grid { grid-template-columns: 1fr !important; }

  /* 文章卡片封面更小 */
  article[style*="grid-template-columns:220px minmax(0,1fr)"] > div:first-child {
    min-height: 100px !important;
    max-height: 120px;
  }
}
/* ===== optimize.css ===== */
/* 易云城IT服务 - 网站优化样式表
 * 优化目标：减少垂直空间占用，压缩模块间距，优化字体大小
 * 使用方法：在 header.php 中 main.css 之后引入此文件
 */

/* =====================================================
   1. 全局基础优化
   ===================================================== */
:root {
  /* 减小基础字体大小 */
  --radius: 10px;
  --radius-sm: 6px;
  --shadow: 0 1px 8px rgba(0,0,0,.05);
  --shadow-sm: 0 1px 3px rgba(0,0,0,.03);
  --shadow-lg: 0 4px 20px rgba(0,0,0,.06);
}

html {
  font-size: 15px; /* 原为 16px */
}

body {
  line-height: 1.55; /* 原为 1.6，稍微紧凑 */
}

/* =====================================================
   2. 头部优化 - 减小区块高度
   ===================================================== */
.top-bar {
  padding: 5px 0; /* 原为 7px 0 */
  font-size: 12px; /* 原为 13px */
}

.main-header {
  box-shadow: var(--shadow-sm);
}

.header-inner {
  height: 60px; /* 原为 70px */
}

.logo-icon {
  font-size: 24px; /* 原为 28px */
}

.logo-name {
  font-size: 1.1rem; /* 原为 1.25rem */
}

.main-nav li a {
  padding: 6px 12px; /* 原为 8px 16px */
  font-size: 13px; /* 原为 14px */
}

/* =====================================================
   3. 区块间距优化 - 核心优化点
   ===================================================== */
.section {
  padding: 36px 0; /* 原为 50px 0，减少 28% */
}

.section-header {
  margin-bottom: 24px; /* 原为 35px，减少 31% */
}

.section-badge {
  padding: 3px 10px; /* 原为 4px 14px */
  font-size: 12px; /* 原为 13px */
  margin-bottom: 8px; /* 原为 12px */
}

.section-title {
  font-size: 1.45rem; /* 原为 1.7rem，减少 15% */
  margin-bottom: 8px; /* 原为 10px */
  line-height: 1.25; /* 原为 1.3 */
}

.section-subtitle {
  font-size: 14px; /* 原为 15px */
  line-height: 1.5; /* 原为 1.6 */
}

.section-more {
  margin-top: 20px; /* 原为 30px，减少 33% */
}

/* =====================================================
   4. 英雄区（Hero）优化
   ===================================================== */
.hero {
  padding: 40px 0 50px; /* 原为 60px 0 70px，大幅减少 */
}

.hero-title {
  font-size: 2rem; /* 原为 2.4rem，减少 17% */
  line-height: 1.2; /* 原为 1.25 */
  margin-bottom: 12px; /* 原为 16px */
}

.hero-subtitle {
  font-size: 0.85rem; /* 原为 0.9rem */
  margin-bottom: 10px; /* 原为 14px */
}

.hero-desc {
  font-size: 14px; /* 原为 15px */
  margin-bottom: 20px; /* 原为 28px，减少 29% */
  line-height: 1.5;
}

.hero-badge {
  margin-bottom: 12px; /* 原为 16px */
  font-size: 13px; /* 原为 14px */
}

.hero-btns {
  gap: 12px; /* 原为 16px */
  margin-bottom: 24px; /* 原为 32px，减少 25% */
}

.hero-stats {
  gap: 20px; /* 原为 28px */
  padding-top: 20px; /* 原为 28px，减少 29% */
}

.hero-stat-num {
  font-size: 1.6rem; /* 原为 1.8rem */
}

.hero-stat-label {
  font-size: 12px; /* 原为 13px */
}

/* 英雄区右侧卡片 */
.hero-card {
  padding: 20px; /* 原为 24px */
}

/* =====================================================
   5. 服务卡片优化
   ===================================================== */
.services-grid {
  gap: 16px; /* 原为 20px */
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); /* 原为 260px */
}

.service-card {
  padding: 20px; /* 原为 28px，减少 29% */
}

.service-icon {
  width: 42px; /* 原为 50px */
  height: 42px; /* 原为 50px */
  font-size: 18px; /* 原为 22px */
  margin-bottom: 12px; /* 原为 16px */
}

.service-name {
  font-size: 0.95rem; /* 原为 1.05rem */
  margin-bottom: 6px; /* 原为 8px */
}

.service-desc {
  font-size: 12px; /* 原为 13px */
  line-height: 1.6; /* 原为 1.7 */
  margin-bottom: 10px; /* 原为 12px */
}

/* =====================================================
   6. 统计区优化
   ===================================================== */
.stats-section {
  padding: 36px 0; /* 原为 50px 0，减少 28% */
}

.stats-grid {
  gap: 16px; /* 原为 24px */
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); /* 原为 180px */
}

.stat-item {
  padding: 16px 10px; /* 原为 20px */
}

.stat-num {
  font-size: 2rem; /* 原为 2.5rem，减少 20% */
  margin-bottom: 4px; /* 原为 6px */
}

.stat-unit {
  font-size: 1rem; /* 原为 1.2rem */
}

.stat-label {
  font-size: 13px; /* 原为 14px */
}

/* =====================================================
   7. 按钮优化
   ===================================================== */
.btn {
  padding: 8px 18px; /* 原为 10px 22px */
  font-size: 13px; /* 原为 14px */
}

.btn-lg {
  padding: 11px 26px; /* 原为 13px 30px */
  font-size: 14px; /* 原为 15px */
}

.btn-sm {
  padding: 6px 14px; /* 原为 7px 16px */
  font-size: 12px; /* 原为 13px */
}

/* =====================================================
   8. 文章卡片优化
   ===================================================== */
.article-card {
  padding: 14px; /* 原为 18px */
  gap: 12px; /* 原为 16px */
}

.article-card-img {
  width: 180px; /* 原为 220px，减少 18% */
  min-height: 130px; /* 原为 160px，减少 19% */
}

.article-card-title {
  font-size: 0.95rem; /* 原为 1rem */
  line-height: 1.35; /* 原为 1.4 */
}

.article-card-excerpt {
  font-size: 13px; /* 原为 14px */
  line-height: 1.5;
}

.article-card-meta {
  font-size: 11px; /* 原为 12px */
  gap: 12px; /* 原为 14px */
}

/* =====================================================
   9. 文章详情页优化
   ===================================================== */
.article-detail {
  padding: 24px; /* 原为 35px，减少 31% */
}

.article-detail-title {
  font-size: 1.35rem; /* 原为 1.6rem，减少 16% */
  line-height: 1.3; /* 原为 1.35 */
  margin-bottom: 12px; /* 原为 16px */
}

.article-detail-meta {
  font-size: 12px; /* 原为 13px */
  gap: 12px; /* 原为 16px */
  margin-bottom: 18px; /* 原为 25px，减少 28% */
  padding-bottom: 14px; /* 原为 20px */
}

.article-content {
  font-size: 14px; /* 原为 15px */
  line-height: 1.75; /* 原为 1.85 */
}

.article-content h2 {
  font-size: 1.1rem; /* 原为 1.25rem */
  margin: 22px 0 10px; /* 原为 28px 0 14px */
  padding-bottom: 6px; /* 原为 8px */
}

.article-content h3 {
  font-size: 1rem; /* 原为 1.1rem */
  margin: 18px 0 8px; /* 原为 24px 0 10px */
}

.article-content p {
  margin-bottom: 12px; /* 原为 16px，减少 25% */
}

.article-content pre {
  padding: 14px; /* 原为 18px */
  font-size: 12px; /* 原为 13px */
  margin: 12px 0; /* 原为 16px 0 */
}

.article-content blockquote {
  padding: 10px 14px; /* 原为 12px 18px */
  margin: 12px 0; /* 原为 16px 0 */
}

.article-content table {
  font-size: 13px; /* 原为 14px */
}

.article-content th,
.article-content td {
  padding: 8px 12px; /* 原为 10px 14px */
}

/* =====================================================
   10. 侧边栏优化
   ===================================================== */
.sidebar-widget {
  padding: 18px; /* 原为 22px */
  margin-bottom: 16px; /* 原为 20px */
}

.sidebar-widget-title {
  font-size: 0.95rem; /* 原为 1rem */
  margin-bottom: 12px; /* 原为 16px */
  padding-bottom: 8px; /* 原为 10px */
}

/* =====================================================
   11. 面包屑优化
   ===================================================== */
.breadcrumb {
  padding: 10px 0; /* 原为 12px 0 */
  font-size: 12px; /* 原为 13px */
}

/* =====================================================
   12. 标签优化
   ===================================================== */
.article-tags {
  margin-top: 18px; /* 原为 25px */
  padding-top: 14px; /* 原为 18px */
  gap: 6px; /* 原为 8px */
}

.article-tag {
  padding: 2px 10px; /* 原为 3px 12px */
  font-size: 11px; /* 原为 12px */
}

/* =====================================================
   13. 页脚优化
   ===================================================== */
.footer-bottom {
  padding: 16px 0; /* 原为 20px 0 */
  font-size: 12px; /* 原为 13px */
}

/* =====================================================
   14. 容器宽度优化
   ===================================================== */
.container {
  max-width: 1100px; /* 原为 1180px，减少 7% */
  padding: 0 16px; /* 原为 0 20px */
}

/* =====================================================
   15. 响应式优化 - 平板端
   ===================================================== */
@media (max-width: 992px) {
  html {
    font-size: 15px;
  }
  
  .section {
    padding: 30px 0; /* 原为 50px 0（响应式已改小，但可以进一步优化） */
  }
  
  .section-title {
    font-size: 1.25rem; /* 原为 1.3rem（响应式已改小） */
  }
  
  .hero-title {
    font-size: 1.7rem;
  }
  
  .services-grid {
    gap: 14px;
  }
  
  .article-card-img {
    width: 160px;
    min-height: 120px;
  }
}

/* =====================================================
   16. 响应式优化 - 手机端
   ===================================================== */
@media (max-width: 768px) {
  html {
    font-size: 14px;
  }
  
  .section {
    padding: 26px 0; /* 原为 32px 0（响应式） */
  }
  
  .section-header {
    margin-bottom: 18px; /* 原为 20px */
  }
  
  .section-title {
    font-size: 1.15rem; /* 原为 1.3rem */
  }
  
  .hero {
    padding: 30px 0 36px;
  }
  
  .hero-title {
    font-size: 1.5rem;
  }
  
  .stats-grid {
    gap: 10px;
  }
  
  .stat-num {
    font-size: 1.7rem;
  }
  
  .article-detail {
    padding: 16px; /* 原为 18px（响应式） */
  }
  
  .article-detail-title {
    font-size: 1.15rem; /* 原为 1.25rem */
  }
  
  .article-content {
    font-size: 13px; /* 原为 14px（响应式） */
  }
  
  .sidebar-widget {
    padding: 14px; /* 原为 16px（响应式） */
  }
}

/* =====================================================
   17. 响应式优化 - 小手机端
   ===================================================== */
@media (max-width: 480px) {
  .section {
    padding: 22px 0;
  }
  
  .hero-title {
    font-size: 1.3rem;
  }
  
  .hero-desc {
    font-size: 13px;
  }
  
  .btn-lg {
    padding: 10px 20px;
    font-size: 13px;
  }
}

/* =====================================================
   18. 三步走引导卡片优化（新增区块）
   ===================================================== */
.guide-cards {
  gap: 14px; /* 原为 16px */
}

.guide-card {
  padding: 18px 16px; /* 原为 22px 20px */
}

.guide-card-icon {
  font-size: 24px; /* 原为 28px */
  margin-bottom: 8px; /* 原为 12px */
}

.guide-card-title {
  font-size: 0.9rem; /* 原为 1rem */
  margin-bottom: 4px; /* 原为 6px */
}

.guide-card-desc {
  font-size: 0.8rem; /* 原为 0.85rem */
  line-height: 1.4;
}

/* =====================================================
   19. 免费工具条优化（新增区块）
   ===================================================== */
/* 工具条整体高度压缩 */
.section[style*="background:linear-gradient"][style*="#0f3460"] {
  padding: 0;
}

.section[style*="background:linear-gradient"][style*="#0f3460"] .container {
  padding: 18px 16px; /* 原为 22px 20px */
}

/* =====================================================
   20. 通用间距工具类（新增）
   ===================================================== */
/* 减少标题下方间距 */
.mt-compact {
  margin-top: 12px !important;
}

.mb-compact {
  margin-bottom: 12px !important;
}

.pt-compact {
  padding-top: 12px !important;
}

.pb-compact {
  padding-bottom: 12px !important;
}
/* ===== eycitHeader.css ===== */
/* ============================================================
 * EycitHeader — 易云城统一头部样式 v1.0
 * 合并：promoBanner + top-bar + main-header 三段为单一头部系统
 * ============================================================ */

/* ============== 头部整体 ============== */

.eycit-header {
  background: var(--bg-white);
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.04);
}

/* 上方信息条（替代原 top-bar，轻量化） */
.eycit-header__meta {
  background: var(--secondary);
  color: rgba(255, 255, 255, 0.85);
  font-size: 12.5px;
  padding: 5px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.eycit-header__meta-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.eycit-header__meta-left {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}
.eycit-header__meta-left i {
  color: var(--accent);
  font-size: 11px;
  margin-right: 3px;
}

.eycit-header__meta-right {
  display: flex;
  align-items: center;
  gap: 10px;
}
.eycit-header__meta-right a {
  color: rgba(255, 255, 255, 0.8);
  font-size: 12px;
  transition: color 0.2s;
}
.eycit-header__meta-right a:hover { color: #fff; }
.eycit-header__meta-right span { color: rgba(255, 255, 255, 0.75); }

/* ---- 服务承诺条：响应速度卖点 + 促销（合并原促销条，头部由 3 层压为 2 层）---- */
.eycit-header__meta-left .meta-speed{
  color:#8fdcff;
  font-weight:600;
}
.eycit-header__meta-left .meta-speed i{
  color:#22d3ff;
  font-size:11px;
}
.eycit-header__meta-right .meta-promo{
  background:rgba(0,200,255,.14);
  color:#a5e4ff;
  padding:2px 10px;
  border-radius:999px;
  font-weight:600;
  border:1px solid rgba(34,211,255,.36);
  white-space:nowrap;
}
.eycit-header__meta-right .meta-promo i{color:inherit;margin-right:2px}
.eycit-header__meta-right .meta-promo:hover{
  background:#22d3ff;
  color:#02263a;
  border-color:#22d3ff;
}

@media (max-width: 768px) {
  .eycit-header__meta-left > span:nth-child(n+2) { display: none; }
  .eycit-header__meta-right > span { display: none; }
}

/* ============== 主导航 ============== */

.eycit-header__nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 64px;
  gap: 12px;
}

.eycit-logo {
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  color: var(--text-dark);
  font-weight: 800;
  font-size: 17px;
  flex-shrink: 0;
}
.eycit-logo i {
  font-size: 24px;
  color: var(--primary);
  display: flex;
}
.eycit-logo:hover { color: var(--primary-dark); }

@media (max-width: 768px) {
  .eycit-header__nav { height: 56px; }
  .eycit-logo { font-size: 15px; }
  .eycit-logo i { font-size: 21px; }
}

/* 主菜单 */
.eycit-nav {
  display: flex;
  align-items: center;
  gap: 2px;
  flex: 1;
  justify-content: center;
}

.eycit-nav > li > a {
  display: block;
  padding: 8px 14px;
  font-size: 14px;
  font-weight: 600;
  color: var(--text);
  border-radius: 8px;
  transition: all 0.2s;
  white-space: nowrap;
}
.eycit-nav > li > a:hover {
  background: var(--primary-light);
  color: var(--primary);
}
.eycit-nav > li.active > a {
  background: var(--primary-light);
  color: var(--primary);
  font-weight: 700;
}

/* 导航特殊项：2026-09-20 专业度收敛，取消金色/绿色杂色，统一进主色体系 */
.eycit-nav > li > a.eycit-nav--vip {
  color: var(--text);
  font-weight: 600;
}
.eycit-nav > li > a.eycit-nav--vip i {
  color: var(--accent-dark);
}
.eycit-nav > li > a.eycit-nav--vip:hover,
.eycit-nav > li.active > a.eycit-nav--vip {
  color: var(--primary);
}
.eycit-nav > li > a.eycit-nav--tool {
  color: var(--text);
  font-weight: 600;
  position: relative;
}
.eycit-nav > li > a.eycit-nav--tool:hover,
.eycit-nav > li.active > a.eycit-nav--tool {
  color: var(--primary);
}
.eycit-nav__badge {
  position: absolute;
  top: -4px;
  right: -6px;
  background: var(--bg-gray);
  color: var(--text-gray);
  border: 1px solid var(--border);
  font-size: 10px;
  padding: 1px 7px;
  border-radius: 50px;
  font-weight: 600;
  line-height: 1.7;
  white-space: nowrap;
}

/* 导航内唯一 CTA 按钮（在线预约）：整站只允许这一个亮色按钮 */
.eycit-nav__cta-item { margin-left: 6px; }
.eycit-nav > li > a.eycit-nav--cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 18px;
  border-radius: 50px;
  background: linear-gradient(135deg, #22d3ff, #0b8fe8);
  color: #04101f;
  font-weight: 600;
  font-size: 14px;
  box-shadow: 0 4px 14px rgba(34, 211, 255, .35);
  transition: transform .2s, box-shadow .2s;
}
.eycit-nav > li > a.eycit-nav--cta:hover {
  color: #04101f;
  background: linear-gradient(135deg, #3ddcff, #0b8fe8);
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(34, 211, 255, .5);
}
.eycit-nav > li > a.eycit-nav--cta i { font-size: 13px; }

/* 下拉箭头图标 */
.eycit-nav .chev {
  font-size: 11px;
  margin-left: 3px;
  transition: transform 0.2s;
}

.eycit-nav .has-dropdown { position: relative; }
.eycit-nav .dropdown {
  display: none;
  position: absolute;
  top: calc(100% + 2px);
  left: 50%;
  transform: translateX(-50%);
  background: var(--bg-white);
  border-radius: 10px;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
  padding: 6px;
  min-width: 200px;
  border: 1px solid var(--border);
}
.eycit-nav .has-dropdown:hover > .dropdown { display: block; }
.eycit-nav .dropdown li a {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 14px;
  border-radius: 6px;
  font-size: 13.5px;
  white-space: nowrap;
}
.eycit-nav .dropdown li a:hover {
  background: var(--primary-light);
  color: var(--primary);
}
.eycit-nav .dropdown li a i { color: var(--primary); width: 16px; }

@media (max-width: 1024px) {
  .eycit-nav { display: none; }
  .eycit-nav.open {
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--bg-white);
    padding: 12px;
    border-bottom: 1px solid var(--border);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
    align-items: stretch;
    gap: 4px;
    max-height: calc(100vh - var(--header-h) - 8px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    animation: nav-drawer-in 0.26s var(--fab-spring, ease);
  }
  .eycit-nav.open > li > a { padding: 12px; }
  .eycit-nav.open .dropdown {
    position: static;
    transform: none;
    box-shadow: none;
    border: none;
    background: var(--bg-light);
    margin-top: 4px;
  }
  .eycit-nav.open .dropdown li a { padding: 10px 14px; }
  .eycit-nav .has-dropdown > a .chev { transition: transform 0.2s; }
  .eycit-nav .has-dropdown.mobile-open > a .chev { transform: rotate(180deg); }
}

/* 汉堡菜单 */
.eycit-burger {
  display: none;
  width: 36px;
  height: 36px;
  background: var(--bg-light);
  border: none;
  border-radius: 8px;
  cursor: pointer;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 4px;
  padding: 0;
}

/* 全局搜索切换按钮（桌面/移动通用） */
.eycit-search-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border: none;
  background: var(--bg-light);
  border-radius: 8px;
  cursor: pointer;
  color: var(--text-dark);
  font-size: 16px;
  margin-left: 6px;
  transition: background 0.2s, color 0.2s, transform 0.15s;
}
.eycit-search-toggle:hover { background: var(--primary-light); color: var(--primary); }
.eycit-search-toggle:active { transform: scale(0.94); }
.eycit-search-toggle[aria-expanded="true"] { background: var(--primary-light); color: var(--primary); }

/* 全局搜索面板（下拉式，复用文章搜索后端） */
.eycit-search-panel {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: var(--bg-white);
  border-bottom: 1px solid var(--border);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.1);
  padding: 14px 0;
  z-index: 988;
  animation: nav-drawer-in 0.26s ease;
}
.eycit-search-panel.open { display: block; }
.eycit-search-panel__inner {
  display: flex;
  align-items: center;
  gap: 10px;
}
.eycit-search-panel__inner > i { color: var(--text-gray); font-size: 16px; }
.eycit-search-panel__inner input {
  flex: 1;
  min-width: 0;
  padding: 11px 14px;
  border: 1.5px solid var(--border);
  border-radius: 10px;
  font-size: 15px;
  font-family: inherit;
  color: var(--text-dark);
  background: var(--bg-light);
  outline: none;
  transition: border-color 0.2s, box-shadow 0.2s, background 0.2s;
}
.eycit-search-panel__inner input:focus {
  border-color: var(--primary);
  background: #fff;
  box-shadow: 0 0 0 3px rgba(26, 111, 212, 0.12);
}
.eycit-search-panel__btn {
  flex-shrink: 0;
  padding: 11px 22px;
  border: none;
  border-radius: 10px;
  background: linear-gradient(135deg, #22d3ff, #0b8fe8);
  color: #04101f;
  font-weight: 700;
  font-size: 14px;
  cursor: pointer;
  font-family: inherit;
  transition: transform 0.15s, box-shadow 0.2s;
}
.eycit-search-panel__btn:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(34, 211, 255, 0.4); }
.eycit-search-panel__close {
  flex-shrink: 0;
  width: 38px;
  height: 38px;
  border: none;
  background: var(--bg-light);
  border-radius: 8px;
  color: var(--text-gray);
  font-size: 16px;
  cursor: pointer;
  display: none;            /* 桌面端可点外部关闭，故隐藏；移动端显示 */
  align-items: center;
  justify-content: center;
}
.eycit-search-panel__close:hover { background: var(--border); color: var(--text-dark); }

@media (max-width: 768px) {
  .eycit-search-panel__close { display: flex; }
  .eycit-search-panel__btn { padding: 11px 16px; }
  .eycit-search-panel__inner { gap: 8px; }
}
.eycit-burger span {
  width: 18px;
  height: 2px;
  background: var(--text-dark);
  border-radius: 2px;
  transition: all 0.25s;
}
/* main.js 加的是 .open，header.js 加的是 .is-open，两个都支持 X 动画 */
.eycit-burger.open span:nth-child(1),
.eycit-burger.is-open span:nth-child(1) { transform: rotate(45deg) translate(5px, 5px); }
.eycit-burger.open span:nth-child(2),
.eycit-burger.is-open span:nth-child(2) { opacity: 0; }
.eycit-burger.open span:nth-child(3),
.eycit-burger.is-open span:nth-child(3) { transform: rotate(-45deg) translate(5px, -5px); }

@media (max-width: 1024px) {
  .eycit-burger { display: flex; }
}

/* 滚动后头部紧凑效果（main.js initNavScroll 加 .scrolled） */
.eycit-header.scrolled {
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

/* ============== 兼容旧选择器（平滑迁移） ============== */

.top-bar, .main-header { display: none; }  /* 旧类标记为不再使用，新样式在 .eycit-header 体系 */

/* ============== 顶层促销条 + 头部组合 ============== */

/* 整个头部（促销条 + 信息条 + 导航）作为一个 sticky 组合吸顶 */
.eycit-header-wrap {
  position: sticky;
  top: 0;
  z-index: 990;
}

/* 移动端导航遮罩层（视觉聚焦 + 点击关闭，使抽屉更贴近原生 App 体验） */
.eycit-nav-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(4, 16, 31, 0.5);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
  z-index: 985;                 /* 低于头部 wrap(990)，高于页面内容，故头部本身仍可见 */
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s ease, visibility 0.25s ease;
}
.eycit-nav-backdrop.show {
  opacity: 1;
  visibility: visible;
}

@keyframes nav-drawer-in {
  from { opacity: 0; transform: translateY(-10px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* 让 body 滚动时头部有紧凑感 */
@supports (backdrop-filter: blur(10px)) {
  .eycit-header { backdrop-filter: blur(10px); background: rgba(255, 255, 255, 0.92); }
}
/* ===== eycitFab.css ===== */
/* ============================================================
 * EycitFab — 易云城统一浮窗样式 v1.0
 * 单一来源，PC + Mobile 通用
 * 依赖：inline.css :root 变量
 * ============================================================ */

:root {
  --fab-fab-size: 50px;
  --fab-fab-size-mobile: 46px;
  --fab-bar-height: 60px;
  --fab-bar-height-mobile: 56px;
  --fab-z-fab: 9990;
  --fab-z-bar: 9980;
  --fab-z-modal: 9999;
  --fab-z-promo: 999;
  --fab-z-mobile-bar: 9985;
  --fab-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* ============== FAB 圆按钮（PC 右侧浮动） ============== */

.eycit-fab-stack {
  position: fixed;
  right: 16px;
  bottom: 24px;
  z-index: var(--fab-z-fab);
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-end;
  transform: translateZ(0); /* 提升到 GPU 层，移动端动画更顺 */
}

.eycit-fab {
  width: var(--fab-fab-size);
  height: var(--fab-fab-size);
  border-radius: 50%;
  background: var(--primary);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  text-decoration: none;
  box-shadow: 0 4px 12px rgba(26, 111, 212, 0.35);
  transition: transform 0.2s var(--fab-spring), box-shadow 0.2s;
  position: relative;
  border: none;
}

.eycit-fab:hover {
  transform: translateY(-2px) scale(1.05);
  box-shadow: 0 6px 16px rgba(26, 111, 212, 0.45);
}

.eycit-fab:active { transform: translateY(0) scale(0.97); }

.eycit-fab i { font-size: 19px; line-height: 1; }
.eycit-fab .eycit-fab__label {
  position: absolute;
  right: calc(var(--fab-fab-size) + 8px);
  background: var(--text-dark);
  color: #fff;
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s;
}
.eycit-fab:hover .eycit-fab__label { opacity: 1; }

/* FAB 类型色 */
.eycit-fab--wechat { background: var(--accent); box-shadow: 0 4px 12px rgba(16, 185, 129, 0.35); }
.eycit-fab--wechat:hover { box-shadow: 0 6px 16px rgba(16, 185, 129, 0.45); }
.eycit-fab--quote { background: linear-gradient(135deg, #f97316, #ea580c); box-shadow: 0 4px 12px rgba(249, 115, 22, 0.4); }
.eycit-fab--quote:hover { box-shadow: 0 6px 16px rgba(249, 115, 22, 0.5); }
.eycit-fab--phone { background: linear-gradient(135deg, #059669, #10b981); box-shadow: 0 4px 12px rgba(16, 185, 129, 0.4); }
.eycit-fab--phone:hover { box-shadow: 0 6px 16px rgba(16, 185, 129, 0.5); }
.eycit-fab--book { background: linear-gradient(135deg, #f97316, #ea580c); box-shadow: 0 4px 12px rgba(249, 115, 22, 0.4); animation: fab-pulse 2.6s infinite; }
.eycit-fab--book:hover { box-shadow: 0 6px 16px rgba(249, 115, 22, 0.5); }
.eycit-fab--urgent { background: linear-gradient(135deg, #ef4444, #dc2626); box-shadow: 0 4px 12px rgba(220, 38, 38, 0.4); animation: fab-pulse 2.4s infinite; }
.eycit-fab--urgent:hover { box-shadow: 0 6px 16px rgba(220, 38, 38, 0.5); }
.eycit-fab--top { background: #475569; box-shadow: 0 4px 12px rgba(71, 85, 105, 0.35); }
.eycit-fab--top:hover { background: #334155; }
.eycit-fab--ai { background: linear-gradient(135deg, #7c3aed, #6366f1); box-shadow: 0 4px 12px rgba(124, 58, 237, 0.4); }

@keyframes fab-pulse {
  0%, 100% { box-shadow: 0 4px 12px rgba(220, 38, 38, 0.4), 0 0 0 0 rgba(220, 38, 38, 0.5); }
  50% { box-shadow: 0 4px 12px rgba(220, 38, 38, 0.4), 0 0 0 12px rgba(220, 38, 38, 0); }
}

/* FAB 二级菜单（PC 上滚后展开） */
.eycit-fab-secondary {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-end;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s var(--fab-spring);
}
.eycit-fab-stack.expanded .eycit-fab-secondary { max-height: 320px; }

.eycit-fab--more {
  background: var(--secondary);
  width: 42px;
  height: 42px;
}
.eycit-fab--more i { font-size: 16px; }
.eycit-fab--more.active { transform: rotate(45deg); }

/* ============== 移动端底部动作栏（精简版：2 按钮核心） ============== */

.eycit-mobile-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: var(--fab-z-mobile-bar);
  background: var(--bg-white);
  border-top: 1px solid var(--border);
  display: none;
  padding: 8px 12px calc(8px + env(safe-area-inset-bottom, 0));
  box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.06);
}

.eycit-mobile-bar__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  text-decoration: none;
  color: var(--text-gray);
  font-size: 11px;
  font-weight: 600;
  padding: 4px 0;
  border: none;
  background: transparent;
  cursor: pointer;
  transition: color 0.2s;
}
.eycit-mobile-bar__item i { font-size: 20px; }
.eycit-mobile-bar__item--call { color: #dc2626; }
.eycit-mobile-bar__item--wechat { color: var(--accent); }
.eycit-mobile-bar__item--quote { color: #f59e0b; }
.eycit-mobile-bar__item--more { color: var(--primary); }
.eycit-mobile-bar__item:active { transform: scale(0.95); }

@media (max-width: 768px) {
  .eycit-mobile-bar {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 4px;
  }
  /* 移动端隐藏 PC FAB */
  .eycit-fab-stack { display: none; }
  /* 内容预留底部空间 */
  body { padding-bottom: var(--fab-bar-height); }
}

/* 超小屏（≤360px）优化：缩小字号与图标，避免 4 列拥挤 */
@media (max-width: 360px) {
  .eycit-mobile-bar { gap: 2px; padding-left: 6px; padding-right: 6px; }
  .eycit-mobile-bar__item { font-size: 10px; gap: 1px; }
  .eycit-mobile-bar__item i { font-size: 18px; }
}

/* ============== 移动端弹出的"更多"菜单 ============== */
.eycit-mobile-sheet {
  position: fixed;
  inset: 0;
  z-index: var(--fab-z-modal);
  display: none;
  align-items: flex-end;
  justify-content: center;
  background: rgba(0, 0, 0, 0.45);
  backdrop-filter: blur(4px);
}
.eycit-mobile-sheet.open {
  display: flex;
  animation: backdrop-in 0.25s ease;
}
.eycit-mobile-sheet__panel {
  background: #fff;
  width: 100%;
  max-width: 480px;
  border-radius: 20px 20px 0 0;
  padding: 22px 20px calc(22px + env(safe-area-inset-bottom, 0));
  animation: sheet-up 0.32s var(--fab-spring);
  position: relative;
  max-height: 80vh;
  overflow-y: auto;
}
.eycit-mobile-sheet__list {
  list-style: none;
  padding: 0;
  margin: 0 0 4px;
}
.eycit-mobile-sheet__list li { margin-bottom: 8px; }
.eycit-mobile-sheet__list a {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  background: var(--bg-light);
  border-radius: 12px;
  text-decoration: none;
  color: var(--text-dark);
  font-size: 14px;
  font-weight: 600;
  transition: background 0.2s, transform 0.15s;
}
.eycit-mobile-sheet__list a:hover { background: var(--border); }
.eycit-mobile-sheet__list a:active { transform: scale(0.98); }
.eycit-mobile-sheet__list a i {
  font-size: 18px;
  color: var(--primary);
  width: 22px;
  text-align: center;
}
.eycit-mobile-sheet__title {
  font-size: 16px;
  font-weight: 800;
  color: var(--text-dark);
  margin-bottom: 14px;
  text-align: center;
}
.eycit-mobile-sheet__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
.eycit-mobile-sheet__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  text-decoration: none;
  color: var(--text);
  background: var(--bg-light);
  border-radius: 12px;
  padding: 14px 4px;
  font-size: 12px;
  font-weight: 600;
  border: none;
  cursor: pointer;
  transition: transform 0.15s, background 0.2s;
}
.eycit-mobile-sheet__item:active { transform: scale(0.96); }
.eycit-mobile-sheet__item i { font-size: 22px; }
.eycit-mobile-sheet__item--urgent { color: #ef4444; }
.eycit-mobile-sheet__item--quote { color: #f59e0b; }
.eycit-mobile-sheet__item--wechat { color: var(--accent); }
.eycit-mobile-sheet__item--ai { color: #7c3aed; }

.eycit-mobile-sheet__close {
  width: 100%;
  margin-top: 14px;
  padding: 12px;
  background: var(--bg-light);
  color: var(--text-gray);
  border: none;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
}

@keyframes sheet-up {
  from { transform: translateY(100%); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}
@keyframes backdrop-in {
  from { background: rgba(0, 0, 0, 0); }
  to { background: rgba(0, 0, 0, 0.45); }
}

/* ============== 统一 Modal（取代原 quoteModal/welcome/exitIntent 散装） ============== */

.eycit-modal {
  position: fixed;
  inset: 0;
  z-index: var(--fab-z-modal);
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.55);
  backdrop-filter: blur(4px);
  animation: backdrop-in 0.25s ease;
}

.eycit-modal.open { display: flex; }

.eycit-modal__box {
  background: #fff;
  border-radius: 18px;
  width: min(480px, 92vw);
  max-height: 88vh;
  overflow-y: auto;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.25);
  animation: modal-pop 0.28s var(--fab-spring);
  position: relative;
}

@keyframes modal-pop {
  from { transform: scale(0.85) translateY(20px); opacity: 0; }
  to { transform: scale(1) translateY(0); opacity: 1; }
}

.eycit-modal__header {
  padding: 22px 24px 16px;
  border-bottom: 1px solid var(--border-light);
  position: relative;
}
.eycit-modal__title {
  font-size: 17px;
  font-weight: 800;
  color: var(--text-dark);
  margin: 0;
  display: flex;
  align-items: center;
  gap: 8px;
}
.eycit-modal__close {
  position: absolute;
  top: 14px;
  right: 14px;
  background: var(--bg-light);
  border: none;
  color: var(--text-gray);
  width: 30px;
  height: 30px;
  border-radius: 50%;
  cursor: pointer;
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s;
}
.eycit-modal__close:hover { background: var(--border); }

.eycit-modal__body { padding: 20px 24px 24px; }

/* Modal 内容排版 */
.eycit-modal__box h3 {
  font-size: 17px;
  font-weight: 800;
  color: var(--text-dark);
  margin: 0 0 6px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.eycit-modal__box h3 i { color: var(--primary); }
.eycit-modal__header h3 { font-size: 17px; }
.eycit-modal__header p {
  font-size: 13px;
  color: var(--text-gray);
  margin: 0;
}
.eycit-modal__sub {
  font-size: 13px;
  color: var(--text-gray);
  text-align: center;
  margin: 0 0 14px;
}
.eycit-modal__tip {
  font-size: 12px;
  color: var(--text-gray);
  text-align: center;
  margin: 10px 0 14px;
}

/* Modal 尺寸变体 */
.eycit-modal__box--sm { width: min(380px, 92vw); }
.eycit-modal__box--md { width: min(560px, 94vw); }
.eycit-modal__box--sheet {
  border-radius: 20px 20px 0 0;
  width: 100%;
  max-width: 480px;
}
.eycit-modal__box--exit { width: min(440px, 92%); border-radius: 16px; overflow: hidden; }

/* 弹窗底部抽屉（移动端用 + 兼容别名） */
.eycit-modal--sheet .eycit-modal__box,
.eycit-modal--bottom-sheet .eycit-modal__box {
  border-radius: 20px 20px 0 0;
  width: 100%;
  max-width: 480px;
  margin: 0;
  animation: sheet-up 0.32s var(--fab-spring);
}
.eycit-modal--sheet,
.eycit-modal--bottom-sheet { align-items: flex-end; }

@media (min-width: 769px) {
  .eycit-modal--sheet .eycit-modal__box,
  .eycit-modal--bottom-sheet .eycit-modal__box {
    border-radius: 18px;
    animation: modal-pop 0.28s var(--fab-spring);
  }
  .eycit-modal--sheet,
  .eycit-modal--bottom-sheet { align-items: center; }
}

/* ============== 表单字段（modal 内统一） ============== */

.eycit-modal__box form { padding: 18px 24px 22px; }
.eycit-modal__box #quoteForm { padding: 18px 24px 22px; }

.eycit-form-label {
  font-size: 12px;
  font-weight: 600;
  color: var(--text);
  display: block;
  margin-bottom: 8px;
}
.eycit-form-required { color: #ef4444; margin-left: 2px; }

.eycit-form-field { margin-bottom: 12px; }
.eycit-form-field label {
  font-size: 12px;
  font-weight: 600;
  color: var(--text);
  display: block;
  margin-bottom: 5px;
}
.eycit-form-field input,
.eycit-form-field textarea {
  width: 100%;
  padding: 9px 12px;
  border: 1.5px solid var(--border);
  border-radius: 8px;
  font-size: 14px;
  outline: none;
  background: #fff;
  color: var(--text-dark);
  transition: border-color 0.2s, box-shadow 0.2s;
  font-family: inherit;
}
.eycit-form-field input:focus,
.eycit-form-field textarea:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(26, 111, 212, 0.12);
}
.eycit-form-field textarea { resize: vertical; }

.eycit-form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 12px;
}
.eycit-form-row .eycit-form-field { margin-bottom: 0; }

.eycit-form-tip {
  text-align: center;
  margin: 8px 0 0;
  font-size: 11px;
  color: var(--text-gray);
}
.eycit-form-tip i { color: var(--accent); margin-right: 3px; }
.eycit-form-result {
  padding: 32px 20px;
  text-align: center;
  min-height: 220px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.eycit-form-result[hidden] { display: none; }

/* ============== 服务类型网格（报价弹窗内） ============== */

.eycit-service-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-bottom: 16px;
}
.eycit-service-card { cursor: pointer; }
.eycit-service-card .service-radio { display: none; }

.quote-type-btn {
  border: 2px solid var(--border);
  border-radius: 8px;
  padding: 8px 6px;
  text-align: center;
  transition: border-color 0.2s, background 0.2s, transform 0.15s;
  font-size: 12px;
  color: var(--text);
  background: #fff;
}
.quote-type-btn i {
  font-size: 14px;
  color: var(--accent, var(--primary));
  display: block;
  margin-bottom: 4px;
}
.eycit-service-card .service-radio:checked + .quote-type-btn {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 8%, #fff);
  transform: translateY(-1px);
}

/* ============== 通用按钮 ============== */

.eycit-btn-primary {
  width: 100%;
  padding: 12px;
  background: linear-gradient(135deg, var(--primary), #0ea5e9);
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-decoration: none;
  transition: transform 0.15s, box-shadow 0.2s;
}
.eycit-btn-primary:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(26, 111, 212, 0.35); }
.eycit-btn-primary:active { transform: translateY(0); }
.eycit-btn-primary[disabled] { opacity: 0.6; cursor: not-allowed; transform: none; }

.eycit-btn-phone { background: linear-gradient(135deg, #f97316, #ef4444); }
.eycit-btn-phone:hover { box-shadow: 0 6px 16px rgba(239, 68, 68, 0.35); }

.eycit-btn-outline {
  padding: 11px;
  background: #fff;
  color: var(--primary);
  border: 2px solid var(--primary);
  border-radius: 8px;
  font-weight: 700;
  font-size: 14px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-decoration: none;
  transition: background 0.2s;
}
.eycit-btn-outline:hover { background: var(--bg-light); }

/* ============== 微信二维码弹窗 ============== */

.eycit-wechat-qr {
  width: 180px;
  height: 180px;
  margin: 4px auto 14px;
  background: var(--bg-light);
  border-radius: 12px;
  border: 2px solid var(--accent);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.eycit-wechat-qr img { width: 100%; height: 100%; object-fit: cover; }
.eycit-wechat-qr__fallback {
  text-align: center;
  padding: 14px;
  font-size: 11px;
  color: var(--text-gray);
  line-height: 1.5;
}
.eycit-wechat-qr__fallback i {
  font-size: 36px;
  color: var(--accent);
  display: block;
  margin-bottom: 6px;
}

/* ============== AI 客服弹窗 ============== */

.eycit-ai-chat {
  padding: 4px 0 0;
  min-height: 280px;
  max-height: 60vh;
  overflow-y: auto;
}
.eycit-ai-chat__placeholder {
  text-align: center;
  padding: 60px 20px;
  color: var(--text-gray);
}
.eycit-ai-chat__placeholder i {
  font-size: 48px;
  color: var(--primary);
  display: block;
  margin-bottom: 14px;
  opacity: 0.6;
}
.eycit-ai-chat__placeholder p { font-size: 15px; font-weight: 700; color: var(--text-dark); margin: 0 0 4px; }
.eycit-ai-chat__placeholder small { font-size: 12px; color: var(--text-gray); }
.eycit-ai-chat__fallback {
  background: none;
  border: none;
  color: var(--primary);
  font-weight: 700;
  cursor: pointer;
  text-decoration: underline;
  padding: 0 2px;
  font-size: 12px;
  font-family: inherit;
}

/* AI 客服清空按钮（modal-ai header 内） */
.eycit-ai-clear {
  position: absolute;
  top: 14px;
  right: 52px;
  background: var(--bg-light);
  border: none;
  color: var(--text-gray);
  padding: 6px 10px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 12px;
  display: flex;
  align-items: center;
  gap: 4px;
  transition: background 0.2s;
  font-family: inherit;
}
.eycit-ai-clear:hover { background: var(--border); color: #ef4444; }

/* ============== AI 聊天面板（注入 modal-ai 内） ============== */

.eycit-chat-quick {
  padding: 12px 16px;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
  flex-shrink: 0;
}
.eycit-chat-quick__hint {
  font-size: 11px;
  color: #94a3b8;
  margin-bottom: 8px;
  font-weight: 600;
}
.eycit-chat-quick__grid {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.eycit-chat-quick__grid button {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 20px;
  padding: 5px 12px;
  font-size: 12px;
  color: #374151;
  cursor: pointer;
  transition: all 0.2s;
  font-family: inherit;
}
.eycit-chat-quick__grid button:hover {
  border-color: #1a6fd4;
  color: #1a6fd4;
}

.eycit-chat-messages {
  flex: 1;
  overflow-y: auto;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  background: #f8fafc;
  min-height: 260px;
  max-height: 320px;
}
.eycit-chat-msg { display: flex; gap: 8px; align-items: flex-start; }
.eycit-chat-msg--user { justify-content: flex-end; }
.eycit-chat-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.eycit-chat-avatar--ai {
  background: linear-gradient(135deg, #1a6fd4, #0ea5e9);
  color: #fff;
  font-size: 14px;
}
.eycit-chat-avatar--user {
  background: #e2e8f0;
  color: #64748b;
  font-size: 14px;
}
.eycit-chat-bubble {
  padding: 12px 14px;
  max-width: calc(100% - 48px);
  line-height: 1.6;
  font-size: 13px;
  word-break: break-word;
}
.eycit-chat-bubble--ai {
  background: #fff;
  border-radius: 12px 12px 12px 4px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
  color: #1e293b;
}
.eycit-chat-bubble--user {
  background: linear-gradient(135deg, #1a6fd4, #0ea5e9);
  color: #fff;
  border-radius: 12px 12px 4px 12px;
  box-shadow: 0 2px 8px rgba(26, 111, 212, 0.2);
}
.eycit-chat-phone { color: #94a3b8; font-size: 11px; }

.eycit-chat-typing {
  display: flex;
  gap: 4px;
  padding: 12px 16px;
  background: #fff;
  border-radius: 12px 12px 12px 4px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}
.eycit-chat-typing span {
  width: 8px;
  height: 8px;
  background: #94a3b8;
  border-radius: 50%;
  animation: eychat-typing 1.4s infinite;
}
.eycit-chat-typing span:nth-child(2) { animation-delay: 0.2s; }
.eycit-chat-typing span:nth-child(3) { animation-delay: 0.4s; }
@keyframes eychat-typing {
  0%, 60%, 100% { opacity: 0.3; }
  30% { opacity: 1; }
}

.eycit-chat-inputbar {
  padding: 12px 16px;
  background: #fff;
  border-top: 1px solid #e2e8f0;
  flex-shrink: 0;
}
.eycit-chat-inputrow { display: flex; gap: 8px; align-items: center; }
.eycit-chat-inputrow input {
  flex: 1;
  padding: 10px 14px;
  border: 1.5px solid #e2e8f0;
  border-radius: 10px;
  font-size: 14px;
  outline: none;
  transition: border 0.2s;
  font-family: inherit;
}
.eycit-chat-inputrow input:focus { border-color: #1a6fd4; }
.eycit-chat-inputrow button {
  background: linear-gradient(135deg, #1a6fd4, #0ea5e9);
  color: #fff;
  border: none;
  border-radius: 10px;
  padding: 10px 16px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  white-space: nowrap;
  flex-shrink: 0;
  font-family: inherit;
}
.eycit-chat-inputrow button:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(26, 111, 212, 0.3);
}
.eycit-chat-inputrow button:disabled { opacity: 0.6; cursor: not-allowed; }
.eycit-chat-footnote {
  text-align: center;
  margin-top: 8px;
  font-size: 11px;
  color: #94a3b8;
}

/* ============== 欢迎弹窗（modal-welcome） ============== */

.eycit-welcome-hero {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 14px;
  padding: 22px 24px 0;
}
.eycit-welcome-avatar {
  width: 52px;
  height: 52px;
  background: linear-gradient(135deg, var(--primary), #0ea5e9);
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.eycit-welcome-avatar i { color: #fff; font-size: 22px; }
.eycit-welcome-tag {
  display: inline-block;
  background: #fef3c7;
  color: #92400e;
  font-size: 11px;
  font-weight: 700;
  padding: 2px 10px;
  border-radius: 20px;
  margin-bottom: 4px;
}
.eycit-welcome-hero h4 {
  font-size: 16px;
  font-weight: 800;
  color: var(--text-dark);
  margin: 0;
}
.eycit-welcome-text {
  font-size: 13.5px;
  color: var(--text-gray);
  line-height: 1.6;
  padding: 0 24px 18px;
  margin: 0;
}
.eycit-welcome-text strong { color: var(--primary); font-size: 15px; }
.eycit-welcome-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  padding: 0 24px 16px;
}
.eycit-welcome-actions .eycit-btn-primary,
.eycit-welcome-actions .eycit-btn-outline { width: 100%; }
.eycit-welcome-tip {
  text-align: center;
  font-size: 12px;
  color: var(--text-gray);
  margin: 0 0 22px;
  padding: 0 24px;
}
.eycit-welcome-tip i { color: var(--accent); margin-right: 4px; }

/* ============== 退出意图弹窗（modal-exit） ============== */

.eycit-exit-hero {
  background: linear-gradient(135deg, #f97316, #ef4444);
  padding: 24px 28px;
  text-align: center;
  color: #fff;
}
.eycit-exit-hero h3 { color: #fff !important; font-size: 18px !important; margin: 0 0 4px !important; justify-content: center; }
.eycit-exit-hero h3 i { color: #fff !important; }
.eycit-exit-hero p { color: rgba(255, 255, 255, 0.92); font-size: 14px; margin: 0; }
.eycit-exit-emoji { font-size: 36px; margin-bottom: 6px; }

.eycit-exit-coupon {
  background: #fffbeb;
  border: 1px solid #fcd34d;
  border-radius: 10px;
  padding: 14px 16px;
  margin: 18px 24px 18px;
  text-align: center;
}
.eycit-exit-coupon__tag {
  font-size: 13px;
  color: #92400e;
  font-weight: 600;
  margin-bottom: 4px;
}
.eycit-exit-coupon__tag i { margin-right: 4px; }
.eycit-exit-coupon__code {
  font-size: 22px;
  font-weight: 800;
  color: #d97706;
  letter-spacing: 2px;
  font-family: monospace;
  margin: 2px 0 4px;
}
.eycit-exit-coupon__desc { font-size: 12px; color: #a16207; }
.eycit-exit-coupon__desc b { color: #92400e; }

.eycit-exit-actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 0 24px 16px;
}
.eycit-exit-actions .eycit-btn-primary,
.eycit-exit-actions .eycit-btn-outline { width: 100%; }

/* ============== Toast 轻提示（统一通知） ============== */

.eycit-toast {
  position: fixed;
  top: 80px;
  left: 50%;
  transform: translateX(-50%) translateY(-20px);
  z-index: calc(var(--fab-z-modal) + 1);
  background: var(--text-dark);
  color: #fff;
  padding: 10px 18px;
  border-radius: 30px;
  font-size: 14px;
  font-weight: 600;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s, transform 0.25s var(--fab-spring);
  display: flex;
  align-items: center;
  gap: 8px;
}
.eycit-toast.show {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}
.eycit-toast--success { background: var(--accent); }
.eycit-toast--error { background: #ef4444; }
.eycit-toast--warning { background: #f59e0b; }

/* ============== 顶部轻提示条（promoBanner 改版） ============== */

.eycit-promo {
  background: linear-gradient(90deg, #fef3c7, #fde68a);
  color: #92400e;
  text-align: center;
  padding: 6px 16px;
  font-size: 12.5px;
  font-weight: 600;
  border-bottom: 1px solid rgba(146, 64, 14, 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
}
.eycit-promo a {
  color: #b45309;
  text-decoration: underline;
  font-weight: 700;
}
.eycit-promo__close {
  background: none;
  border: none;
  color: rgba(146, 64, 14, 0.6);
  cursor: pointer;
  padding: 0 4px;
  font-size: 16px;
  line-height: 1;
}
.eycit-promo__close:hover { color: #92400e; }

/* ============== 兼容旧选择器（向后兼容） ============== */

.float-contact { display: none !important; }  /* 旧类标记为不再使用 */
.mobile-action-bar { display: none !important; }
/* ===== design-system.css ===== */
/* ============================================================
 * 易云城 IT 服务 · 设计系统 design-system.css  v1.0
 * 主色：科技蓝 #1668dc    强调色：橙 #ff6a1f（CTA / 速度 / 促销）
 * 本文件必须在 inline.css 之后加载，用于统一全站设计令牌与组件。
 * ============================================================ */

/* ========== 1. 设计令牌 ========== */
:root{
  /* 品牌主色 · 科技蓝 */
  --primary:#0b63f6;
  --primary-dark:#0847c4;
  --primary-darker:#063596;
  --primary-light:#e6efff;
  --primary-lighter:#f2f7ff;

  /* 强调色 · 科技青（替代原橙色，去掉促销感） */
  --accent:#00c8ff;
  --accent-dark:#009ed6;
  --accent-light:#e0f7ff;

  /* 功能色 */
  --success:#10b981;
  --success-light:#d1fae5;
  --warning:#f59e0b;
  --warning-light:#fef3c7;
  --danger:#dc2626;
  --danger-light:#fee2e2;
  --urgent:#ff5a1f;              /* 仅用于「紧急」语义，非主强调 */

  /* 深色（页脚 / 深色区块 / hero） */
  --secondary:#071a33;
  --secondary-dark:#04101f;
  --grad-dark:linear-gradient(150deg,#04101f 0%,#0a2547 45%,#0b4a8f 100%);
  --grad-accent:linear-gradient(135deg,#22d3ff 0%,#0b8fe8 100%);
  --grad-primary:linear-gradient(135deg,#2b83f0 0%,#0b63f6 100%);
  --grad-text:linear-gradient(100deg,#ffffff 0%,#8fd3ff 55%,#22d3ff 100%);


  /* 文本 */
  --text-dark:#0f172a;
  --text:#334155;
  --text-gray:#64748b;
  --text-light:#94a3b8;

  /* 背景与边框 */
  --bg-white:#fff;
  --bg-light:#f8fafc;
  --bg-gray:#f1f5f9;
  --border:#e2e8f0;
  --border-light:#f1f5f9;

  /* 圆角（科技感：整体收窄，更锐利） */
  --radius-xs:4px;
  --radius-sm:6px;
  --radius-md:10px;
  --radius-lg:14px;
  --radius-xl:18px;
  --radius-full:999px;

  /* 阴影（统一 4 级） */
  --shadow-xs:0 1px 2px rgba(15,23,42,.05);
  --shadow-sm:0 2px 8px rgba(15,23,42,.06);
  --shadow-md:0 8px 24px rgba(15,23,42,.09);
  --shadow-lg:0 18px 44px rgba(15,23,42,.13);

  /* 字号阶梯 */
  --fs-xs:.75rem;
  --fs-sm:.8125rem;
  --fs-base:.875rem;
  --fs-md:.9375rem;
  --fs-lg:1rem;
  --fs-xl:1.125rem;
  --fs-2xl:1.375rem;
  --fs-3xl:1.75rem;
  --fs-4xl:2.125rem;
  --fs-5xl:2.5rem;

  /* 字重（全站只用 4 级） */
  --fw-normal:400;
  --fw-medium:500;
  --fw-semibold:600;
  --fw-bold:700;

  /* 间距 */
  --sp-1:4px;  --sp-2:8px;  --sp-3:12px; --sp-4:16px;
  --sp-5:20px; --sp-6:24px; --sp-8:32px; --sp-10:40px;
  --sp-12:48px; --sp-14:56px; --sp-16:64px;

  /* 布局 */
  --container:1200px;
  --header-h:64px;

  --font-main:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  --font-mono:"SF Mono","JetBrains Mono","Cascadia Code",Consolas,"Courier New",monospace;
}

/* 兼容旧变量名（旧代码里的 --radius / --shadow 等） */
:root{
  --radius:var(--radius-md);
  --shadow:var(--shadow-sm);
  --shadow-lg:var(--shadow-md);
}

/* ========== 2. 基础重置 ========== */
html{font-size:16px;-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  font-family:var(--font-main);
  font-size:var(--fs-md);
  color:var(--text);
  background:var(--bg-light);
  margin:0;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,h5,h6{color:var(--text-dark);line-height:1.35;margin:0}
p{margin:0}
a{color:var(--primary);text-decoration:none;transition:color .2s}
a:hover{color:var(--primary-dark)}
img{max-width:100%;height:auto;display:block}
ul,ol{list-style:none;padding:0;margin:0}

/* ========== 2.1 键盘可访问性（聚焦环） ========== */
/* 鼠标点击不显示默认 outline，键盘 Tab 聚焦时显示清晰科技色描边 */
:focus{outline:none}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,
select:focus-visible,[tabindex]:focus-visible,[role="button"]:focus-visible{
  outline:3px solid var(--accent);
  outline-offset:2px;
  border-radius:4px;
}
/* 跳过导航直接聚焦主内容时的高亮 */
.skip-link:focus-visible{
  outline:3px solid var(--accent);
  outline-offset:2px;
}

/* ========== 2.2 尊重「减少动效」系统偏好 ========== */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    transition-duration:.001ms!important;
    scroll-behavior:auto!important;
  }
}

.container{
  width:100%;
  max-width:var(--container);
  margin:0 auto;
  padding:0 var(--sp-5);
}
main{min-width:0;overflow-wrap:anywhere}

/* ========== 3. 区块节奏（解决深浅交替混乱） ========== */
.section{padding:var(--sp-14) 0}
.section--tight{padding:var(--sp-10) 0}
.section--light{background:var(--bg-white)}
.section--gray{background:var(--bg-light)}
.section--dark{background:var(--grad-dark);color:#fff}
.section--dark h2,.section--dark h3{color:#fff}

.section-header{text-align:center;margin-bottom:var(--sp-10)}
.section-badge{
  display:inline-flex;align-items:center;gap:var(--sp-2);
  background:linear-gradient(135deg,var(--primary-light),var(--accent-light));
  color:var(--primary-dark);
  border:1px solid rgba(11,99,246,.16);
  padding:5px 14px;border-radius:var(--radius-full);
  font-size:var(--fs-sm);font-weight:var(--fw-semibold);
  margin-bottom:var(--sp-3);
  letter-spacing:.2px;
}
.section--dark .section-badge{
  background:rgba(0,200,255,.12);
  color:#8fdcff;
  border-color:rgba(34,211,255,.3);
}
.section-title{
  font-size:var(--fs-3xl);font-weight:var(--fw-bold);
  color:var(--text-dark);margin-bottom:var(--sp-3);
  letter-spacing:-.01em;
}
.section-subtitle{
  font-size:var(--fs-md);color:var(--text-gray);
  max-width:640px;margin:0 auto;
}
.section--dark .section-subtitle{color:rgba(255,255,255,.72)}
.section-more{text-align:center;margin-top:var(--sp-8)}

/* ========== 4. 按钮 ========== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);
  padding:11px 24px;border-radius:var(--radius-full);
  font-weight:var(--fw-semibold);font-size:var(--fs-base);
  border:1px solid transparent;cursor:pointer;
  transition:transform .2s,box-shadow .2s,background .2s,color .2s;
  text-decoration:none;line-height:1.4;white-space:nowrap;
}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0)}

.btn-primary{
  background:var(--grad-primary);color:#fff;
  box-shadow:0 0 0 1px rgba(11,99,246,.25),0 8px 22px rgba(11,99,246,.26);
}
.btn-primary:hover{
  background:var(--primary-dark);color:#fff;
  box-shadow:0 0 0 1px rgba(11,99,246,.5),0 12px 30px rgba(11,99,246,.36);
}

/* 科技青强调按钮 —— 主转化入口 */
.btn-accent{
  background:var(--grad-accent);
  color:#02263a;
  font-weight:var(--fw-bold);
  box-shadow:0 0 0 1px rgba(34,211,255,.4),0 8px 26px rgba(0,200,255,.3);
}
.btn-accent:hover{
  background:linear-gradient(135deg,#5ce1ff 0%,#12a8f0 100%);
  color:#02263a;
  box-shadow:0 0 0 1px rgba(34,211,255,.7),0 12px 34px rgba(0,200,255,.44);
}

.btn-outline{background:transparent;border:1px solid var(--primary);color:var(--primary)}
.btn-outline:hover{background:var(--primary);color:#fff}

.btn-secondary{background:var(--bg-white);border:1px solid var(--border);color:var(--text)}
.btn-secondary:hover{border-color:var(--primary);color:var(--primary)}

.btn-ghost-dark{
  background:rgba(0,200,255,.06);
  border:1px solid rgba(34,211,255,.4);
  color:#dff4ff;
}
.btn-ghost-dark:hover{
  background:rgba(0,200,255,.16);
  border-color:rgba(34,211,255,.75);
  color:#fff;
}

.btn-sm{padding:7px 16px;font-size:var(--fs-sm)}
.btn-lg{padding:14px 32px;font-size:var(--fs-lg)}
.btn-block{display:flex;width:100%}

/* ========== 5. 卡片 ========== */
.card{
  background:var(--bg-white);
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  padding:var(--sp-6);
  transition:transform .25s,box-shadow .25s,border-color .25s;
}
.card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--primary-light)}

.card--flat:hover{transform:none;box-shadow:none}

/* 服务卡片（统一内联样式散落的问题） */
.svc-card{
  background:var(--bg-white);
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  padding:var(--sp-6);
  display:block;text-decoration:none;position:relative;overflow:hidden;
  transition:transform .25s,box-shadow .25s,border-color .25s;
}
/* 顶部科技光条 */
.svc-card::before{
  content:"";
  position:absolute;left:0;top:0;right:0;height:2px;
  background:linear-gradient(90deg,var(--primary),var(--accent));
  opacity:0;transition:opacity .25s;
}
.svc-card:hover{
  transform:translateY(-4px);
  box-shadow:0 12px 32px rgba(11,99,246,.14);
  border-color:rgba(11,99,246,.32);
}
.svc-card:hover::before{opacity:1}
.svc-card__icon{
  width:52px;height:52px;border-radius:var(--radius-md);
  background:var(--primary-light);color:var(--primary);
  display:flex;align-items:center;justify-content:center;
  font-size:22px;margin-bottom:var(--sp-4);
  transition:background .25s,color .25s;
}
.svc-card:hover .svc-card__icon{background:var(--grad-primary);color:#fff}
.svc-card__title{
  font-size:var(--fs-lg);font-weight:var(--fw-semibold);
  color:var(--text-dark);margin-bottom:var(--sp-2);
}
.svc-card__desc{font-size:var(--fs-base);color:var(--text-gray);line-height:1.7;margin-bottom:var(--sp-3)}
.svc-card__price{font-size:var(--fs-sm);color:var(--accent);font-weight:var(--fw-semibold)}
.svc-card__arrow{
  position:absolute;top:var(--sp-6);right:var(--sp-5);
  color:var(--text-light);font-size:14px;opacity:0;transform:translateX(-6px);
  transition:opacity .25s,transform .25s;
}
.svc-card:hover .svc-card__arrow{opacity:1;transform:translateX(0)}

/* ========== 6. 标签 ========== */
.tag{
  display:inline-flex;align-items:center;gap:4px;
  padding:3px 10px;border-radius:var(--radius-xs);
  font-size:var(--fs-xs);font-weight:var(--fw-medium);
  background:var(--bg-gray);color:var(--text-gray);
}
.tag--primary{background:var(--primary-light);color:var(--primary)}
.tag--accent{background:var(--accent-light);color:var(--accent-dark)}
.tag--success{background:var(--success-light);color:#065f46}
.tag--warning{background:var(--warning-light);color:#92400e}
.tag--danger{background:var(--danger-light);color:#991b1b}

/* ========== 7. 响应速度信任条（首屏核心组件） ========== */
.speed-strip{
  background:var(--bg-white);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-sm);
  padding:var(--sp-5) var(--sp-6);
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:var(--sp-5);
  margin-top:calc(var(--sp-14) * -1);
  position:relative;
  z-index:5;
}
.speed-item{display:flex;align-items:center;gap:var(--sp-3)}
.speed-item__icon{
  width:42px;height:42px;flex-shrink:0;border-radius:var(--radius-md);
  background:linear-gradient(135deg,#e3f8ff,#c2efff);
  color:var(--accent-dark);
  display:flex;align-items:center;justify-content:center;font-size:18px;
  border:1px solid rgba(0,200,255,.18);
}
.speed-item__body{min-width:0}
.speed-item__value{
  font-size:var(--fs-lg);font-weight:var(--fw-bold);color:var(--text-dark);
  line-height:1.3;white-space:nowrap;
  font-family:var(--font-mono);
  letter-spacing:-.3px;
}
.speed-item__label{font-size:var(--fs-xs);color:var(--text-gray);line-height:1.4}

/* 在线状态呼吸灯 */
.pulse-dot{
  display:inline-block;width:8px;height:8px;border-radius:50%;
  background:var(--success);margin-right:6px;vertical-align:middle;
  box-shadow:0 0 0 0 rgba(16,185,129,.7);
  animation:ds-pulse 2s infinite;
}
@keyframes ds-pulse{
  0%{box-shadow:0 0 0 0 rgba(16,185,129,.6)}
  70%{box-shadow:0 0 0 8px rgba(16,185,129,0)}
  100%{box-shadow:0 0 0 0 rgba(16,185,129,0)}
}
@media (prefers-reduced-motion:reduce){
  .pulse-dot{animation:none}
  html{scroll-behavior:auto}
}

/* ========== 7.5 Hero 首屏 ========== */
.hero{
  background:var(--grad-dark);
  color:#fff;
  padding:var(--sp-16) 0 calc(var(--sp-16) + var(--sp-12));
  position:relative;
  overflow:hidden;
}
/* 精密网格（技术感底纹） */
.hero::before{
  content:"";
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(34,211,255,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(34,211,255,.055) 1px,transparent 1px);
  background-size:56px 56px;
  pointer-events:none;
}
/* 蓝色主光晕 */
.hero::after{
  content:"";
  position:absolute;
  right:-10%;top:-30%;
  width:620px;height:620px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(11,99,246,.45),transparent 66%);
  pointer-events:none;
}
/* 青色副光晕 */
.hero__glow{
  position:absolute;
  left:-8%;bottom:-40%;
  width:520px;height:520px;border-radius:50%;
  background:radial-gradient(circle,rgba(0,200,255,.2),transparent 70%);
  pointer-events:none;
}
.hero-inner{
  display:grid;
  grid-template-columns:minmax(0,1fr) 360px;
  gap:var(--sp-10);
  align-items:start;
  position:relative;
  z-index:2;
}
.hero-badge{
  display:inline-flex;align-items:center;gap:var(--sp-2);
  background:rgba(0,200,255,.1);
  border:1px solid rgba(34,211,255,.34);
  border-radius:var(--radius-full);
  padding:6px 16px;
  font-size:var(--fs-sm);
  color:#bdeeff;
  margin-bottom:var(--sp-4);
}
.hero-badge strong{
  color:#22d3ff;
  font-family:var(--font-mono);
  font-weight:700;
  font-size:var(--fs-md);
}

.hero-title{
  font-size:var(--fs-5xl);
  font-weight:var(--fw-bold);
  line-height:1.22;
  margin-bottom:var(--sp-4);
  color:#fff;
  letter-spacing:-.02em;
}
.hero-title .hl-accent{
  background:var(--grad-text);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  color:transparent;
}
.hero-title .hl-white{color:#fff}

.hero-desc{
  font-size:var(--fs-lg);
  color:rgba(255,255,255,.78);
  line-height:1.75;
  margin-bottom:var(--sp-6);
  max-width:640px;
}
.hero-desc strong{color:#fff;font-weight:var(--fw-semibold)}

.hero-btns{display:flex;gap:var(--sp-3);flex-wrap:wrap;margin-bottom:var(--sp-5)}
.hero-btns .btn{padding:14px 30px;font-size:var(--fs-lg)}

/* 服务承诺标签行 */
.hero-points{
  display:flex;gap:var(--sp-2);flex-wrap:wrap;
  list-style:none;padding:0;margin:0;
}
.hero-points li{
  display:inline-flex;align-items:center;gap:6px;
  background:rgba(0,200,255,.08);
  border:1px solid rgba(34,211,255,.24);
  padding:5px 14px;border-radius:var(--radius-full);
  font-size:var(--fs-sm);color:#cfe9ff;
}
.hero-points li i{color:#22d3ff;font-size:12px}

/* 右侧服务卡（玻璃质感 + 青色描边） */
.hero-card{
  background:rgba(255,255,255,.045);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  border:1px solid rgba(34,211,255,.22);
  border-radius:var(--radius-lg);
  padding:var(--sp-6);
  box-shadow:0 8px 44px rgba(0,0,0,.3);
}
.hero-card__title{
  color:#fff;font-size:var(--fs-lg);font-weight:var(--fw-semibold);
  text-align:center;margin-bottom:var(--sp-5);
  display:flex;align-items:center;justify-content:center;gap:var(--sp-2);
}
.hero-card__title i{color:#22d3ff}
.hero-service-list{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-2)}
.hero-service-item{
  display:flex;align-items:center;gap:var(--sp-2);
  padding:9px 12px;
  background:rgba(0,200,255,.06);
  border:1px solid rgba(34,211,255,.16);
  border-radius:var(--radius-sm);
  color:#cfe9ff;
  font-size:var(--fs-sm);
  transition:background .2s,border-color .2s,color .2s,transform .2s;
}
.hero-service-item:hover{
  background:rgba(0,200,255,.16);
  border-color:rgba(34,211,255,.45);
  color:#fff;transform:translateY(-1px);
}
.hero-service-item i{color:#22d3ff;width:16px;text-align:center}
.hero-card__phone{
  display:flex;align-items:center;justify-content:center;gap:var(--sp-2);
  color:#4ddcff;font-size:var(--fs-2xl);font-weight:var(--fw-bold);
  font-family:var(--font-mono);
  letter-spacing:.5px;
  margin-top:var(--sp-5);
}
.hero-card__phone:hover{color:#fff}
.hero-card__note{
  text-align:center;color:rgba(255,255,255,.5);
  font-size:var(--fs-xs);margin-top:var(--sp-2);
}

/* ========== 7.6 快速入口卡片 ========== */
.quick-entry{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  gap:var(--sp-4);
}
.qe-card{
  display:flex;align-items:center;gap:var(--sp-4);
  background:var(--bg-white);
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  padding:var(--sp-5);
  text-decoration:none;
  transition:transform .25s,box-shadow .25s,border-color .25s;
}
.qe-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--primary-light)}
.qe-card__icon{
  width:48px;height:48px;flex-shrink:0;border-radius:var(--radius-md);
  display:flex;align-items:center;justify-content:center;
  font-size:20px;color:#fff;
}
/* 2026-09-20 专业度收敛：快速入口图标不再做四色拼盘，统一主蓝渐变 */
.qe-card--violet .qe-card__icon,
.qe-card--amber  .qe-card__icon,
.qe-card--blue   .qe-card__icon,
.qe-card--green  .qe-card__icon{background:var(--grad-primary)}
.qe-card__body{flex:1;min-width:0}
.qe-card__title{
  font-size:var(--fs-md);font-weight:var(--fw-semibold);
  color:var(--text-dark);margin-bottom:2px;
}
.qe-card__desc{font-size:var(--fs-xs);color:var(--text-gray);line-height:1.5}
.qe-card__arrow{color:var(--text-light);font-size:13px;flex-shrink:0}

/* ========== 7.7 套餐/方案卡片 ========== */
.plan-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:var(--sp-5);
  max-width:1080px;margin:0 auto;
}
.plan-card{
  background:var(--bg-white);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:var(--sp-8) var(--sp-6);
  text-decoration:none;display:block;position:relative;overflow:hidden;
  transition:transform .25s,box-shadow .25s,border-color .25s;
}
.plan-card::before{
  content:"";
  position:absolute;left:0;top:0;right:0;height:2px;
  background:linear-gradient(90deg,var(--primary),var(--accent));
  opacity:0;transition:opacity .25s;
}
.plan-card:hover{
  transform:translateY(-5px);
  box-shadow:0 16px 40px rgba(11,99,246,.16);
  border-color:rgba(11,99,246,.32);
}
.plan-card:hover::before{opacity:1}
.plan-card--featured{border:2px solid rgba(0,200,255,.5)}
.plan-card--featured:hover{border-color:var(--accent);box-shadow:0 16px 40px rgba(0,200,255,.22)}
.plan-card--featured::before{opacity:1}
.plan-card__badge{
  position:absolute;top:var(--sp-4);right:var(--sp-4);
  background:var(--grad-accent);color:#fff;
  font-size:var(--fs-xs);font-weight:var(--fw-bold);
  padding:4px 12px;border-radius:var(--radius-full);
}
.plan-card__icon{
  width:56px;height:56px;border-radius:var(--radius-md);
  background:var(--primary-light);color:var(--primary);
  display:flex;align-items:center;justify-content:center;
  font-size:24px;margin-bottom:var(--sp-4);
  transition:background .25s,color .25s;
}
.plan-card:hover .plan-card__icon{background:var(--grad-primary);color:#fff}
.plan-card--featured .plan-card__icon{background:var(--accent-light);color:var(--accent)}
.plan-card__title{
  font-size:var(--fs-xl);font-weight:var(--fw-semibold);
  color:var(--text-dark);margin-bottom:var(--sp-2);
}
.plan-card__desc{font-size:var(--fs-base);color:var(--text-gray);line-height:1.7;margin-bottom:var(--sp-4)}
.plan-card__tags{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin-bottom:var(--sp-4)}
.plan-card__cta{
  display:flex;align-items:center;gap:var(--sp-2);
  color:var(--primary);font-weight:var(--fw-semibold);font-size:var(--fs-base);
}
.plan-card--featured .plan-card__cta{color:var(--accent)}
.plan-card__cta i{transition:transform .2s}
.plan-card:hover .plan-card__cta i{transform:translateX(4px)}

/* ========== 8. 数字统计 ========== */
.stat-block{text-align:center;padding:var(--sp-4)}
.stat-block__num{
  font-size:var(--fs-4xl);font-weight:var(--fw-bold);
  color:#fff;line-height:1.15;
  font-family:var(--font-mono);
  letter-spacing:-1px;
}
.stat-block__unit{
  font-size:var(--fs-xl);font-weight:var(--fw-semibold);
  background:var(--grad-text);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}
.stat-block__label{font-size:var(--fs-sm);color:rgba(255,255,255,.65);margin-top:var(--sp-1)}

/* ========== 9. 表单 ========== */
.form-control{
  width:100%;padding:11px 14px;
  border:1px solid var(--border);border-radius:var(--radius-sm);
  font-size:var(--fs-base);color:var(--text-dark);
  background:var(--bg-white);
  transition:border-color .2s,box-shadow .2s;
  font-family:inherit;
}
.form-control:focus{
  outline:none;border-color:var(--primary);
  box-shadow:0 0 0 3px rgba(22,104,220,.12);
}
.form-label{
  display:block;font-size:var(--fs-sm);font-weight:var(--fw-medium);
  color:var(--text-dark);margin-bottom:var(--sp-2);
}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3);margin-bottom:var(--sp-3)}
.form-group{margin-bottom:var(--sp-3)}


/* ========== 11. 响应式 ========== */
@media (max-width:1024px){
  .speed-strip{grid-template-columns:repeat(2,1fr);gap:var(--sp-4)}
  .grid-4{grid-template-columns:repeat(2,1fr)}
  .grid-3{grid-template-columns:repeat(2,1fr)}
  .hero-inner{grid-template-columns:1fr;gap:var(--sp-8)}
  .hero-title{font-size:var(--fs-4xl)}
  .hero::after{display:none}
}
@media (max-width:768px){
  .section{padding:var(--sp-10) 0}
  .section--tight{padding:var(--sp-8) 0}
  .section-title{font-size:var(--fs-2xl)}
  .section-subtitle{font-size:var(--fs-base)}
  .section-header{margin-bottom:var(--sp-6)}
  .container{padding:0 var(--sp-4)}
  .speed-strip{
    grid-template-columns:1fr 1fr;
    gap:var(--sp-3);padding:var(--sp-4);
    margin-top:calc(var(--sp-6) * -1);
  }
  .speed-item{flex-direction:column;align-items:flex-start;gap:var(--sp-2)}
  .speed-item__icon{width:36px;height:36px;font-size:16px}
  .speed-item__value{font-size:var(--fs-base);white-space:normal}
  .grid-2,.grid-3,.grid-4{grid-template-columns:1fr}
  .form-row{grid-template-columns:1fr}
  .stat-block__num{font-size:var(--fs-3xl)}
  .hero{padding:var(--sp-10) 0 var(--sp-16)}
  .hero-title{font-size:var(--fs-3xl)}
  .hero-desc{font-size:var(--fs-base)}
  .hero-btns .btn{flex:1;padding:12px 20px;font-size:var(--fs-base)}
  .hero-card{padding:var(--sp-5)}
}
@media (max-width:480px){
  .hero-title{font-size:var(--fs-2xl)}
  .hero-btns{flex-direction:column}
  .hero-service-list{grid-template-columns:1fr 1fr}
  .speed-strip{grid-template-columns:1fr}
  .speed-item{flex-direction:row;align-items:center}
}

/* ========== 12. 真实照片组件（现场实拍 / 工程师团队） ========== */
/* 注：照片为 AI 生成占位图，上线前需替换为公司真实工程师/现场/案例照片 */
.photo-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:var(--sp-5);
}
.photo-card{
  position:relative;margin:0;border-radius:var(--radius-lg);overflow:hidden;
  background:var(--bg-gray);box-shadow:var(--shadow-sm);
  transition:transform .3s,box-shadow .3s;
}
.photo-card img{
  width:100%;height:240px;object-fit:cover;display:block;
  transition:transform .4s;
}
.photo-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.photo-card:hover img{transform:scale(1.05)}
.photo-card figcaption{
  position:absolute;left:0;right:0;bottom:0;
  padding:14px 16px;
  background:linear-gradient(transparent,rgba(4,16,31,.82));
  color:#fff;font-size:var(--fs-sm);font-weight:var(--fw-semibold);
}

/* 工程师团队 */
.team-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-5);
  max-width:920px;margin:0 auto;
}
.team-card{
  margin:0;border-radius:var(--radius-lg);overflow:hidden;
  background:var(--bg-white);border:1px solid var(--border);
  box-shadow:var(--shadow-sm);
  transition:transform .3s,box-shadow .3s,border-color .3s;
}
.team-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:var(--primary-light)}
.team-card img{width:100%;height:300px;object-fit:cover;display:block}
.team-card figcaption{padding:14px 16px;text-align:center}
.team-card figcaption b{display:block;color:var(--text-dark);font-size:var(--fs-md);font-weight:var(--fw-semibold)}
.team-card figcaption span{display:block;color:var(--text-gray);font-size:var(--fs-xs);margin-top:2px}

.photo-note{
  text-align:center;font-size:var(--fs-xs);color:var(--text-light);
  margin:var(--sp-6) auto 0;max-width:720px;
  background:var(--bg-gray);border:1px dashed var(--border);
  border-radius:var(--radius-sm);padding:10px 14px;
}

@media (max-width:768px){
  .photo-grid,.team-grid{grid-template-columns:1fr 1fr}
  .photo-card img{height:180px}
  .team-card img{height:220px}
}
@media (max-width:480px){
  .photo-grid,.team-grid{grid-template-columns:1fr}
}
/* ===== tech-layer.css ===== */
/* ============================================================
 * 易云城 IT 服务 · 科技视觉层 tech-layer.css  v1.0
 * 加载顺序：inline.css → ... → design-system.css → tech-layer.css
 * 定位：纯增强层。只做「科技感」视觉语言与微交互，不改动既有布局。
 * 依赖：tech-fx.js（滚动进度 / 进场动画 / 光晕跟随 / 数字滚动）
 * ============================================================ */

/* ========== 0. 滚动进度条（顶部 2px 青蓝渐变） ========== */
#techProgress{
  position:fixed;top:0;left:0;height:2px;width:0;
  z-index:2147483000;
  background:linear-gradient(90deg,#22d3ff 0%,#0b63f6 55%,#7c3aed 100%);
  box-shadow:0 0 10px rgba(34,211,255,.75);
  transition:width .08s linear;
  pointer-events:none;
}

/* ========== 1. 全局精密网格底纹（体层面的技术秩序感） ========== */
body{
  background-color:var(--bg-light);
  background-image:
    linear-gradient(rgba(11,99,246,.028) 1px,transparent 1px),
    linear-gradient(90deg,rgba(11,99,246,.028) 1px,transparent 1px);
  background-size:48px 48px;
  background-position:-1px -1px;
}
/* 深色区块 / 页脚：网格提亮 + 顶部一条发光分割线 */
.section--dark,.footer-main{
  position:relative;
  background-image:
    linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:56px 56px;
}
.section--dark::after,.footer-main::after{
  content:'';position:absolute;left:0;right:0;top:0;height:1px;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(34,211,255,.55),transparent);
}
/* 浅灰区块（.section-bg = --bg-gray）：改用极淡蓝网格 + 青色顶线，避免白线不可见 */
.section-bg{
  position:relative;
  background-image:
    linear-gradient(rgba(11,99,246,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(11,99,246,.055) 1px,transparent 1px);
  background-size:56px 56px;
}
.section-bg::after{
  content:'';position:absolute;left:0;right:0;top:0;height:1px;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(34,211,255,.45),transparent);
}
.section--dark > .container,.section-bg > .container,.footer-main > .container{position:relative;z-index:1}

/* ========== 2. HERO：鼠标跟随光晕 + 扫描线 ========== */
.hero{isolation:isolate;overflow:hidden}
.hero__glow{
  position:absolute;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(600px circle at var(--mx,50%) var(--my,38%),rgba(34,211,255,.18),transparent 62%),
    radial-gradient(900px circle at 88% 12%,rgba(11,99,246,.20),transparent 60%);
  transition:background .18s linear;
  mix-blend-mode:screen;
}
/* 缓慢移动的扫描线（极淡，仅在 hero） */
.hero::after{
  animation:techScan 9s linear infinite;
}
@keyframes techScan{
  0%{transform:translateY(-2%)}
  50%{transform:translateY(2%)}
  100%{transform:translateY(-2%)}
}
.hero-inner,.hero .container{position:relative;z-index:2}

/* 在线状态灯 */
.tech-live{
  display:inline-flex;align-items:center;gap:6px;
  padding:2px 9px;margin-right:8px;
  border-radius:var(--radius-full);
  background:rgba(34,211,255,.12);
  border:1px solid rgba(34,211,255,.35);
  color:#8fe8ff;
  font-family:var(--font-mono);
  font-size:10px;letter-spacing:.12em;font-weight:600;
  text-transform:uppercase;
  vertical-align:middle;
}
.pulse-dot{
  width:6px;height:6px;border-radius:50%;
  background:#22d3ff;
  box-shadow:0 0 0 0 rgba(34,211,255,.7);
  animation:techPulse 1.8s ease-out infinite;
  flex:0 0 auto;
}
@keyframes techPulse{
  0%{box-shadow:0 0 0 0 rgba(34,211,255,.65)}
  70%{box-shadow:0 0 0 8px rgba(34,211,255,0)}
  100%{box-shadow:0 0 0 0 rgba(34,211,255,0)}
}

/* ========== 3. 渐变描边卡片（现代科技标配） ========== */
.tech-frame{
  border:1px solid transparent;
  background:
    linear-gradient(var(--bg-white),var(--bg-white)) padding-box,
    linear-gradient(135deg,rgba(34,211,255,.55),rgba(11,99,246,.35) 45%,rgba(226,232,240,.7)) border-box;
}
.section--dark .tech-frame{
  background:
    linear-gradient(rgba(255,255,255,.05),rgba(255,255,255,.03)) padding-box,
    linear-gradient(135deg,rgba(34,211,255,.5),rgba(11,99,246,.3) 45%,rgba(255,255,255,.12)) border-box;
}

/* ========== 4. 卡片 / 按钮 微交互 ========== */
/* 主要卡片：hover 青色辉光 + 上浮，并出现跟随鼠标的高光 */
.svc-card,.plan-card,.qe-card,.why-item{
  position:relative;
  transition:transform .28s cubic-bezier(.22,.61,.36,1),
             box-shadow .28s cubic-bezier(.22,.61,.36,1),
             border-color .28s;
  will-change:transform;
}
.svc-card:hover,.plan-card:hover{
  border-color:rgba(34,211,255,.45);
  box-shadow:0 0 0 1px rgba(34,211,255,.28),
             0 20px 44px -16px rgba(11,99,246,.32);
  transform:translateY(-6px);
}
.qe-card:hover{
  border-color:rgba(34,211,255,.45);
  box-shadow:0 0 0 1px rgba(34,211,255,.22),
             0 12px 28px -12px rgba(11,99,246,.28);
  transform:translateY(-4px);
}
/* 鼠标跟随高光（::after 未被占用） */
.svc-card::after,.plan-card::after,.qe-card::after{
  content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(320px circle at var(--mx,50%) var(--my,50%),rgba(34,211,255,.10),transparent 60%);
  opacity:0;transition:opacity .3s;
}
.svc-card:hover::after,.plan-card:hover::after,.qe-card:hover::after{opacity:1}

/* 按钮：扫光 + 发光 */
.btn{position:relative;overflow:hidden}
.btn-accent{
  background:linear-gradient(135deg,#22d3ff 0%,#0b8fe8 100%);
  color:#04101f;
  box-shadow:0 6px 20px -6px rgba(34,211,255,.55);
}
.btn-accent:hover{
  box-shadow:0 10px 30px -8px rgba(34,211,255,.75);
  transform:translateY(-2px);
}
.btn-accent::after{
  content:'';position:absolute;top:0;left:-120%;width:60%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);
  transform:skewX(-20deg);
  transition:none;
}
.btn-accent:hover::after{animation:techSweep .7s ease}
@keyframes techSweep{to{left:140%}}

.btn-primary:hover{
  box-shadow:0 10px 26px -10px rgba(11,99,246,.6);
  transform:translateY(-2px);
}

/* ========== 5. 数据等宽化（技术指标感） ========== */
.stat-block__num,.speed-item__value,.plan-card__title,.svc-card__price{
  font-variant-numeric:tabular-nums;
}
.stat-block__num{
  font-family:var(--font-mono);
  letter-spacing:-.02em;
  text-shadow:0 0 24px rgba(34,211,255,.35);
}
.speed-item__value{
  font-family:var(--font-mono);
  letter-spacing:-.01em;
}
/* 小标签统一成等宽大写（技术规格贴纸） */
.tag{font-family:var(--font-mono);letter-spacing:.02em}

/* ========== 6. 章节标题：加一条渐变下划光带 ========== */
.section-header{position:relative}
.section-title{position:relative;display:inline-block}
.section-badge{
  font-family:var(--font-mono);
  letter-spacing:.14em;
  text-transform:uppercase;
}

/* ========== 7. 滚动进场动画 ========== */
[data-reveal]{
  opacity:0;
  transform:translateY(22px);
  transition:opacity .6s cubic-bezier(.22,.61,.36,1),transform .6s cubic-bezier(.22,.61,.36,1);
}
[data-reveal].is-in{opacity:1;transform:none}

/* ========== 8. 图标容器：hover 时轻微放大 + 发光 ========== */
.svc-card__icon,.plan-card__icon,.why-icon,.speed-item__icon,.qe-card__icon{
  transition:transform .3s cubic-bezier(.22,.61,.36,1),box-shadow .3s,background .3s,color .3s;
}
.svc-card:hover .svc-card__icon,
.plan-card:hover .plan-card__icon,
.qe-card:hover .qe-card__icon{
  transform:scale(1.08) rotate(-3deg);
  box-shadow:0 8px 20px -8px rgba(11,99,246,.55);
}

/* ========== 9. 焦点可见性（无障碍 + 专业度） ========== */
a:focus-visible,button:focus-visible,.btn:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:2px;
  border-radius:var(--radius-sm);
}

/* ========== 10. 降低动效偏好（尊重系统设置） ========== */
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}
  [data-reveal]{opacity:1;transform:none}
  .hero::after{animation:none}
}

/* ========== 11. 移动端收敛 ========== */
@media (max-width:768px){
  .section--dark,.section-bg,.footer-main{background-size:40px 40px}
  .hero__glow{background:radial-gradient(420px circle at 50% 25%,rgba(34,211,255,.20),transparent 65%)}
  [data-reveal]{transform:translateY(14px)}
}

/* ============================================================
 * 12. 专业度收敛：悬浮球 / 促销徽章 / 杂色统一
 *     原则：一屏只允许一个强调色（青），其余全部中性化
 * ============================================================ */

/* 12.1 右侧悬浮球：从 7 色彩虹收敛为「白底 + 单一青色 CTA」 */
.eycit-fab--wechat,.eycit-fab--ai,.eycit-fab--book,
.eycit-fab--urgent,.eycit-fab--more,.eycit-fab--top{
  background:#fff !important;
  color:var(--primary) !important;
  border:1px solid var(--border);
  box-shadow:0 4px 14px rgba(15,23,42,.14) !important;
  animation:none !important;
}
.eycit-fab--wechat:hover,.eycit-fab--ai:hover,.eycit-fab--book:hover,
.eycit-fab--urgent:hover,.eycit-fab--more:hover{
  background:var(--primary-light) !important;
  border-color:var(--primary) !important;
  box-shadow:0 6px 18px rgba(11,99,246,.28) !important;
}
.eycit-fab--top:hover{background:var(--bg-gray) !important;border-color:var(--border) !important}
/* 电话 = 次强调（深蓝实底，白图标） */
.eycit-fab--phone{
  background:var(--grad-primary) !important;
  color:#fff !important;
  box-shadow:0 4px 14px rgba(11,99,246,.38) !important;
}
/* 报价 = 唯一强调 CTA（青色渐变） */
.eycit-fab--quote{
  background:var(--grad-accent) !important;
  color:#04101f !important;
  box-shadow:0 4px 16px rgba(34,211,255,.45) !important;
}
/* 悬浮球上的文字标签 */
.eycit-fab__label{letter-spacing:.02em}

/* 12.2 服务卡「热门」徽章：全员热门等于没有热门，整排去掉 */
.svc-card .card-badge,.svc-card__badge,
.service-icon .badge-hot,.service-card .hot-badge{display:none !important}

/* 12.3 顶部条「新客立减20元」：红色促销 → 青色克制提示 */
.meta-promo{
  background:rgba(34,211,255,.10) !important;
  color:#7fe0ff !important;
  border:1px solid rgba(34,211,255,.30) !important;
}
.meta-promo i{color:#22d3ff !important}

/* 12.4 黄色 VIP 促销条 / 金色升级链接 → 统一主蓝 */
a[style*="color:#d97706"],
a[style*="color: #d97706"]{color:var(--primary) !important;text-decoration:none !important}

/* 12.5 页面级杂色图标徽章（免费/精选推荐等绿色小标 → 中性灰蓝） */
.tag-free,.badge-free,.soft-tag--free{
  background:var(--bg-gray) !important;color:var(--text-gray) !important;
  border:1px solid var(--border) !important;
}

/* 12.6 栅格平衡：6 张优势卡在 4 列下会变成 4+2 留白，改 3×2 */
.why-grid{grid-template-columns:repeat(3,1fr) !important;gap:16px}
@media (max-width:992px){.why-grid{grid-template-columns:repeat(2,1fr) !important}}
@media (max-width:640px){.why-grid{grid-template-columns:1fr !important}}

/* 12.7 可读性兜底：10px / 11px 在中文站点不可读，统一抬到 12px */
[style*="font-size:10px"],[style*="font-size: 10px"],
[style*="font-size:11px"],[style*="font-size: 11px"]{font-size:12px !important}
/* ===== utilities.css ===== */
/* ============================================================
 * 易云城 IT 服务 · 语义化组件 & 精确工具类  utilities.css v1
 * 由 .workbuddy/tests/refactor_inline_round2.py 自动生成，
 * 修改请改脚本后重跑，勿手改本文件。
 * 命名约定：数字后缀 = px（.mb-20 = 20px）；fsr-105 = 1.05rem。
 * 本文件必须最后加载，用于覆盖旧样式。
 * ============================================================ */

/* -- 语义化组件 -- */
.tbl-cell{border:1px solid #dee2e6;padding:8px}
.stat-tile{background:linear-gradient(150deg,#04101f,#0a2547);color:#fff;border-radius:14px;padding:22px 12px}
.stat-tile__num{font-size:2rem;font-weight:700;line-height:1;color:#22d3ff;font-variant-numeric:tabular-nums}
.stat-big{font-size:2.5rem;font-weight:700;color:var(--primary)}
.case-card{background:#fff;border-radius:16px;padding:28px;box-shadow:0 4px 15px rgba(0,0,0,0.06);border:1px solid var(--border)}
.case-card__head{display:flex;align-items:center;gap:14px;margin-bottom:18px}
.case-card__title{font-size:1rem;font-weight:700;color:var(--text);margin-bottom:10px;line-height:1.5}
.case-card__name{font-weight:700;font-size:1.05rem;color:var(--text-dark)}
.case-card__meta{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-gray);padding-top:14px;border-top:1px solid var(--border)}
.tool-card{background:var(--bg-light);border-radius:12px;padding:24px 20px;text-align:center;border:1px solid var(--border);transition:all 0.2s}
.tool-card--plain{background:var(--bg-light);border-radius:12px;padding:24px;text-align:center;border:1px solid var(--border)}
.tool-card__icon{font-size:28px;margin-bottom:12px}
.tool-card__title{font-size:1rem;font-weight:700;color:var(--text-dark);margin-bottom:8px}
.tool-card__title-lg{font-size:1rem;font-weight:700;color:var(--text-dark);margin-bottom:12px}
.panel-white{background:#fff;border-radius:12px;padding:24px;border:1px solid var(--border)}
.panel-white-sm{background:#fff;border-radius:12px;padding:20px;border:1px solid var(--border)}
.panel-soft{background:#fff;border-radius:10px;padding:20px}
.panel-card{background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:28px}
.panel-dark{background:#162447;border-radius:16px;padding:20px;border:1px solid rgba(255,255,255,0.08)}
.panel-glass{background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.08);border-radius:12px;padding:14px;text-align:center}
.panel-glass-sm{background:rgba(255,255,255,0.06);border-radius:10px;padding:12px;text-align:center}
.icon-round-60{width:60px;height:60px;background:rgba(96,165,250,0.15);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 14px;font-size:24px;color:#60a5fa}
.icon-round-80{width:80px;height:80px;background:var(--primary);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:2rem;margin:0 auto 10px}
.icon-round-56{width:56px;height:56px;background:linear-gradient(135deg,#07c160,#04b03f);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 16px}
.icon-sq-32{width:32px;height:32px;background:rgba(96,165,250,0.2);border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#60a5fa;font-size:14px}
.icon-sq-44{width:44px;height:44px;background:var(--primary);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:18px;font-weight:700;flex-shrink:0}
.icon-sq-48{width:48px;height:48px;background:rgba(255,255,255,0.15);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:1.2rem;font-weight:700;margin-bottom:12px}
.icon-sq-60x50{width:60px;height:50px;background:var(--primary-light);border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.modal-mask{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.6);z-index:9999;align-items:center;justify-content:center}
.modal-mask-lg{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.65);z-index:99999;align-items:center;justify-content:center;backdrop-filter:blur(4px)}
.modal-box{background:#fff;border-radius:16px;padding:30px;text-align:center;max-width:340px;width:90%;position:relative}
.modal-close{position:absolute;top:12px;right:16px;background:none;border:none;font-size:22px;cursor:pointer;color:#999;line-height:1}
.qr-box{width:220px;height:220px;margin:0 auto;background:#fff;border:2px solid #e5e7eb;border-radius:12px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.alert-info{background:#d1ecf1;border-left:4px solid #17a2b8;padding:12px 15px;margin:15px 0;border-radius:0 4px 4px 0}
.alert-warn{background:#fff3cd;border-left:4px solid #ffc107;padding:12px 15px;margin:15px 0;border-radius:0 4px 4px 0}
.alert-err{background:#f8d7da;border-left:4px solid #dc3545;padding:12px 15px;margin:15px 0;border-radius:0 4px 4px 0}
.chip-soft{background:var(--bg-light);color:var(--text-light);padding:1px 7px;border-radius:10px;font-size:11px}
.chip-soft-8{background:var(--bg-light);color:var(--text-light);padding:1px 8px;border-radius:10px;font-size:11px}
.chip-primary{background:var(--primary-light);color:var(--primary);padding:1px 8px;border-radius:10px}
.chip-primary-12{background:var(--primary-light);color:var(--primary);padding:2px 10px;border-radius:10px;font-size:12px}
.chip-gold{font-size:12px;background:rgba(251,191,36,0.18);color:#fbbf24;display:inline-block;padding:2px 10px;border-radius:20px;margin-bottom:6px;font-weight:700}
.chip-success-soft{background:#10b98118;border-radius:20px;color:#10b981;font-size:11px;padding:4px 10px}
.chip-warning-soft{background:#f59e0b18;border-radius:20px;color:#f59e0b;font-size:11px;padding:4px 10px}
.chip-orange{background:#fff7ed;border-radius:20px;border:1px solid #fed7aa;color:#c2410c;font-size:11px;font-weight:700;padding:2px 10px}
.chip-red{background:#fef2f2;border-radius:20px;border:1px solid #fecaca;color:#dc2626;font-size:11px;font-weight:700;padding:2px 10px}
.bg-grad-violet{background:linear-gradient(135deg,#667eea,#764ba2)}
.bg-grad-pink{background:linear-gradient(135deg,#f093fb,#f5576c)}
.bg-grad-sky{background:linear-gradient(135deg,#4facfe,#00f2fe)}
.bg-grad-mint{background:linear-gradient(135deg,#43e97b,#38f9d7)}
.bg-grad-amber{background:linear-gradient(135deg,#f7971e,#ffd200)}
.bg-grad-deep{background:linear-gradient(135deg,#30cfd0,#330867)}
.sec-title-lg{border-bottom:1px solid var(--border);font-size:1.2rem;font-weight:700;margin-bottom:25px;padding-bottom:12px}
.sec-title-md{border-bottom:1px solid var(--border);font-size:1.2rem;font-weight:700;margin-bottom:22px;padding-bottom:12px}
.sec-title-flex{align-items:center;border-bottom:2px solid var(--primary-light);display:flex;font-size:1.2rem;font-weight:700;gap:10px;margin-bottom:20px;padding-bottom:12px}
.sec-title-under{border-bottom:2px solid var(--primary);display:inline-block;font-size:18px;font-weight:600;margin-bottom:15px;padding-bottom:12px}
.cta-dark{align-items:center;background:linear-gradient(135deg,#1e293b,#0f172a);border-radius:14px;display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;margin-top:20px;padding:24px 22px}
.empty-state{background:var(--bg-light);border-radius:var(--radius);color:var(--text-light);padding:50px 20px;text-align:center}
.qr-overlay{background:rgba(255,255,255,0.97);border-radius:20px;display:none;inset:0;padding-top:60px;position:absolute;text-align:center}
.doc-panel-top{background:var(--bg-white);border-radius:var(--radius);border:1px solid var(--border);box-shadow:var(--shadow);margin-top:20px;padding:22px}
.field-box{background:#fff;border-radius:10px;border:2px solid #e5e7eb;box-sizing:border-box;font-size:14px;outline:none;padding:11px 14px;width:100%}
.empty-icon{color:#d1d5db;display:block;font-size:32px;margin-bottom:8px}
.list-head{margin-bottom:20px;padding:18px 20px}
.btn-grad{background:linear-gradient(135deg,var(--primary),var(--secondary));color:#fff;border:none;text-align:center}
.btn-ghost-w{background:rgba(255,255,255,0.2);color:#fff;border:1px solid rgba(255,255,255,0.3)}
.btn-round-x{background:rgba(255,255,255,0.2);border:none;color:#fff;width:30px;height:30px;border-radius:50%;cursor:pointer;font-size:18px;line-height:1}
.btn-bare{background:none;border:none;font-size:22px;cursor:pointer;color:#94a3b8}
.filter-pill{background:#fff;border:1px solid #e2e8f0;border-radius:20px;padding:5px 12px;font-size:12px;color:#374151;cursor:pointer;transition:all 0.2s}
.code-block{background:#2d2d2d;color:#f8f8f2;padding:15px;border-radius:6px;overflow-x:auto}
.clamp-2{line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sec-pad{padding:35px 20px 60px}
.sec-pad-lg{padding:40px 20px 60px}
.quote-box{background:var(--primary-light);border-left:4px solid var(--primary);padding:12px 16px;border-radius:0 var(--radius-sm) var(--radius-sm) 0;margin-bottom:18px;color:var(--text-dark);font-size:14px}
.grid-2col{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.grid-side{display:grid;grid-template-columns:1fr 280px;gap:24px}

/* -- 工具类 -- */
.d-flex{display:flex}
.d-grid{display:grid}
.d-block{display:block}
.d-inline{display:inline}
.d-inline-block{display:inline-block}
.d-none{display:none}
.rel{position:relative}
.z-1{z-index:1}
.cur-p{cursor:pointer}
.ovh{overflow:hidden}
.ovx-auto{overflow-x:auto}
.flex-col{flex-direction:column}
.flex-1{flex:1}
.shrink-0{flex-shrink:0}
.minw-0{min-width:0}
.align-center{align-items:center}
.align-start{align-items:flex-start}
.justify-center{justify-content:center}
.justify-between{justify-content:space-between}
.justify-end{justify-content:flex-end}
.flex-wrap{flex-wrap:wrap}
.gap-1{gap:4px}
.gap-6{gap:6px}
.gap-2{gap:8px}
.gap-10{gap:10px}
.gap-3{gap:12px}
.gap-14{gap:14px}
.gap-15{gap:15px}
.gap-4{gap:16px}
.gap-5{gap:20px}
.gap-24{gap:24px}
.gap-30{gap:30px}
.text-center{text-align:center}
.text-left{text-align:left}
.text-right{text-align:right}
.fw-normal{font-weight:400}
.fw-medium{font-weight:500}
.fw-semibold{font-weight:600}
.fw-bold{font-weight:700}
.italic{font-style:italic}
.nowrap{white-space:nowrap}
.no-underline{text-decoration:none}
.list-none{list-style:none}
.obj-cover{object-fit:cover}
.bc-collapse{border-collapse:collapse}
.col-full{grid-column:1/-1}
.cols-2{grid-template-columns:1fr 1fr}
.cols-3{grid-template-columns:repeat(3,1fr)}
.cols-4{grid-template-columns:repeat(4,1fr)}
.cols-side{grid-template-columns:1fr 280px}
.cols-auto300{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.cols-auto280{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.tr-all{transition:all 0.2s}
.tr{transition:var(--transition)}
.bs-border{box-sizing:border-box}
.outline-0{outline:none}
.fs-10{font-size:10px}
.fs-11{font-size:11px}
.fs-12{font-size:12px}
.fs-13{font-size:13px}
.fs-14{font-size:14px}
.fs-15{font-size:15px}
.fs-16{font-size:16px}
.fs-18{font-size:18px}
.fs-20{font-size:20px}
.fs-22{font-size:22px}
.fs-24{font-size:24px}
.fs-28{font-size:28px}
.fs-32{font-size:32px}
.fs-36{font-size:36px}
.fs-40{font-size:40px}
.fs-50{font-size:50px}
.fsr-10{font-size:1rem}
.fsr-105{font-size:1.05rem}
.fsr-11{font-size:1.1rem}
.fsr-12{font-size:1.2rem}
.fsr-13{font-size:1.3rem}
.fsr-15{font-size:1.5rem}
.fsr-18{font-size:1.8rem}
.fsr-20{font-size:2rem}
.fsr-25{font-size:2.5rem}
.fsr-30{font-size:3rem}
.lh-1{line-height:1}
.lh-14{line-height:1.4}
.lh-snug{line-height:1.5}
.lh-16{line-height:1.6}
.lh-17{line-height:1.7}
.lh-18{line-height:1.8}
.lh-2{line-height:2}
.color-primary{color:var(--primary)}
.color-primary{color:#0b63f6}
.color-accent{color:var(--accent)}
.color-accent{color:#00c8ff}
.color-success{color:var(--success)}
.color-success{color:#10b981}
.color-warning{color:var(--warning)}
.color-warning{color:#f59e0b}
.color-danger{color:var(--danger)}
.color-danger{color:#dc2626}
.color-gray{color:var(--text-gray)}
.color-gray{color:#64748b}
.color-light{color:var(--text-light)}
.color-light{color:#94a3b8}
.color-dark{color:var(--text-dark)}
.color-dark{color:#0f172a}
.color-body{color:var(--text)}
.color-body{color:#334155}
.color-white{color:#fff}
.fw-bold{font-weight:800}
.c-green{color:#059669}
.c-green-5{color:#22c55e}
.c-wechat{color:#07c160}
.c-red{color:#ef4444}
.c-red-6{color:#e6162d}
.c-amber{color:#d97706}
.c-blue{color:#3b82f6}
.c-blue-6{color:#2563eb}
.c-blue-7{color:#1a6fd4}
.c-purple{color:#8b5cf6}
.c-violet{color:#7c3aed}
.c-gold{color:#d4af37}
.c-sky{color:#60a5fa}
.c-cyan{color:#22d3ff}
.c-cyan-6{color:#06b6d4}
.c-slate8{color:#1e293b}
.c-gray4{color:#9ca3af}
.c-gray5{color:#6b7280}
.c-g666{color:#666}
.c-g888{color:#888}
.c-g999{color:#999}
.c-ccc{color:#ccc}
.c-333{color:#333}
.c-374{color:#374151}
.c-gray3{color:#d1d5db}
.c-6c757d{color:#6c757d}
.c-92400e{color:#92400e}
.c-16a34a{color:#16a34a}
.bdc-wechat{border-color:#07c160}
.c-w50{color:rgba(255,255,255,0.5)}
.c-w70{color:rgba(255,255,255,0.7)}
.c-w72{color:rgba(255,255,255,0.72)}
.c-w75{color:rgba(255,255,255,0.75)}
.c-w80{color:rgba(255,255,255,0.8)}
.c-w85{color:rgba(255,255,255,0.85)}
.bg-white{background:#fff}
.bg-white{background:var(--bg-white)}
.bg-light{background:var(--bg-light)}
.bg-light{background:#f8fafc}
.bg-gray{background:var(--bg-gray)}
.bg-gray{background:#f1f5f9}
.bg-gray100{background:#f8f9fa}
.bg-gray50{background:#f9fafb}
.bg-primary-light{background:var(--primary-light)}
.bg-primary{background:var(--primary)}
.bg-glass-10{background:rgba(255,255,255,0.1)}
.bg-glass-15{background:rgba(255,255,255,0.15)}
.bg-glass-2{background:rgba(255,255,255,0.2)}
.bg-none{background:none}
.bg-grad-primary{background:linear-gradient(135deg,var(--primary),var(--secondary))}
.bd{border:1px solid var(--border)}
.bd-cell{border:1px solid #dee2e6}
.bd-0{border:none}
.bd-ee{border:1px solid #eee}
.bd-b{border-bottom:1px solid var(--border)}
.bd-t{border-top:1px solid var(--border)}
.bdb-cell{border-bottom:1px solid #dee2e6}
.bdb-light{border-bottom:1px solid #f0f0f0}
.bdb-ee{border-bottom:1px solid #eee}
.bdb-primary{border-bottom:2px solid var(--primary)}
.bd-e5{border:2px solid #e5e7eb}
.bd-2-e2{border:2px solid #e2e8f0}
.bd{border:1px solid #e2e8f0}
.r-3{border-radius:3px}
.r-4{border-radius:4px}
.r-6{border-radius:6px}
.r-8{border-radius:8px}
.r-10{border-radius:10px}
.r-12{border-radius:12px}
.r-16{border-radius:16px}
.r-20{border-radius:20px}
.r-circle{border-radius:50%}
.r-sm{border-radius:var(--radius-sm)}
.r-md{border-radius:var(--radius)}
.r-lg{border-radius:var(--radius-lg)}
.sh-card{box-shadow:0 2px 8px rgba(0,0,0,0.06)}
.shadow-md{box-shadow:var(--shadow-md)}
.sh{box-shadow:var(--shadow)}
.op-50{opacity:0.5}
.op-65{opacity:0.65}
.op-70{opacity:0.7}
.op-75{opacity:0.75}
.op-80{opacity:0.8}
.ml-auto{margin-left:auto}
.mx-auto{margin-left:auto;margin-right:auto}
.m-0{margin:0}
.p-0{padding:0}
.mt-0{margin-top:0px}
.mt-3{margin-top:3px}
.mt-4{margin-top:4px}
.mt-5{margin-top:5px}
.mt-6{margin-top:6px}
.mt-8{margin-top:8px}
.mt-10{margin-top:10px}
.mt-14{margin-top:14px}
.mt-15{margin-top:15px}
.mt-16{margin-top:16px}
.mt-18{margin-top:18px}
.mt-20{margin-top:20px}
.mt-24{margin-top:24px}
.mt-28{margin-top:28px}
.mt-30{margin-top:30px}
.mt-35{margin-top:35px}
.mt-40{margin-top:40px}
.mb-0{margin-bottom:0px}
.mb-3{margin-bottom:3px}
.mb-4{margin-bottom:4px}
.mb-5{margin-bottom:5px}
.mb-6{margin-bottom:6px}
.mb-8{margin-bottom:8px}
.mb-10{margin-bottom:10px}
.mb-12{margin-bottom:12px}
.mb-14{margin-bottom:14px}
.mb-15{margin-bottom:15px}
.mb-16{margin-bottom:16px}
.mb-18{margin-bottom:18px}
.mb-20{margin-bottom:20px}
.mb-22{margin-bottom:22px}
.mb-24{margin-bottom:24px}
.mb-25{margin-bottom:25px}
.mb-30{margin-bottom:30px}
.mb-35{margin-bottom:35px}
.mb-40{margin-bottom:40px}
.mb-50{margin-bottom:50px}
.mr-3{margin-right:3px}
.mr-4{margin-right:4px}
.mr-5{margin-right:5px}
.mr-6{margin-right:6px}
.mr-8{margin-right:8px}
.mr-10{margin-right:10px}
.mr-12{margin-right:12px}
.ml-4{margin-left:4px}
.ml-6{margin-left:6px}
.ml-8{margin-left:8px}
.ml-10{margin-left:10px}
.ml-12{margin-left:12px}
.ml-15{margin-left:15px}
.ml-20{margin-left:20px}
.pt-0{padding-top:0px}
.pt-12{padding-top:12px}
.pt-14{padding-top:14px}
.pt-15{padding-top:15px}
.pt-16{padding-top:16px}
.pt-20{padding-top:20px}
.pt-30{padding-top:30px}
.pt-35{padding-top:35px}
.pt-40{padding-top:40px}
.pt-60{padding-top:60px}
.pb-10{padding-bottom:10px}
.pb-12{padding-bottom:12px}
.pb-14{padding-bottom:14px}
.pb-16{padding-bottom:16px}
.pb-24{padding-bottom:24px}
.pb-30{padding-bottom:30px}
.pb-36{padding-bottom:36px}
.pb-40{padding-bottom:40px}
.pb-50{padding-bottom:50px}
.pb-60{padding-bottom:60px}
.pl-0{padding-left:0px}
.pl-12{padding-left:12px}
.pl-20{padding-left:20px}
.pr-0{padding-right:0px}
.p-0{padding:0px}
.p-8{padding:8px}
.p-10{padding:10px}
.p-12{padding:12px}
.p-14{padding:14px}
.p-15{padding:15px}
.p-16{padding:16px}
.p-18{padding:18px}
.p-20{padding:20px}
.p-24{padding:24px}
.p-25{padding:25px}
.p-30{padding:30px}
.p-35{padding:35px}
.p-40{padding:40px}
.py-1{padding-top:1px;padding-bottom:1px}
.py-2{padding-top:2px;padding-bottom:2px}
.py-4{padding-top:4px;padding-bottom:4px}
.py-5{padding-top:5px;padding-bottom:5px}
.py-6{padding-top:6px;padding-bottom:6px}
.py-7{padding-top:7px;padding-bottom:7px}
.py-8{padding-top:8px;padding-bottom:8px}
.py-10{padding-top:10px;padding-bottom:10px}
.py-12{padding-top:12px;padding-bottom:12px}
.py-15{padding-top:15px;padding-bottom:15px}
.py-16{padding-top:16px;padding-bottom:16px}
.py-18{padding-top:18px;padding-bottom:18px}
.py-20{padding-top:20px;padding-bottom:20px}
.py-22{padding-top:22px;padding-bottom:22px}
.px-6{padding-left:6px;padding-right:6px}
.px-8{padding-left:8px;padding-right:8px}
.px-10{padding-left:10px;padding-right:10px}
.px-12{padding-left:12px;padding-right:12px}
.px-14{padding-left:14px;padding-right:14px}
.px-15{padding-left:15px;padding-right:15px}
.px-16{padding-left:16px;padding-right:16px}
.px-18{padding-left:18px;padding-right:18px}
.px-20{padding-left:20px;padding-right:20px}
.px-22{padding-left:22px;padding-right:22px}
.px-24{padding-left:24px;padding-right:24px}
.my-0{margin-top:0px;margin-bottom:0px}
.my-10{margin-top:10px;margin-bottom:10px}
.my-20{margin-top:20px;margin-bottom:20px}
.mx-0{margin-left:0px;margin-right:0px}
.mx-10{margin-left:10px;margin-right:10px}
.mx-20{margin-left:20px;margin-right:20px}
.w-14{width:14px}
.w-16{width:16px}
.w-18{width:18px}
.w-32{width:32px}
.w-40{width:40px}
.w-50{width:50px}
.w-60{width:60px}
.w-70{width:70px}
.w-80{width:80px}
.w-90{width:90px}
.w-100{width:100px}
.w-110{width:110px}
.w-120{width:120px}
.w-130{width:130px}
.w-140{width:140px}
.w-150{width:150px}
.w-180{width:180px}
.w-200{width:200px}
.h-32{height:32px}
.h-40{height:40px}
.h-50{height:50px}
.h-60{height:60px}
.h-80{height:80px}
.h-100{height:100px}
.h-180{height:180px}
.maxw-120{max-width:120px}
.maxw-140{max-width:140px}
.maxw-150{max-width:150px}
.maxw-200{max-width:200px}
.maxw-280{max-width:280px}
.maxw-400{max-width:400px}
.maxw-440{max-width:440px}
.maxw-500{max-width:500px}
.maxw-600{max-width:600px}
.maxw-720{max-width:720px}
.maxw-760{max-width:760px}
.maxw-900{max-width:900px}
.maxw-1000{max-width:1000px}
.minh-160{min-height:160px}
.minh-300{min-height:300px}
.minh-400{min-height:400px}
.w-full{width:100%}
.h-full{height:100%}
.minw-200{min-width:200px}
.fs-9{font-size:9px}

/* ========== 10. 工具类 ========== */
.text-accent{color:var(--accent)}
.text-primary{color:var(--primary)}
.text-success{color:var(--success)}
.text-center{text-align:center}
.fw-normal{font-weight:var(--fw-normal)}
.fw-medium{font-weight:var(--fw-medium)}
.fw-semibold{font-weight:var(--fw-semibold)}
.fw-bold{font-weight:var(--fw-bold)}
.mt-2{margin-top:var(--sp-2)}
.mt-4{margin-top:var(--sp-4)}
.mt-6{margin-top:var(--sp-6)}
.mt-8{margin-top:var(--sp-8)}
.mb-4{margin-bottom:var(--sp-4)}
.mb-6{margin-bottom:var(--sp-6)}
.mb-8{margin-bottom:var(--sp-8)}
.grid{display:grid;gap:var(--sp-5)}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
.flex{display:flex;align-items:center}
.gap-2{gap:var(--sp-2)}
.gap-3{gap:var(--sp-3)}
.gap-4{gap:var(--sp-4)}

/* -- 从 design-system.css 迁移的通用工具类 -- */
.d-flex{display:flex}
.d-grid{display:grid}
.d-block{display:block}
.d-inline-block{display:inline-block}
.d-none{display:none}
.flex-wrap{flex-wrap:wrap}
.flex-nowrap{flex-wrap:nowrap}
.align-center{align-items:center}
.align-start{align-items:flex-start}
.align-end{align-items:flex-end}
.align-stretch{align-items:stretch}
.justify-center{justify-content:center}
.justify-between{justify-content:space-between}
.justify-end{justify-content:flex-end}
.justify-start{justify-content:flex-start}
.text-left{text-align:left}
.text-right{text-align:right}
.w-auto{width:auto}
.maxw-720{max-width:720px}
.maxw-900{max-width:900px}
.nowrap{white-space:nowrap}
.color-primary{color:var(--primary)}
.color-accent{color:var(--accent)}
.color-success{color:var(--success)}
.color-warning{color:var(--warning)}
.color-danger{color:var(--danger)}
.color-gray{color:var(--text-gray)}
.color-light{color:var(--text-light)}
.color-white{color:#fff}
.mt-1{margin-top:var(--sp-1)}
.mt-3{margin-top:var(--sp-3)}
.mb-1{margin-bottom:var(--sp-1)}
.mb-2{margin-bottom:var(--sp-2)}
.mb-3{margin-bottom:var(--sp-3)}
.mb-5{margin-bottom:var(--sp-5)}
.mx-auto{margin-left:auto;margin-right:auto}
.lh-tight{line-height:1.4}
.lh-snug{line-height:1.5}
.fs-xs{font-size:var(--fs-xs)}
.fs-sm{font-size:var(--fs-sm)}
.fs-base{font-size:var(--fs-base)}
.fs-lg{font-size:var(--fs-lg)}
.fs-xl{font-size:var(--fs-xl)}
.radius-md{border-radius:var(--radius-md)}
.radius-lg{border-radius:var(--radius-lg)}
.shadow-sm{box-shadow:var(--shadow-sm)}
.shadow-md{box-shadow:var(--shadow-md)}
.lh-16{line-height:1.6}
.lh-17{line-height:1.7}
.lh-18{line-height:1.8}
.lh-2{line-height:2}
.gap-5{gap:var(--sp-5)}
.m-0{margin:0}
.p-0{padding:0}
.radius-sm{border-radius:var(--radius-sm)}
.radius-xl{border-radius:var(--radius-xl)}
.radius-full{border-radius:var(--radius-full)}