/* ==========================================================================
   2026-10-23 · 首页大屏布局层（1080p 优先）
   只做布局与排版，不改配色（配色仍由 style.css / theme-light.css 决定）。

   要解决的问题（1920×1080 实测）：
   1) 容器 1200px，两侧各留 360px 空白，首屏显得又窄又空；
   2) 首屏内容没有占满视口，数据条被挤到折叠线以下，一屏讲不完"是什么/多少数据"；
   3) 两枚浮动数据卡挤在面板右上角，与控制台顶边打架；
   4) 导航贴着右侧按钮，中间空一大段，视线没有落点。
   ========================================================================== */

/* 容器随屏宽分档：1080p 用 1440，2K 以上不再无限拉宽 */
@media (min-width: 1600px) { :root { --maxw: 1440px; } }
@media (min-width: 1400px) and (max-width: 1599px) { :root { --maxw: 1320px; } }

@media (min-width: 1024px) {
  /* ---------- 顶栏：菜单居中，左右各一个锚点 ---------- */
  .header__inner { height: 76px; gap: 24px; }
  .nav { margin: 0 auto; }
  .header__act { gap: 12px; }

  /* ---------- 首屏：占满一屏，数据条压底 ---------- */
  .hero {
    display: flex;
    flex-direction: column;
    min-height: calc(100vh - 76px);
    padding-top: 0;
  }
  .hero__inner {
    flex: 1 1 auto;
    align-items: center;
    gap: 64px;
    padding: 34px 0 12px;
  }
  .hero__title {
    font-size: clamp(36px, 3.05vw, 58px);
    line-height: 1.14;
    letter-spacing: -.03em;
    margin: 24px 0 22px;
    text-wrap: balance;
  }
  .hero__sub { font-size: 17px; line-height: 1.78; max-width: 640px; }
  .hero__ticks { gap: 12px 30px; margin: 28px 0 32px; }
  .hero__ticks li { font-size: 15px; }
  .hero__cta { gap: 16px; }
  .hero__cta .btn--lg { --bh: 54px; padding: 0 34px; }
  .hero__meta { margin-top: 34px; }

  /* ---------- 控制台：浮标改为压在面板两角 ---------- */
  .hero__panel { align-self: center; }
  .panel__chips {
    position: absolute; inset: 0; z-index: 2;
    margin: 0; padding: 0; pointer-events: none;
  }
  .float-card { position: absolute; pointer-events: auto; padding: 12px 18px; }
  .float-card b { font-size: 20px; }
  .float-card--a { left: -26px; top: -26px; }
  /* 浮标占了标题位，把窗口标题让出来，避免文字被盖住 */
  .console__title { visibility: hidden; }
  .float-card--b { right: -12px; bottom: 54px; }

  /* ---------- 数据条：贴底、收窄留白 ---------- */
  /* 注意：.stats 同时是 .shell（靠 margin:0 auto 居中），这里必须保留水平 auto，
     否则整条数据会贴到屏幕左边、与上方 hero 错位（2026-10-23 修） */
  .hero .stats { margin: 0 auto 30px; padding: 24px 24px 20px; gap: 18px; }
  .stat b { font-size: clamp(30px, 2.4vw, 42px); }
  .stats__note { padding-top: 12px; margin-top: 2px; }

  /* ---------- 区块节奏：1080p 下 104px 偏空，收到 88 ---------- */
  .section { padding: 88px 0; }
  .sec-head { margin-bottom: 44px; }
}

/* 超宽屏再补一点呼吸感 */
@media (min-width: 1920px) {
  .hero__inner { gap: 76px; }
  .hero__sub { max-width: 660px; }
  .console__main { padding: 20px; }
}

/* 窄屏恢复原布局（浮标回到文档流） */
@media (max-width: 1023px) {
  .panel__chips { position: static; margin-bottom: 18px; padding-left: 4px; }
  .float-card { position: static; }
}