@charset "utf-8";
/* ==========================================================================
   中国168福彩 - 响应式适配 (responsive.css)
   断点：1280 / 1080 / 900 / 720 / 560
   ========================================================================== */

/* ============================ ≤1280px ============================ */
@media (max-width: 1280px) {
  .wrap, .wrap-wide { padding: 0 16px; }
  .hero h1 { font-size: var(--fs-40); }
  .footer-main .grid { grid-template-columns: 1.4fr 1fr 1fr 1.2fr; }
  .footer-main .grid > .footer-col:last-child { grid-column: span 1; }
  .footer-main .footer-qr img { width: 96px; height: 96px; }
}

/* ============================ ≤1080px ============================ */
@media (max-width: 1080px) {
  /* 导航收起，使用汉堡菜单 */
  .nav { display: none; }
  .burger { display: grid; }
  .mobile-nav { display: block; }
  .header-search { display: none; }

  /* 栅格降列 */
  .grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grid-5 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .grid-6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

  /* 主内容 + 侧栏改为上下结构 */
  .layout, .layout-left { grid-template-columns: minmax(0, 1fr); }
  .sidebar, .article-side { position: static; }

  /* 首页首屏 */
  .hero-inner { grid-template-columns: minmax(0, 1fr); gap: 34px; padding-top: 52px; padding-bottom: 56px; }
  .hero-panel { max-width: 520px; }
  .hero-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hero-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hero-strip li { border-bottom: 1px solid rgba(255, 255, 255, .08); }
  .hero-strip li:nth-child(3), .hero-strip li:nth-child(4) { border-bottom: 0; }

  /* 首页模块 */
  .hot-list { grid-template-columns: minmax(0, 1fr); }
  .predict-explain { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .pe-actions { flex-direction: row; flex-wrap: wrap; }
  .pe-actions .btn { flex: 1; min-width: 160px; }
  .sec-head.is-flex { flex-direction: column; align-items: flex-start; gap: 14px; }
  .news-layout { grid-template-columns: minmax(0, 1fr); }
  .flow-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .rolling-box { flex-direction: column; align-items: flex-start; gap: 14px; }
  .rolling-label { border-right: 0; border-bottom: 1px solid var(--c-line); padding: 0 0 10px; width: 100%; }
  .rolling-list { grid-template-columns: minmax(0, 1fr); }

  /* 竞猜列表页 */
  .jc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .filter-row-last { flex-direction: column; align-items: stretch; }
  .jc-sort { width: 100%; }
  .query-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .query-form .btn { grid-column: span 2; }

  /* 开奖查询页 */
  .latest-draw { grid-template-columns: minmax(0, 1fr); gap: 20px; }

  /* 资讯 */
  .news-top { grid-template-columns: minmax(0, 1fr); }
  .news-top-media { min-height: 240px; aspect-ratio: 16 / 9; }
  .news-item { grid-template-columns: 240px minmax(0, 1fr); }
  .article-layout { grid-template-columns: minmax(0, 1fr); }
  .article-card { padding: 26px 24px; }

  /* 关于我们 */
  .about-intro { grid-template-columns: minmax(0, 1fr); gap: 26px; }
  .about-stats, .team-grid, .contact-grid, .value-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-main .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-stats .grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .footer-stats .item { padding: 20px 12px; }
  .footer-stats .num { font-size: var(--fs-24); }
}

/* ============================ ≤900px ============================ */
@media (max-width: 900px) {
  .sec { padding: 48px 0; }
  .sec-lg { padding: 56px 0; }
  .sec-head h2, .about-intro h2 { font-size: var(--fs-28); }
  .page-hero h1, .hero h1 { font-size: var(--fs-28); }
  .article-hero h1 { font-size: var(--fs-24); }
  .sec-head-flex h2 { font-size: var(--fs-20); }

  .grid-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .adv-grid, .game-grid, .guide-grid, .edit-grid, .related-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .predict-explain { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .data-grid { gap: 0; }
  .data-cell { padding: 16px 18px; }
  .data-cell b { font-size: var(--fs-28); }

  .art-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .art-nav { grid-template-columns: minmax(0, 1fr); }
  .art-nav .next { text-align: left; }

  .footer-main .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px; }
}

/* ============================ ≤720px ============================ */
@media (max-width: 720px) {
  :root { --header-h: 64px; }

  .topbar { font-size: 11px; line-height: 30px; }
  .topbar .marquee { display: none; }
  .topbar-right { display: none; }
  .topbar .wrap-wide { justify-content: center; }

  .logo-mark { width: 40px; height: 40px; }
  .logo-text .cn { font-size: var(--fs-16); }
  .logo-text .en { font-size: 9px; letter-spacing: 1.6px; }
  .header-tel { display: none; }

  .hero-inner { padding-top: 40px; padding-bottom: 44px; }
  .hero h1 { font-size: var(--fs-24); letter-spacing: -.6px; }
  .hero-desc { font-size: var(--fs-14); }
  .hero-btns .btn { flex: 1; min-width: 140px; }
  .hero-metrics { gap: 14px; }
  .hero-metrics b { font-size: var(--fs-24); }
  .hero-strip { grid-template-columns: minmax(0, 1fr); }
  .hero-strip li { border-right: 0; border-bottom: 1px solid rgba(255, 255, 255, .08); padding: 14px 18px; }
  .hero-strip li:last-child { border-bottom: 0; }

  .grid-2, .grid-3, .grid-4, .grid-5, .grid-6 { grid-template-columns: minmax(0, 1fr); }
  .predict-grid { grid-template-columns: minmax(0, 1fr); }
  .pc-desc { min-height: 0; }
  .adv-grid, .game-grid, .guide-grid, .edit-grid, .related-grid,
  .jc-grid, .fb-grid, .about-stats, .team-grid, .contact-grid,
  .value-grid, .step-grid, .rec-grid { grid-template-columns: minmax(0, 1fr); }

  .sec-head h2 { font-size: var(--fs-24); }
  .sec-head .sec-sub { font-size: var(--fs-13); }

  /* 开奖模块 */
  .live-body { flex-direction: column; align-items: flex-start; gap: 18px; }
  .live-balls { gap: 8px; }
  .draw-table-head { display: none; }
  .draw-list li.draw-row {
    grid-template-columns: minmax(0, 1fr); gap: 8px;
    padding: 14px; border: 1px solid var(--c-line); border-radius: var(--r-sm); margin-bottom: 10px;
  }
  .draw-issue { display: flex; align-items: center; justify-content: space-between; }
  .draw-sum { justify-content: flex-start; }

  /* 竞猜卡片 */
  .hot-item { flex-direction: column; }
  .hot-thumb { width: 100%; height: 160px; }
  .filter-lb { width: 100%; padding-top: 0; }
  .filter-row { flex-direction: column; gap: 8px; }
  .jc-search { flex-direction: column; min-width: 0; }
  .query-form { grid-template-columns: minmax(0, 1fr); }
  .query-form .btn { grid-column: span 1; }

  .table-wrap { margin: 0 -16px; border-radius: 0; }
  .data-table { min-width: 640px; }
  .data-table thead th, .data-table tbody td, .data-table tbody th { padding: 11px 12px; font-size: var(--fs-13); }

  /* 资讯 */
  .news-top-body { padding: 22px 20px; }
  .news-top-body h2 { font-size: var(--fs-20); }
  .news-item { grid-template-columns: minmax(0, 1fr); }
  .ni-media { min-height: 0; aspect-ratio: 16 / 9; }
  .ni-body { padding: 16px 18px; }
  .article-card { padding: 20px 16px; }
  .article-body { font-size: 15px; line-height: 1.95; }
  .article-body h2 { font-size: var(--fs-20); margin-top: 30px; }
  .article-body h3 { font-size: var(--fs-16); }
  .art-facts { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .art-tools { flex-direction: column; align-items: flex-start; }
  .article-hero { padding: 32px 0 28px; }

  /* 页脚 */
  .footer-stats .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-stats .item:nth-child(2) { border-right: 0; }
  .footer-stats .item { border-bottom: 1px solid rgba(255, 255, 255, .07); }
  .footer-main .grid { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .footer-main { padding: 36px 0 24px; }
  .footer-bottom .wrap-wide { flex-direction: column; align-items: flex-start; gap: 10px; }

  /* 悬浮工具 */
  .float-tools { right: 12px; bottom: 70px; gap: 8px; }
  .float-tools a, .float-tools button { width: 40px; height: 40px; }
  .float-tools svg { width: 17px; height: 17px; }
  .float-tools .tip { display: none; }
  .qr-pop { right: 60px; bottom: 70px; width: 150px; }
  .qr-pop img { width: 122px; height: 122px; }

  /* 通用 */
  .pager a, .pager span { min-width: 34px; height: 34px; padding: 0 8px; font-size: var(--fs-13); }
  .crumb { min-height: 44px; font-size: var(--fs-12); }
  .cta-inner { flex-direction: column; align-items: flex-start; }
  .cta-copy h2 { font-size: var(--fs-20); }
  .page-hero { padding: 38px 0 40px; }
  .page-hero .hero-stats { gap: 20px; }
  .page-hero .hero-stats .num { font-size: var(--fs-24); }
}

/* ============================ ≤560px ============================ */
@media (max-width: 560px) {
  .wrap, .wrap-wide { padding: 0 12px; }
  .hero-panel { padding: 20px 18px; }
  .hero-balls { gap: 8px; }
  .hero-panel-info li { font-size: var(--fs-13); }
  .ball-lg { width: 40px; height: 40px; font-size: var(--fs-20); }
  .trend-bars { height: 128px; }
  .sec-head h2 { letter-spacing: -.3px; }
  .filter-tabs { gap: 6px; }
  .chip { height: 30px; padding: 0 12px; font-size: var(--fs-12); }
  .btn { height: 42px; padding: 0 20px; font-size: var(--fs-14); }
  .btn-lg { height: 48px; padding: 0 26px; font-size: var(--fs-15); }
  .faq-item summary { font-size: var(--fs-15); padding: 16px 46px 16px 16px; }
  .faq-body { padding: 0 16px 16px; }
  .table-wrap { margin: 0 -12px; }
}
