/* =========================================================
   responsive.css — 响应式(桌面优先;移动端为简化可用版)
   ========================================================= */

/* ---- 小桌面 / 横板平板 ---- */
@media (max-width: 1180px) {
  .rail { display: none; }
  .nav__links { gap: var(--space-sm); }
}

/* ---- 平板及以下:解除 pinned,恢复文档流 ---- */
@media (max-width: 960px) {
  .nav__links { display: none; }
  .nav__menu-btn { display: inline-flex; }
  .nav__cta { margin-left: 8px; }
  .nav__inner { height: 60px; }
  .hero__inner { padding-top: 80px; }

  .ov__grid, .ab__grid { grid-template-columns: 1fr; gap: var(--space-md); }
  .ov__side {
    border-right: 0;
    border-bottom: 1px solid var(--color-line-faint);
    padding: 0 0 var(--space-sm);
    min-height: 0;
    flex-direction: row;
    align-items: flex-end;
  }
  .ov__id { width: 132px; }
  .vtext { writing-mode: horizontal-tb; letter-spacing: .3em; }

  .ov__facts { grid-template-columns: 1fr; }
  .ov__fact { border-left: 0; border-top: 1px solid var(--color-line-faint); }
  .ov__fact:first-child { border-top: 0; }

  /* 经历 featured 与能力大字目录在窄屏改为纵向 */
  .xp__featured { grid-template-columns: 1fr; gap: var(--space-sm); }
  .xp__featured .xp__when, .xp__f-title { grid-column: 1; }
  .xp__f-metrics { grid-template-columns: repeat(2, 1fr); }
  .xp__metric { border-left: 0; padding-left: 0; }
  .xp__metric:nth-child(even) { padding-left: var(--space-sm); border-left: 1px solid var(--color-line-faint); }
  .xp__metric:nth-child(n+3) { border-top: 1px solid var(--color-line-faint); }
  .xp__phase { grid-template-columns: 1fr; gap: 4px; }
  .xp__verdict { grid-template-columns: 1fr; gap: 8px; }

  .cap__row { grid-template-columns: 1fr; gap: var(--space-2xs); }
  .cap__side { text-align: left; }
  .cap__name { font-size: 30px; }
  .cap__name::before { display: none; }
  .cap__row:hover .cap__name { transform: none; }

  .marquee { padding-block: 18px; }
  .marquee__seq span { font-size: 14px; padding-inline: 22px; }

  /* 横向展柜退化为原生横向滑动(覆盖 .js 的 pinned 态) */
  .js .work__viewport { height: auto; display: block; padding-block: var(--space-md); }
  .js .work__track {
    overflow-x: auto;
    transform: none !important;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    padding-bottom: var(--space-md);
  }
  .work__panel { width: 86vw; grid-template-columns: 1fr; scroll-snap-align: center; }
  .work__progress { display: none; }
  .work__endcap { width: 70vw; }

  .exp__row { grid-template-columns: 1fr; gap: var(--space-sm); }
  .exp__period { margin-left: 0; }

  .ph__row, .ph__row--alt { width: 100%; }
  .ph__row .ph__frame { flex: 1 1 46%; }

  .xp__row { grid-template-columns: 1fr; gap: var(--space-2xs); }

  .hero__meta { flex-direction: column; gap: 8px; align-items: flex-start; }
  .hero__blink { display: none; }
}

/* ---- 手机 ---- */
@media (max-width: 560px) {
  :root { --gutter: 20px; }
  .sec-head { flex-wrap: wrap; row-gap: 4px; }
  .sec-head__note { display: none; }
  .work__panel { width: 92vw; }

  /* 导航收紧:隐藏英文副标,防换行 */
  .nav__brand-en { display: none; }
  .nav__brand-zh { font-size: 16px; white-space: nowrap; }
  .nav__cta { white-space: nowrap; padding: 8px 14px; }

  /* 摄影改单列全幅,手机上图片才有存在感 */
  .ph__row, .ph__row--alt { flex-direction: column; width: 100%; gap: 0; }
  .ph__row .ph__frame:first-child,
  .ph__row .ph__frame:last-child,
  .ph__row--alt .ph__frame:first-child,
  .ph__row--alt .ph__frame:last-child { flex: none; width: 100%; }
}