/* ═══════════════════════════════════════════════════════════
   SUMMON MECHA — responsive.css
   断点：1440 / 1280 / 1024 / 900 / 720 / 520
   设计基准：1920×1080 桌面，向下自适应至移动端
   ═══════════════════════════════════════════════════════════ */

section[id], .carousel{ scroll-margin-top:100px; }

/* ---------- ≤1440：收紧版心 ---------- */
@media (max-width:1440px){
  :root{ --wrap:1280px; }
}

/* ---------- ≤1280 ---------- */
@media (max-width:1280px){
  :root{ --wrap:1180px; --pad:clamp(20px,3.4vw,52px); }
  .nav__menu{ gap:22px; }
  .nav__menu a{ font-size:13.5px; }
}

/* ---------- ≤1024：移动端导航 + Hero 单列 ---------- */
@media (max-width:1024px){
  :root{ --sec-y:clamp(72px,9vh,120px); }

  .nav__inner{ height:72px; gap:16px; }
  .nav.is-stuck .nav__inner{ height:62px; }

  .burger{ display:block; }

  .nav__menu{
    position:fixed;
    top:0; left:0; right:0;
    z-index:-1;
    margin-left:0;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    padding:104px var(--pad) 34px;
    background:rgba(255,255,255,.985);
    backdrop-filter:blur(26px) saturate(150%);
    -webkit-backdrop-filter:blur(26px) saturate(150%);
    border-bottom:1px solid var(--hair);
    box-shadow:0 40px 90px -34px rgba(16,24,40,.22);
    transform:translateY(-102%);
    opacity:0;
    visibility:hidden;
    transition:transform .62s var(--e-out), opacity .42s var(--e-out), visibility .42s;
  }
  .nav.is-menu .nav__menu{ transform:none; opacity:1; visibility:visible; }
  .nav__menu a{
    font-size:19px;
    font-weight:500;
    padding:17px 0;
    width:100%;
    border-bottom:1px solid var(--hair);
    color:var(--fg-2);
  }
  .nav__menu a::after{ display:none; }
  .nav__menu a.is-current{ color:var(--blue); }
  .nav__menu::after{
    content:"SUMMON MECHA — GLOBAL ROBOT DEPLOYMENT PLATFORM";
    display:block;
    margin-top:26px;
    font-family:var(--mono);
    font-size:9.5px;
    letter-spacing:.2em;
    color:var(--fg-4);
  }

  .hero{ padding-top:112px; padding-bottom:42px; min-height:auto; }
  /* 移动端不加载视频，只用静态大图 */
  .hero__video{ display:none; }
  .hero__copy{ max-width:none; }
  .hero__grade{
    background:
      linear-gradient(180deg, rgba(255,255,255,.90) 0%, rgba(255,255,255,.74) 30%, rgba(255,255,255,.86) 64%, rgba(255,255,255,.97) 100%);
  }
  .hero__glow{ right:-30vw; top:-8vw; }
  .hero__foot{ padding-top:30px; }
  .hero__marks{ display:none; }
  .hero__line{ max-width:none; }

  .head{ margin-bottom:clamp(34px,5vw,58px); }
  .head--split{ grid-template-columns:minmax(0,1fr); align-items:start; gap:22px; }
  .head--split .lead{ padding-bottom:0; }

  .pgrid{ grid-template-columns:minmax(0,1fr); }
  .footer__top{ grid-template-columns:minmax(0,1fr); gap:44px; }
}

/* ---------- ≤900 ---------- */
@media (max-width:900px){
  .console__examples{ justify-content:flex-start; }

  .stats{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .stat{ border-bottom:1px solid var(--hair); }
  .stat:nth-child(2n){ border-right:0; }
  .stat:nth-last-child(-n+2){ border-bottom:0; }

  .band__in{ max-width:none; }
}

/* ---------- ≤720 ---------- */
@media (max-width:720px){
  :root{ --pad:20px; --r-xl:22px; --r-lg:18px; }

  body{ font-size:15px; }

  .hero{ padding-top:100px; }
  .hero__title{ font-size:clamp(38px, 10.5vw, 60px); margin-bottom:24px; }
  html[data-lang="en"] .hero__title{ font-size:clamp(34px, 9.4vw, 54px); }
  .hero__sub{ font-size:15px; margin-bottom:28px; }
  .console__steps{ margin-left:0; }
  .scenes__list{ gap:7px; }
  .chip{ padding:8px 14px; font-size:12px; }

  /* 轮播：窄屏卡宽收窄，露出下一张边缘暗示可滑 */
  .carousel__track{ grid-auto-columns:min(78vw, 320px); }

  .h2{ font-size:clamp(28px,8.2vw,42px); }
  .band__lead{ font-size:clamp(23px,7vw,34px); }

  /* 首屏结果面板：窄屏下 4 列每格已不足 90px，降为 2 列 */
  .result--hero .result__grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .result--hero .rcell:nth-child(2n){ border-right:0; }
  .result--hero .rcell:nth-last-child(-n+2){ border-bottom:0; }

  .mapbox{ padding:16px 12px 14px; }
  .mapbox__legend{ gap:8px 16px; }
  .lg{ font-size:9.5px; }
  /* 世界地图等比缩到 37%（960 单位 → 360px 屏），9.5px 的城市标签只剩 3.5px，
     不如不显示；改由下方的文字行列城市。脉冲光环同级缩成噪点，一并去掉 */
  .wm-label{ display:none; }
  .wm-hub-halo{ display:none; }
  .mapbox__cities{ display:block; }

  .stats{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .stat{ padding:24px 16px; }

  .pcard{ padding:26px 22px; }
  .pcard h3{ max-width:none; }

  .footer__cols{ grid-template-columns:repeat(2, minmax(0,1fr)); gap:26px 20px; }
  .footer__bottom{ flex-direction:column; align-items:flex-start; gap:10px; }

  .modal{ padding:12px; }
  .modal__panel{ padding:24px 20px; border-radius:20px; }
  .form__row{ grid-template-columns:minmax(0,1fr); }
  .form__foot{ flex-direction:column-reverse; }
  .form__foot .btn{ width:100%; }

  .toast{ bottom:20px; padding:13px 20px; font-size:12.5px; }
}

/* ---------- ≤520 ---------- */
@media (max-width:520px){
  .brand__cn{ display:none; }
  .nav__cta{ display:none; }
  .lang{ padding:5px 10px; }
  .hero__hint{ display:none; }
  .console__field{ padding:11px 14px; flex-wrap:wrap; gap:10px 12px; }
  /* 提交按钮独占一行：中文「生成机器人方案」+ 图标在 320px 宽的行里塞不下 */
  .console__field .btn{ flex:1 1 100%; justify-content:center; }
  .console__foot{ padding:0 14px 12px; }
  .console__bar{ padding:10px 14px; font-size:9.5px; }
  .console__title{ display:none; }
  .stats{ grid-template-columns:minmax(0,1fr); }
  .stat{ border-right:0 !important; border-bottom:1px solid var(--hair) !important; }
  .stat:last-child{ border-bottom:0 !important; }
  .footer__cols{ grid-template-columns:minmax(0,1fr); }
}

/* ---------- ≤400：极窄屏 ---------- */
@media (max-width:400px){
  .result--hero .result__grid{ grid-template-columns:minmax(0,1fr); }
  .result--hero .rcell{ border-right:0; border-bottom:1px solid var(--hair); }
  .result--hero .rcell:last-child{ border-bottom:0; }
  .hero__title{ font-size:clamp(32px,9.6vw,44px); }
  html[data-lang="en"] .hero__title{ font-size:clamp(28px,8.4vw,38px); }
}

/* ---------- 横屏 / 矮屏 ---------- */
/* ---------- 横屏 / 矮屏 ----------
   这一档垂直空间最紧：原先的 CTA（~110px）被 250px 的提问条取代后必须大幅降级，
   否则会把场景 chips 挤出视口。这里把提问条压到只剩输入行、并整体收字号。 */
@media (max-height:680px) and (min-width:1025px){
  .hero{ padding-top:100px; padding-bottom:28px; }
  .hero__title{ font-size:clamp(34px,4.4vw,64px); margin-bottom:20px; }
  .hero__sub{ font-size:15px; margin-bottom:18px; }
  .console__bar{ display:none; }
  .console__label{ display:none; }
  .console__foot{ display:none; }
  .console__field{ padding:12px 18px; }
  .scenes{ margin-top:16px; }
  .scenes__label{ display:none; }
  .result--hero .result__note{ display:none; }
}

/* ---------- 打印 ---------- */
@media print{
  .nav,.grain,.progress,.toast,.modal,.hero__bg{ display:none !important; }
  /* 首屏的交互件不印在纸上；已生成的结果保留（未生成的仍不占位） */
  .console--hero{ display:none !important; }
  .result--hero.is-shown{ display:block !important; margin-top:0; }
  body{ background:#fff; color:#000; }
  .sec,.band{ padding-block:24px; border-color:#ddd; }
}

/* ---------- 省流 / 减弱动效：不播视频，轮播也停在当前场景 ---------- */
@media (prefers-reduced-motion:reduce), (prefers-reduced-data:reduce){
  .hero__video{ display:none; }
  .hero__sweep{ display:none; }
  .scenes__prog{ display:none; }
}
