/* ============================================================
   tpl4 号易号卡平台 · 极夜星空风
   深蓝黑 #0B1026 底 + 霓虹青 #00E5FF / 紫 #7C4DFF / 金 #FFC53D
   ============================================================ */
*{margin:0;padding:0;box-sizing:border-box}
:root{
  --bg:#0B1026; --bg2:#101736; --bg3:#151D45;
  --card:#141B3C; --card2:#1A2350;
  --cyan:#00E5FF; --purple:#7C4DFF; --gold:#FFC53D;
  --text:#E6ECFF; --text2:#9AA7D0; --text3:#6C79A6;
  --border:rgba(124,77,255,.22);
  --grad:linear-gradient(135deg,#00E5FF 0%,#7C4DFF 100%);
}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:"PingFang SC","Microsoft YaHei",sans-serif;font-size:15px;line-height:1.7;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{max-width:100%;vertical-align:middle}
ul,ol{list-style:none}
.container{max-width:1200px;margin:0 auto;padding:0 20px}
.btn{display:inline-flex;align-items:center;justify-content:center;border:none;border-radius:8px;cursor:pointer;font-size:14px;font-weight:600;padding:10px 24px;transition:all .25s;line-height:1.4}
.btn-primary{background:var(--grad);color:#fff;box-shadow:0 6px 20px rgba(124,77,255,.35)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(0,229,255,.4)}
.btn-glow{background:rgba(255,197,61,.12);color:var(--gold);border:1px solid rgba(255,197,61,.45)}
.btn-glow:hover{background:rgba(255,197,61,.22);box-shadow:0 0 18px rgba(255,197,61,.35)}
.btn-outline{background:transparent;color:var(--cyan);border:1px solid rgba(0,229,255,.5)}
.btn-outline:hover{background:rgba(0,229,255,.1);box-shadow:0 0 18px rgba(0,229,255,.3)}
.btn-sm{padding:7px 16px;font-size:13px}
.btn-lg{padding:13px 34px;font-size:16px}
.btn-block{width:100%}
.hidden{display:none}

/* ---------- 顶部条 ---------- */
.topbar{background:rgba(9,12,32,.9);border-bottom:1px solid rgba(124,77,255,.15);font-size:13px;color:var(--text2)}
.topbar-inner{display:flex;justify-content:space-between;align-items:center;height:38px}
.topbar-item{margin-right:18px}
.topbar-item a{color:var(--text2)}
.topbar-item a:hover{color:var(--cyan)}
.topbar-extra{color:var(--text3);letter-spacing:.5px}

/* ---------- 头部 ---------- */
.site-header{position:sticky;top:0;z-index:100;background:rgba(11,16,38,.88);backdrop-filter:blur(14px);border-bottom:1px solid rgba(124,77,255,.2)}
.header-inner{display:flex;align-items:center;height:74px;gap:30px}
.logo a{display:flex;align-items:baseline;gap:10px}
.logo-mark{font-size:26px;font-weight:800;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:1px}
.logo-mark sup{font-size:12px;-webkit-text-fill-color:var(--gold)}
.logo-domain{font-size:12px;color:var(--text3)}
.main-nav{flex:1}
.nav-list{display:flex;gap:6px}
.nav-list li a{display:block;padding:8px 16px;border-radius:8px;color:var(--text2);font-weight:500;transition:all .2s}
.nav-list li a:hover{color:var(--cyan)}
.nav-list li.active a{color:#fff;background:rgba(0,229,255,.12);box-shadow:inset 0 -2px 0 var(--cyan)}
.header-actions{display:flex;gap:10px;align-items:center}
.hamburger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:6px}
.hamburger span{display:block;width:24px;height:2px;background:var(--text);transition:all .3s}

/* ---------- 按钮/通用区块标题 ---------- */
.section{padding:76px 0}
.section-head{text-align:center;margin-bottom:46px}
.section-title{font-size:30px;font-weight:800;letter-spacing:1px}
.section-title::after{content:"";display:block;width:56px;height:3px;background:var(--grad);margin:14px auto 0;border-radius:3px}
.section-sub{margin-top:12px;color:var(--text3);font-size:15px}
.empty-tip{color:var(--text3);text-align:center;grid-column:1/-1}

/* ---------- Hero ---------- */
.hero{position:relative;padding:96px 0 104px;text-align:center;background:radial-gradient(ellipse at 30% 20%,rgba(124,77,255,.22),transparent 60%),radial-gradient(ellipse at 75% 35%,rgba(0,229,255,.14),transparent 55%),var(--bg)}
.hero-stars{position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(2px 2px at 20px 30px,rgba(255,255,255,.6),transparent),radial-gradient(2px 2px at 120px 90px,rgba(255,255,255,.45),transparent),radial-gradient(1.5px 1.5px at 220px 160px,rgba(255,255,255,.5),transparent),radial-gradient(1.5px 1.5px at 80px 200px,rgba(0,229,255,.6),transparent);background-size:240px 240px;opacity:.5}
.hero-inner{position:relative;z-index:2}
.hero-title{font-size:44px;font-weight:900;line-height:1.35;letter-spacing:2px}
.hero-title b{color:var(--cyan)}
.hero-sub{margin-top:18px;font-size:18px;color:var(--text2)}
.hero-domain{margin-top:12px;color:var(--text3);font-size:15px}
.hero-domain b{color:var(--gold)}
.hero-code{display:inline-flex;align-items:center;gap:14px;margin-top:28px;padding:12px 22px;border-radius:12px;background:rgba(255,197,61,.08);border:1px dashed rgba(255,197,61,.5)}
.hero-code-label{color:var(--gold);font-size:14px}
.hero-code-num{font-size:26px;font-weight:800;color:#fff;letter-spacing:4px;font-family:Consolas,monospace}
.hero-actions{margin-top:32px;display:flex;justify-content:center;gap:16px}

/* ---------- 核心卖点 ---------- */
.section-features{background:var(--bg2)}
.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.feature-card{padding:36px 30px;border-radius:16px;background:var(--card);border:1px solid var(--border);text-align:center;transition:all .3s}
.feature-card:hover{transform:translateY(-6px);border-color:var(--cyan);box-shadow:0 14px 34px rgba(0,229,255,.16)}
.feature-icon{width:74px;height:74px;margin:0 auto 20px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--grad);font-size:22px;font-weight:800;color:#fff}
.feature-card h3{font-size:20px;margin-bottom:10px}
.feature-card p{color:var(--text2);font-size:14px}

/* ---------- 流程 ---------- */
.step-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.step-card{position:relative;padding:32px 22px;border-radius:14px;background:var(--card2);border:1px solid var(--border);text-align:center}
.step-num{position:absolute;top:-16px;left:50%;transform:translateX(-50%);width:34px;height:34px;border-radius:50%;background:var(--grad);color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center;box-shadow:0 0 16px rgba(0,229,255,.5)}
.step-title{display:block;font-size:17px;font-weight:700;margin-top:14px;color:var(--cyan)}
.step-desc{margin-top:8px;color:var(--text2);font-size:13px}

/* ---------- 为什么选择 ---------- */
.section-why{background:var(--bg2)}
.why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.why-card{padding:30px 24px;border-radius:14px;background:var(--card);border:1px solid var(--border);text-align:center;transition:all .3s}
.why-card:hover{border-color:var(--purple);box-shadow:0 12px 30px rgba(124,77,255,.2)}
.why-icon{font-size:30px;font-weight:800;color:var(--purple);margin-bottom:12px}
.why-card h3{font-size:18px;margin-bottom:8px}
.why-card p{color:var(--text2);font-size:13px}

/* ---------- 等级 ---------- */
.level-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.level-card{position:relative;padding:40px 26px;border-radius:16px;background:var(--card);border:1px solid var(--border);text-align:center;transition:all .3s}
.level-card:hover{transform:translateY(-6px)}
.level-card-hot{border:1px solid var(--gold);background:linear-gradient(160deg,rgba(255,197,61,.12),var(--card));box-shadow:0 0 30px rgba(255,197,61,.18)}
.level-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--gold);color:#1A1400;font-size:12px;font-weight:700;padding:3px 14px;border-radius:20px}
.level-name{font-size:24px;font-weight:800;color:var(--cyan)}
.level-count{margin:12px 0 4px;font-size:15px;color:var(--text2)}
.level-count b{font-size:32px;color:var(--gold);font-family:Consolas,monospace}
.level-desc{color:var(--text3);font-size:13px}

/* ---------- 商务咨询 ---------- */
.section-contact{padding:60px 0}
.contact-box{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:40px 44px;border-radius:18px;background:linear-gradient(120deg,rgba(124,77,255,.18),rgba(0,229,255,.1));border:1px solid var(--border)}
.contact-title{font-size:26px;font-weight:800;margin-bottom:16px}
.contact-list li{color:var(--text2);margin-bottom:8px}
.contact-list b{color:#fff}
.contact-list a{color:var(--cyan)}
.kf-wechat-text{cursor:pointer;border-bottom:1px dashed var(--cyan)}

/* ---------- 资讯 ---------- */
.section-news{background:var(--bg2)}
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.news-card{display:block;padding:26px 24px;border-radius:14px;background:var(--card);border:1px solid var(--border);transition:all .3s}
.news-card:hover{transform:translateY(-4px);border-color:var(--cyan)}
.news-card h3{font-size:17px;margin-bottom:10px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.news-card p{color:var(--text2);font-size:13px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:12px}
.news-time{color:var(--text3);font-size:12px}

/* ---------- 列表页 ---------- */
.page-banner{padding:48px 0;background:linear-gradient(120deg,rgba(124,77,255,.25),rgba(0,229,255,.12));border-bottom:1px solid var(--border)}
.page-banner-title{font-size:30px;font-weight:800}
.breadcrumb{margin-top:10px;font-size:13px;color:var(--text3)}
.breadcrumb a:hover{color:var(--cyan)}
.page-layout{display:grid;grid-template-columns:1fr 320px;gap:34px;padding:48px 0 70px}
.article-list{display:flex;flex-direction:column;gap:18px}
.article-item{padding:28px 30px;border-radius:14px;background:var(--card);border:1px solid var(--border);transition:all .3s}
.article-item:hover{border-color:var(--cyan);box-shadow:0 10px 26px rgba(0,229,255,.12)}
.article-meta{display:flex;gap:16px;color:var(--text3);font-size:12px;margin-bottom:8px}
.article-title{font-size:20px;font-weight:700;margin-bottom:10px}
.article-title a:hover{color:var(--cyan)}
.article-summary{color:var(--text2);font-size:14px;margin-bottom:14px}
.empty-box{text-align:center;padding:70px 20px;color:var(--text3)}
.empty-box .btn{margin-top:20px}

/* ---------- 分页 ---------- */
.pagination{display:flex;justify-content:center;gap:8px;margin-top:36px;flex-wrap:wrap}
.pagination a,.pagination span{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:38px;padding:0 12px;border-radius:8px;background:var(--card);border:1px solid var(--border);font-size:14px;color:var(--text2);transition:all .2s}
.pagination a:hover{border-color:var(--cyan);color:var(--cyan)}
.pagination .current{background:var(--grad);color:#fff;border-color:transparent}

/* ---------- 详情页 ---------- */
.article-detail{padding:34px 36px;border-radius:16px;background:var(--card);border:1px solid var(--border)}
.article-detail-title{font-size:28px;font-weight:800;line-height:1.5}
.article-detail-meta{display:flex;flex-wrap:wrap;gap:18px;margin:16px 0 22px;padding-bottom:18px;border-bottom:1px solid var(--border);color:var(--text3);font-size:13px}
.article-detail-meta a{color:var(--cyan)}
.article-detail-content{color:var(--text);font-size:15.5px;line-height:2}
.article-detail-content h2,.article-detail-content h3,.article-detail-content h4{margin:22px 0 10px;color:var(--cyan)}
.article-detail-content p{margin:12px 0}
.article-detail-content img{border-radius:10px;margin:10px 0}
.article-detail-content a{color:var(--cyan)}
.article-pn{display:flex;flex-direction:column;gap:8px;margin-top:30px;padding-top:20px;border-top:1px solid var(--border);font-size:14px}
.pn-item span{color:var(--text3)}
.pn-item a{color:var(--cyan)}
.pn-empty{color:var(--text3)}
.related-box{margin-top:26px;padding:28px;border-radius:16px;background:var(--card);border:1px solid var(--border)}
.related-title{font-size:20px;font-weight:700;margin-bottom:18px}
.related-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.related-card{display:block;padding:20px;border-radius:12px;background:var(--card2);border:1px solid var(--border);transition:all .3s}
.related-card:hover{border-color:var(--cyan)}
.related-card h4{font-size:15px;margin-bottom:8px;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.related-card p{color:var(--text2);font-size:13px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:8px}
.detail-cta{margin-top:26px;padding:28px 30px;border-radius:16px;background:linear-gradient(120deg,rgba(255,197,61,.14),rgba(124,77,255,.16));border:1px solid rgba(255,197,61,.4);text-align:center}
.detail-cta-text{font-size:17px;font-weight:600;margin-bottom:16px}
.detail-cta-btns{display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap}
.detail-cta-kf{color:var(--text2);font-size:14px}
.detail-cta-kf b{color:var(--gold)}

/* ---------- 侧边栏 ---------- */
.sidebar{display:flex;flex-direction:column;gap:22px}
.side-card{padding:24px;border-radius:14px;background:var(--card);border:1px solid var(--border)}
.side-title{font-size:17px;font-weight:700;padding-bottom:12px;margin-bottom:14px;border-bottom:1px solid var(--border);position:relative}
.side-title::after{content:"";position:absolute;left:0;bottom:-1px;width:40px;height:2px;background:var(--grad)}
.side-list li{display:flex;align-items:center;gap:10px;padding:8px 0;color:var(--text2);font-size:14px;border-bottom:1px dashed rgba(124,77,255,.12)}
.side-list li:last-child{border-bottom:none}
.side-list a:hover{color:var(--cyan)}
.side-list li.active a{color:var(--cyan);font-weight:600}
.hot-rank{width:22px;height:22px;flex-shrink:0;border-radius:6px;background:var(--card2);color:var(--text3);font-size:12px;display:flex;align-items:center;justify-content:center}
.hot-rank-top{background:var(--grad);color:#fff}
.side-contact p{margin-bottom:8px;color:var(--text2);font-size:14px}
.side-contact b{color:var(--cyan);cursor:pointer;border-bottom:1px dashed var(--cyan)}

/* ---------- 404 ---------- */
.page-404{padding:90px 20px;text-align:center;background:radial-gradient(ellipse at 50% 30%,rgba(124,77,255,.18),transparent 60%)}
.error-code{font-size:120px;font-weight:900;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;line-height:1.2;font-family:Consolas,monospace}
.error-title{font-size:26px;font-weight:800;margin-top:10px}
.error-desc{margin-top:12px;color:var(--text2)}
.error-actions{margin-top:28px;display:flex;justify-content:center;gap:14px}
.error-hot{margin:50px auto 0;max-width:520px;text-align:left;background:var(--card);border:1px solid var(--border);border-radius:14px;padding:24px 28px}
.error-hot h3{font-size:17px;margin-bottom:12px}
.error-hot-list li{padding:7px 0;border-bottom:1px dashed rgba(124,77,255,.12)}
.error-hot-list a{color:var(--text2);font-size:14px}
.error-hot-list a:hover{color:var(--cyan)}

/* ---------- 底部 ---------- */
.site-footer{margin-top:0;background:#070B1F;border-top:1px solid rgba(124,77,255,.25);padding:56px 0 0}
.footer-inner{display:grid;grid-template-columns:2fr 1fr 1fr 1.2fr;gap:34px;padding-bottom:40px}
.footer-logo{font-size:24px;font-weight:800;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.footer-logo sup{font-size:11px;-webkit-text-fill-color:var(--gold)}
.footer-slogan{margin-top:12px;color:var(--text3);font-size:13px;line-height:1.8}
.footer-kf{margin-top:10px;color:var(--text3);font-size:13px}
.footer-kf .kf-wechat-text{cursor:pointer;color:var(--cyan)}
.footer-kf a{color:var(--cyan)}
.footer-col h4{font-size:16px;font-weight:700;margin-bottom:16px;color:var(--text)}
.footer-links li{margin-bottom:10px}
.footer-links a{color:var(--text2);font-size:14px}
.footer-links a:hover{color:var(--cyan)}
.footer-contact-item{color:var(--text3);font-size:13px;margin-bottom:14px}
.footer-bottom{border-top:1px solid rgba(124,77,255,.15);padding:18px 0}
.footer-bottom-inner{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;color:var(--text3);font-size:12.5px}
.footer-bottom a{color:var(--text3)}
.footer-bottom a:hover{color:var(--cyan)}

/* ---------- 移动端快捷栏 ---------- */
.m-quickbar{position:fixed;left:0;right:0;bottom:0;z-index:99;display:none;grid-template-columns:repeat(4,1fr);background:rgba(9,12,32,.96);border-top:1px solid rgba(124,77,255,.3);padding-bottom:env(safe-area-inset-bottom)}
.m-q-item{display:flex;flex-direction:column;align-items:center;gap:4px;padding:9px 4px;color:var(--text2);font-size:11px}
.m-q-icon{font-size:19px;color:var(--cyan)}
.m-q-item:hover{color:var(--cyan)}

/* ---------- 响应式 ---------- */
@media (max-width:992px){
  .header-inner{height:64px}
  .main-nav{display:none;position:absolute;top:64px;left:0;right:0;background:rgba(11,16,38,.98);border-bottom:1px solid var(--border);padding:10px 20px 16px}
  .main-nav.open{display:block}
  .nav-list{flex-direction:column;gap:2px}
  .nav-list li a{padding:11px 12px}
  .header-actions{display:none}
  .hamburger{display:flex}
  .hero{padding:64px 0 70px}
  .hero-title{font-size:30px}
  .feature-grid{grid-template-columns:1fr}
  .why-grid{grid-template-columns:repeat(2,1fr)}
  .step-grid{grid-template-columns:repeat(2,1fr)}
  .level-grid{grid-template-columns:1fr}
  .news-grid{grid-template-columns:1fr}
  .page-layout{grid-template-columns:1fr}
  .sidebar{display:none}
  .contact-box{flex-direction:column;text-align:center;padding:30px 24px}
  .related-grid{grid-template-columns:1fr}
  .footer-inner{grid-template-columns:1fr 1fr}
  .m-quickbar{display:grid}
  .site-footer{padding-bottom:64px}
}
@media (max-width:576px){
  .hero-title{font-size:24px}
  .hero-code{flex-wrap:wrap;justify-content:center}
  .step-grid,.why-grid{grid-template-columns:1fr}
  .section{padding:56px 0}
  .section-title{font-size:24px}
  .footer-inner{grid-template-columns:1fr}
  .topbar-extra{display:none}
  .article-item{padding:20px}
  .article-detail{padding:24px 20px}
  .error-code{font-size:80px}
}

/* ================= 底部横向排版优化（垂直列表改横向排布） ================= */
.site-footer .footer-inner,
.site-footer .footer-main{
    display: flex !important;
    flex-wrap: wrap;
    align-items: flex-start;
    grid-template-columns: none !important;
    gap: 26px 54px;
    padding: 46px 16px 34px;
}
.site-footer .footer-col,
.site-footer .footer-brand{ flex: 1 1 200px; min-width: 170px; }
.site-footer .footer-col.footer-about,
.site-footer .footer-brand{ flex: 1.6 1 300px; }
.site-footer .footer-col h4,
.site-footer .footer-title{ margin-bottom: 14px; }
.site-footer .footer-links{ display: flex; flex-wrap: wrap; gap: 10px 22px; }
.site-footer .footer-links li{ margin: 0 !important; font-size: 13.5px; }
.site-footer .footer-contact-item{ margin-bottom: 10px; }
.site-footer .footer-bottom-inner{ align-items: center; }
@media (max-width: 900px){
    .site-footer .footer-inner,
    .site-footer .footer-main{ gap: 22px 34px; padding: 38px 16px 30px; }
}
@media (max-width: 640px){
    .site-footer .footer-inner,
    .site-footer .footer-main{ flex-direction: column; gap: 22px; padding: 32px 16px 110px; }
    .site-footer .footer-col,
    .site-footer .footer-brand{ flex: 1 1 auto; min-width: 0; width: 100%; }
    .site-footer .footer-links{ gap: 8px 18px; }
}


/* ================= 界面留白与资讯模块优化（20260910） ================= */
/* 1) 桌面端侧栏跟随滚动：消除资讯页右侧半屏空白 */
@media (min-width: 901px){
    .page-layout{ align-items: flex-start; }
    .page-layout .sidebar{ position: sticky; top: 92px; align-self: flex-start; }
}
/* 2) 首页板块间距收紧，减少资讯板块下方多余留白 */
.section{ padding: 52px 0; }
.section-head{ margin-bottom: 34px; }
.section-news{ padding-top: 46px; padding-bottom: 34px; }
/* 3) 资讯列表更紧凑 */
.article-list{ gap: 16px; }
.page-layout{ padding-top: 28px; padding-bottom: 40px; }
/* 4) 侧栏卡片间距收紧 */
.sidebar{ gap: 18px; }
.side-card{ padding: 18px 20px; }
/* 5) 侧栏快捷入口卡片 */
.side-card.side-links .side-btns{ display: flex; flex-direction: column; gap: 10px; margin-top: 14px; }
.side-card.side-links .side-btn{
    display: block; text-align: center; padding: 11px 14px; border-radius: 8px;
    background: #1a6fd6; color: #fff !important; font-weight: 700; font-size: 14px;
    transition: filter .18s ease, transform .18s ease;
}
.side-card.side-links .side-btn:hover{ filter: brightness(1.08); transform: translateY(-1px); }
.side-card.side-links .side-btn.side-btn-ghost{
    background: #fff; color: #1a6fd6 !important; border: 1px solid #1a6fd6;
}
/* 6) 移动端微调 */
@media (max-width: 900px){
    .section{ padding: 40px 0; }
    .section-news{ padding-bottom: 26px; }
}


/* ============ 侧栏留白加固（20260910-2） ============ */
@media (min-width: 901px){
    .page-layout{ align-items: flex-start !important; }
    aside.sidebar{
        align-self: flex-start !important;
        height: auto !important;
        max-height: none !important;
        position: sticky !important;
        top: 92px;
    }
}
.section-news{ padding-bottom: 20px; }
@media (max-width: 900px){
    .section-news{ padding-bottom: 18px; }
}


/* ================= 移动端快捷栏 + 首页快捷入口 + 底部可读性（20260911） ================= */
/* 1) 首页快捷入口区块：桌面 4 列 / 手机 2 列 */
.section-quick{padding-top:36px}
.hq-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.hq-card{display:flex;align-items:center;gap:12px;padding:16px 18px;background:var(--card);border:1px solid var(--border);border-left:4px solid var(--cyan);border-radius:14px;transition:all .25s ease}
.hq-card:hover{transform:translateY(-3px);box-shadow:0 10px 26px rgba(0,229,255,.12)}
.hq-card .hq-ico{font-size:20px;line-height:1;color:var(--cyan)}
.hq-card .hq-txt b{display:block;font-size:15px;font-weight:700;color:var(--text)}
.hq-card .hq-txt small{display:block;margin-top:2px;font-size:12px;color:var(--text2)}
@media (max-width:900px){
  .hq-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .hq-card{padding:13px 14px;gap:10px}
  .hq-card .hq-ico{font-size:17px}
  .hq-card .hq-txt b{font-size:14px}
  .hq-card .hq-txt small{display:none}
}
/* 3) 手机端节奏收紧 */
@media (max-width:900px){
  .section{padding:34px 0}
  .section-head{margin-bottom:24px}
  .hero{padding-top:48px;padding-bottom:52px}
}