/* ============================================================
   顶尖发卡平台 - 响应式样式
   ============================================================ */

/* 大屏 */
@media (min-width: 1700px) {
  .container { width: min(1560px, 94%); }
  .hero h1 { font-size: 62px; }
  .hero-inner { padding: 110px 0 120px; }
  .section { padding: 74px 0; }
  .section-head h2 { font-size: 38px; }
}

/* 平板 */
@media (max-width: 1100px) {
  .cats-grid { grid-template-columns: repeat(3, 1fr); }
  .tech-grid { grid-template-columns: repeat(2, 1fr); }
  .goods-grid { grid-template-columns: repeat(3, 1fr); }
  .hero-inner { grid-template-columns: 1fr; gap: 44px; padding: 64px 0 72px; }
  .hero h1 { font-size: 42px; }
  .mvv-grid { grid-template-columns: repeat(2, 1fr); }
  .steps-grid { grid-template-columns: 1fr; }
  .report-layout { grid-template-columns: 1fr; }
  .about-intro { grid-template-columns: 1fr; }
  .footer-top { grid-template-columns: 1fr 1fr; gap: 32px; }
  .footer-brand { grid-column: 1 / -1; }
  .adv-grid { grid-template-columns: 1fr; }
  .biz-inner { grid-template-columns: 1fr; }
}

/* 手机 */
@media (max-width: 760px) {
  .nav-toggle { display: flex; }
  .header-actions .btn-ghost { display: none; }
  .main-nav {
    position: fixed; inset: 74px 0 auto 0; background: #fff;
    flex-direction: column; align-items: stretch; padding: 18px 22px 26px;
    border-bottom: 1px solid var(--line); box-shadow: var(--shadow-lg);
    display: none; z-index: 99; gap: 6px;
  }
  .main-nav.open { display: flex; }
  .main-nav a { padding: 13px 16px; font-size: 16px; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .stat-card { padding: 18px 16px; gap: 12px; }
  .stat-icon { width: 44px; height: 44px; border-radius: 12px; }
  .stat-icon svg { width: 22px; height: 22px; }
  .stat-num { font-size: 24px; }
  .hero h1 { font-size: 32px; }
  .hero-cta .btn { flex: 1; min-width: 44px; }
  .cats-grid { grid-template-columns: repeat(2, 1fr); }
  .mvv-grid, .tech-grid, .qual-grid { grid-template-columns: 1fr; }
  .goods-grid { grid-template-columns: repeat(2, 1fr); }
  .result-body { grid-template-columns: 1fr; }
  .section { padding: 58px 0; }
  .section-head h2, .join-copy h2, .coverage-copy h2 { font-size: 27px; }
  .page-hero h1 { font-size: 28px; }
  .footer-top { grid-template-columns: 1fr 1fr; gap: 26px; }
  .channel-grid { grid-template-columns: 1fr; }
  .join-actions { width: 100%; }
  .join-actions .btn { flex: 1; }
  .goods-toolbar { flex-direction: column; align-items: stretch; }
  .goods-search { max-width: none; }
  .svc-banner-inner { padding: 36px 28px; }
  .coverage-inner { flex-direction: column; align-items: flex-start; }
  .coverage-nums { gap: 28px; }
  .auth-card { display: block; width: min(440px, 100%); }
  .auth-media { display: none; }
  .auth-panel { padding: 32px 24px; }
  .age-hero { padding: 36px 22px; }
  .age-hero-inner { flex-direction: column; align-items: flex-start; gap: 28px; }
  .age-hero-nums { gap: 10px; width: 100%; }
  .age-hero-cell { padding: 16px 20px; min-width: 92px; }
  .age-hero-cell b { font-size: 38px; }
  .age-hero-dot { font-size: 24px; }
  .qual-grid { grid-template-columns: 1fr; }
  .split-grid { grid-template-columns: 1fr; }
  .split-flow { gap: 10px; }
  .partners { padding: 44px 0; }
}

/* 小屏手机 */
@media (max-width: 480px) {
  .footer-top { gap: 20px; padding: 40px 0 30px; grid-template-columns: 1fr; }
  .footer-col h5 { margin-bottom: 13px; }
  .corp-grid { font-size: 12px; gap: 10px 16px; }
  .corp-copy { font-size: 11.5px; line-height: 1.7; }
  .footer-brand p { font-size: 13px; }
  .footer-col li, .footer-col a { font-size: 13px; }
  .hero-meta { gap: 14px; font-size: 13px; }
  .demo-body { padding: 16px; }
  .goods-grid { grid-template-columns: 1fr; }
  .cats-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .cat-card { padding: 22px 12px; }
  .cat-card .cat-icon { width: 52px; height: 52px; font-size: 24px; }
  .stats { margin-top: -36px; }
  .stat-card { padding: 16px 14px; gap: 10px; }
  .stat-icon { width: 40px; height: 40px; }
  .stat-icon svg { width: 20px; height: 20px; }
  .stat-num { font-size: 20px; }
  .stat-label { font-size: 12px; }
  .age-hero-cell b { font-size: 32px; }
  .age-hero-cell { padding: 14px 14px; min-width: 76px; }
  .age-hero-nums { gap: 6px; }
  .age-hero-dot { font-size: 20px; }
  .age-hero-title { font-size: 26px; }
}
