/* Mobile-only refinement. Desktop rules intentionally remain untouched. */
@media screen and (max-width: 767px) {
  :root { --t-2: #b8bdb9; --t-3: #a4ada6; }
  html { scroll-padding-top: 20px; -webkit-text-size-adjust: 100%; }
  body { line-height: 1.8; }
  a, button, input, select, textarea { -webkit-tap-highlight-color: #ff675233; }
  a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
    outline: 2px solid #ff947f; outline-offset: 4px;
  }
  ::selection { background: #8c252b; color: #fff; }
  .top .nav, .nav, .ovl-top { height: 68px; padding: 0 20px; gap: 12px; }
  .top .logo .t, .logo .t, .ovl-top .logo .t { font-size: 15px; letter-spacing: .04em; }
  .top .logo img, .logo img, .ovl-top .logo img { width: 27px; height: 27px; }
  .top .nav-right, .nav-right { gap: 4px; }
  .nav-burger, .top .search, .nav-ico, .ovl-x { width: 44px; height: 44px; flex-shrink: 0; }
  .nav-burger { display: flex; align-items: center; }
  .nav-cta { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 8px 14px; }
  .phero, .ab-hero { height: 310px; min-height: 0; }
  .pside, .ab-side { left: 20px; right: 20px; top: 102px; }
  .pside .pt, .ab-side .pt { font-size: 26px; line-height: 1.35; margin-bottom: 10px; }
  .pside .pcur, .ab-side .pcur { margin: 0 0 18px; font-size: 16px; letter-spacing: .03em; }
  .pside nav, .ab-side nav { flex-direction: row; flex-wrap: wrap; gap: 0 20px; }
  .pside nav a, .ab-side nav a { min-height: 44px; display: inline-flex; align-items: center; font-size: 14px; line-height: 1.5; color: #d1d7d2; letter-spacing: 0; }
  .sm-fly { display: none; }
  .psect, .sect, .ab-sect, .ab-values, .svc-matrix, .chapter, .chapter.tech {
    padding: 48px 20px; min-height: 0; height: auto;
  }
  .pintro, .ab-intro { padding-top: 36px; padding-bottom: 40px; }
  .pwm, .ab-wm, .wm { font-size: clamp(26px, 7.5vw, 34px); line-height: 1.16; white-space: normal; overflow-wrap: anywhere; letter-spacing: 0; margin-bottom: 0; color: #969f98; }
  .pcn, .ab-cn, .ch-cn, .s-title { font-size: 25px; line-height: 1.45; margin-top: 12px; letter-spacing: .02em; text-wrap: balance; }
  .pcross, .ab-cross { margin-bottom: 28px; }
  .pcross::before, .ab-cross::before { top: -8px; height: 17px; }
  .pcross::after, .ab-cross::after { top: -11px; width: 6px; height: 6px; left: -2.5px; }
  .pkick, .kick, .kick2 { display: none; }
  .parrow, .ab-arrow, .tech-arrow { margin-top: 20px; width: 28px; height: 28px; }
  .parrow.small, .ab-arrow.small { width: 26px; height: 26px; margin-top: 16px; }
  .pintro .body, .ab-intro .body { margin-top: 22px; font-size: 16px; line-height: 1.9; }
  .pduo, .ab-culture .duo { grid-template-columns: minmax(0, 1fr); gap: 26px; margin-top: 28px; }
  .pduo > *, .form-wrap > *, .coops > *, .ovl-grid > * { min-width: 0; }
  .pduo .copy p, .pduo .copy .points span, .ab-culture .believe-p,
  .item p, .coops p, .inside p, .step p, .how p, .jh-cards p, .svc-grid p,
  .form-note, .mtx-base p, .sys-cap p, .sol-active p, .sol-row .body p {
    font-size: 16px; line-height: 1.85; color: #b8bdb9;
  }
  .coops, .inside, .how, .jh-cards, .svc-grid { grid-template-columns: minmax(0, 1fr); margin-top: 24px; }
  .coops > div, .inside > div, .how > div, .svc-grid > div { padding: 24px 20px; }
  .coops b { font-size: 20px; margin: 10px 0 12px; }
  .coops .no { font-size: 12px; letter-spacing: .1em; }
  .coops .plus { font-size: 14px; line-height: 1.85; color: #c6ccc7; margin-top: 16px; padding-top: 16px; }
  .steps, .items, .form-wrap, .phones, .feat { margin-top: 28px; }
  .form-wrap { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .jform { gap: 20px; }
  .jform .row2 { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .jform label { font-size: 14px; letter-spacing: .02em; color: #c1c8c2; }
  .jform input:not([type="checkbox"]), .jform select, .jform textarea { font-size: 16px; min-height: 48px; padding: 12px; border-radius: 4px; }
  .jform textarea { min-height: 128px; }
  .jform button { justify-self: stretch; min-height: 48px; width: 100%; font-size: 16px; margin-top: 4px; }
  .jform input::placeholder, .jform textarea::placeholder { color: #a6aea8; opacity: 1; }
  .jform input, .jform textarea { caret-color: #ff947f; }
  .prow { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .pcard { padding: 18px 12px; }
  .pcard img { height: 110px; }
  .pcard b { font-size: 14px; }
  .pcard small { font-size: 12px; color: #646464; }
  .buy { padding: 40px 20px; }
  .buy .chip, .plink { min-height: 44px; padding: 10px 20px; line-height: 24px; }
  .plink + .plink { margin-left: 0; margin-top: 12px; }
  .stats, .about-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 20px; }
  .stats .stat b, .about-stats .stat b, .ab-power .stat b { font-size: 36px; }
  .stats .stat span, .about-stats .stat span { font-size: 14px; line-height: 1.6; color: #bdc5bf; margin-top: 10px; }
  .ab-power { min-height: 0; }
  .ab-power .inner { padding: 80px 20px 40px; }
  .ab-power .since { top: 24px; right: 20px; }
  .ab-power .cap-note { margin-top: 28px; font-size: 14px; color: #b8bdb9; }
  .ab-values { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .ab-values .ab-wm { position: static; text-align: left; }
  .ab-values .bottom { padding-top: 20px; }
  .ab-values .grid { gap: 24px 16px; }
  .ab-values .grid span { font-size: 14px; }
  .av-row { padding: 26px 0; gap: 18px; }
  .ab-culture .believe-p { margin-top: 20px; }
  .na-hero { margin: 24px 20px 0; }
  .na-hero img { aspect-ratio: 4 / 3; }
  .na-body { padding: 28px 20px 0; }
  .na-body p { font-size: 16px; line-height: 1.9; text-align: left; margin-bottom: 22px; }
  .na-body h2 { margin: 32px 0 16px; }
  .na-meta { flex-wrap: wrap; gap: 8px 12px; }
  .na-pn { margin: 40px 20px 0; gap: 18px; }
  .na-pn a { font-size: 14px; }
  .na-endpad { height: 40px; }
  .na-hero figcaption, .na-fig figcaption, .na-pn span, .mtx-note { color: #a4ada6; }
  .mtx-wrap { margin-top: 24px; max-width: 100%; -webkit-overflow-scrolling: touch; }
  .mtx .mtx-name { position: sticky; left: 0; background: #171d18; z-index: 1; }
  .mtx th, .mtx td { padding-top: 14px; padding-bottom: 14px; }
  .mtx td.mtx-name, .mtx thead th.mtx-name { padding-left: 12px; }
  .mtx-base { margin-top: 28px; }
  .mtx-wrap::before { content: "左右滑动查看完整服务对照"; display: block; position: sticky; left: 0; width: calc(100vw - 44px); padding: 12px; font-size: 13px; color: #b8bdb9; }
  /* Mobile menu: both levels stay visible and scroll independently. */
  .ovl-grid { display: grid; grid-template-columns: 116px minmax(0, 1fr); overflow: hidden; }
  .ovl-pri { padding: 18px 10px 24px 16px; overflow-y: auto; overscroll-behavior: contain; }
  .ovl-sub { padding: 18px 16px 32px; overflow-y: auto; border-left: 1px solid #ffffff18; overscroll-behavior: contain; }
  .ovl-pri a { font-size: 14px; min-height: 48px; width: 100%; line-height: 1.5; padding: 12px 0; letter-spacing: 0; color: #aab4ad; white-space: normal; }
  .ovl-pri a.hov { color: #ff947f; }
  .ovl-sub .pane a { font-size: 15px; min-height: 48px; padding: 12px 0; line-height: 1.6; width: 100%; letter-spacing: 0; color: #e1e7e2; white-space: normal; }
  .ovl-sub .pane a i { display: block; font-size: 11px; margin-left: 0; color: #a4ada6; }
  .ovl-sub .pane .s-kick { margin-bottom: 14px; color: #a4ada6; overflow-wrap: anywhere; }
  .ovl-visual { display: none; }
  .ovl-sub .pane a:hover { transform: none; }
  .rv, .inview .rv { opacity: 1; transform: none; transition: none; }
  /* Home: readable content below the image, without full-height empty chapters. */
  .hero { height: 76vh; height: 76svh; min-height: 440px; max-height: 650px; }
  .hero-center { padding: 72px 20px 40px; }
  .hero-center h1 { font-size: clamp(22px, 6vw, 28px); line-height: 1.6; letter-spacing: .12em; text-indent: 0; }
  .hero-center h1 .hp { width: .5em; }
  .hero-center .sub { font-size: 12px; line-height: 1.6; letter-spacing: .08em; color: #d1d7d2; }
  .hero .bg video { transform: none; }
  .scroll-hint { bottom: 24px; }
  .sec-arrow { position: static; margin-bottom: 18px; }
  .tech-grid { grid-template-columns: minmax(0, 1fr); gap: 24px; margin-top: 24px; }
  .sys-slide img { aspect-ratio: 4 / 3; }
  .sys-cap { margin-top: 20px; padding-right: 0; }
  .sys-cap b { font-size: 22px; line-height: 1.5; }
  .sys-cap span { font-size: 16px; line-height: 1.8; margin-top: 8px; }
  .sys-cap p { margin-top: 12px; }
  .chapter.sol { padding-bottom: 0; }
  .sol-video { height: auto; min-height: 0; margin: 28px -20px 0; background: #0e120f; }
  .sol-video video { position: static; width: 100%; height: auto; aspect-ratio: 16 / 10; }
  .sol-items { position: static; background: #0e120f; padding: 8px 20px 32px; }
  .sol-active { grid-template-columns: 32px minmax(0, 1fr); gap: 12px; padding: 24px 0; }
  .sol-active .body { padding: 0; }
  .sol-row { grid-template-columns: minmax(0, 1fr); gap: 24px; padding-top: 24px; }
  .sol-row .cell { grid-template-columns: 32px minmax(0, 1fr); gap: 12px; padding: 0; opacity: 1; }
  .sol-active .tag, .sol-row .tag { overflow-wrap: anywhere; font-size: 10px; letter-spacing: 0; color: #a4ada6; }
  .sol-active .num, .sol-row .num { font-size: 24px; }
  .sol-active h3, .sol-row h3 { font-size: 20px; line-height: 1.5; }
  .sol-row .body p { padding: 0; }
  .wide-ph { height: auto; aspect-ratio: 4 / 3; margin-top: 28px; }
  .svc-strip { margin-top: 24px; gap: 0 20px; }
  .svc-strip a { display: flex; align-items: center; min-height: 52px; font-size: 16px; }
  .ab-strip { gap: 28px; margin-top: 24px; }
  .ab-strip .ab-claim { font-size: 17px; }
  .ph-brand { left: 20px; bottom: 24px; letter-spacing: .12em; font-size: 22px; }
  .ph-brand i { letter-spacing: .12em; font-size: 13px; }
  .nlist { margin-top: 24px; }
  .nlist li { grid-template-columns: minmax(0, 1fr) auto; gap: 8px 12px; padding: 20px 0; }
  .nlist .t { grid-column: 1 / -1; grid-row: 2; white-space: normal; overflow: visible; text-overflow: clip; font-size: 16px; line-height: 1.7; }
  .nlist .y, .nlist .d { color: #a4ada6; }
  .more-link { margin-top: 26px; min-height: 44px; line-height: 1.8; }
  .more-note { color: #a4ada6; }
  footer#f-bottom, body > footer:has(.f-top) { padding: 40px 20px 28px; }
  .f-top { gap: 28px; flex-direction: column; }
  .f-left { width: 100%; min-width: 0; }
  .f-big { font-size: 13px; line-height: 1.8; letter-spacing: .12em; margin-top: 20px; }
  .f-sub { font-size: 15px; line-height: 1.8; margin-top: 12px; color: #b8bdb9; }
  .f-qr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; width: 100%; }
  .f-qr .qritem { min-width: 0; gap: 8px; }
  .f-qr .qritem img { width: 96px; height: 96px; }
  .f-qr .qritem span { font-size: 13px; line-height: 1.7; letter-spacing: 0; }
  .f-qr .qritem small { font-size: 12px; line-height: 1.7; color: #a4ada6; }
  .f-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 28px; gap: 0 20px; }
  .f-links a { display: flex; align-items: center; min-height: 44px; font-size: 14px; }
  .f-bottom { margin-top: 24px; padding-top: 18px; font-size: 12px; line-height: 1.9; color: #a4ada6; overflow-wrap: anywhere; }
  .f-bottom a { text-decoration: underline; text-underline-offset: 3px; }
}
@media screen and (max-width: 767px) and (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .scroll-hint { animation: none; }
  .sys-track { transition: none; }
}