/* 首頁體驗：置中手機首屏、手動橫向卡片、雙欄反向學員回饋。 */
.ma-film-sub-mobile,
.voices-mobile-stream {
  display: none;
}

/* 桌機小卡優先保留 AI 指揮官封面左側標題，手機仍完整顯示整張。 */
.ma-courses .ma-course:first-child img { object-position: left center; }

@media (max-width: 760px) {
  .ma-film-still {
    object-position: 80% center;
    filter: saturate(.84) contrast(1.08) brightness(.78);
  }

  .ma-film-shade {
    background:
      linear-gradient(180deg, rgba(14, 12, 10, .42) 0%, rgba(14, 12, 10, .08) 24%, rgba(14, 12, 10, .04) 46%, rgba(14, 12, 10, .62) 70%, rgba(14, 12, 10, .94) 100%),
      linear-gradient(90deg, rgba(14, 12, 10, .12) 0%, transparent 44%, rgba(14, 12, 10, .06) 100%);
  }

  .ma-film-content {
    align-items: center;
    justify-content: flex-end;
    padding: 92px 24px max(3.25rem, env(safe-area-inset-bottom));
    text-align: center;
  }

  .ma-film-content .c9-kicker {
    margin-bottom: 13px;
    color: #e6ca85;
    letter-spacing: .3em;
  }

  .ma-film-hero h1 {
    max-width: 9em;
    font-size: clamp(2rem, 9.8vw, 2.45rem);
    line-height: 1.36;
    letter-spacing: .035em;
    text-wrap: balance;
  }

  .ma-film-sub-desktop { display: none; }
  .ma-film-sub-mobile { display: inline; }
  .ma-film-content .ma-slide-sub {
    max-width: 20em;
    margin-top: 14px;
    color: #f4ead7;
    font-size: .94rem;
    line-height: 1.75;
    letter-spacing: .045em;
  }

  .ma-film-content .ma-hero-actions {
    justify-content: center;
    width: 100%;
    margin-top: 21px;
  }

  .ma-film-content .c9-btn {
    min-width: min(72vw, 278px);
  }

  .ma-film-content .ma-hero-secondary { display: none; }

  .ma-proof,
  .ma-courses {
    display: flex;
    gap: 14px;
    margin-inline: calc(50% - 50vw);
    padding: 4px 24px 18px;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-padding-inline: 24px;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  .ma-proof::-webkit-scrollbar,
  .ma-courses::-webkit-scrollbar { display: none; }

  .ma-proof-card,
  .ma-courses .ma-course {
    flex: 0 0 min(82vw, 340px);
    scroll-snap-align: center;
    scroll-snap-stop: always;
    border-radius: 10px;
    box-shadow: 0 12px 32px rgba(41, 34, 25, .09);
  }

  .ma-proof-card { min-height: 390px; }
  .ma-proof-media { aspect-ratio: 4 / 3; }
  .ma-proof-body,
  .ma-course-body { padding: 20px 21px 23px; }
  .ma-proof-card h3,
  .ma-course-body h3 { font-size: 1.06rem; }
  .ma-proof-text,
  .ma-course-body p { font-size: .86rem; line-height: 1.9; }

  .ma-courses .ma-course img {
    height: auto;
    aspect-ratio: 40 / 21;
    object-fit: cover;
  }

  .ma-courses .ma-course:first-child img {
    object-fit: contain;
    object-position: center;
    background: #0c0d12;
  }

  .voices-evidence-section .c9-section-head {
    max-width: 21em;
    margin-inline: auto;
    text-align: center;
  }

  .voices-evidence-section .c9-sub { margin-inline: auto; }
  .voices-tree {
    height: 650px;
    margin: 1.8rem calc(50% - 50vw) 0;
    max-width: none;
  }

  .voices-tree-core,
  .voices-node-ring { display: none; }

  .voices-mobile-stream {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    height: 650px;
    padding-inline: 12px;
    overflow: hidden;
    mask-image: linear-gradient(180deg, transparent 0%, #000 7%, #000 93%, transparent 100%);
  }

  .voices-mobile-column {
    min-width: 0;
    overflow: hidden;
  }

  .voices-mobile-track {
    display: block;
    will-change: transform;
    animation: voices-mobile-flow-up 102s linear infinite;
  }

  .voices-mobile-column:nth-child(2) .voices-mobile-track {
    animation-name: voices-mobile-flow-down;
  }

  .voices-mobile-set {
    display: grid;
    gap: 10px;
    padding-bottom: 10px;
  }

  .voices-mobile-card {
    display: block;
    width: 100%;
    min-width: 0;
    padding: 0;
    overflow: hidden;
    border: 1px solid rgba(124, 103, 72, .25);
    border-radius: 10px;
    background: rgba(255, 255, 255, .96);
    color: var(--site-ink);
    text-align: left;
    box-shadow: 0 10px 26px rgba(58, 45, 28, .1);
    cursor: zoom-in;
  }

  .voices-mobile-card .voices-node-media {
    height: 154px;
    min-height: 154px;
    padding: 7px;
    background: #171717;
  }

  .voices-mobile-card .voices-node-media img {
    width: 100%;
    height: 100%;
    object-fit: contain;
  }

  .voices-mobile-card .voices-node-label {
    min-height: 66px;
    padding: 11px 12px 13px;
  }

  .voices-mobile-card .voices-node-label strong {
    font-size: .82rem;
    line-height: 1.4;
  }

  .voices-mobile-card .voices-node-label span {
    margin-top: 3px;
    font-size: .68rem;
    line-height: 1.45;
    white-space: normal;
  }

  .voices-mobile-card::after {
    content: "+";
    position: absolute;
    right: 8px;
    top: 8px;
    display: grid;
    place-items: center;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background: rgba(248, 242, 231, .96);
    color: #705331;
    font-size: 16px;
    box-shadow: 0 2px 9px rgba(0, 0, 0, .18);
  }

  .voices-mobile-card { position: relative; }
}

@keyframes voices-mobile-flow-up {
  from { transform: translateY(0); }
  to { transform: translateY(-50%); }
}

@keyframes voices-mobile-flow-down {
  from { transform: translateY(-50%); }
  to { transform: translateY(0); }
}

@media (max-width: 380px) {
  .ma-film-content { padding-inline: 20px; }
  .ma-proof,
  .ma-courses { padding-inline: 20px; scroll-padding-inline: 20px; }
  .ma-proof-card,
  .ma-courses .ma-course { flex-basis: 84vw; }
  .voices-mobile-card .voices-node-media { height: 142px; min-height: 142px; }
}

@media (max-width: 760px) and (prefers-reduced-motion: reduce) {
  .voices-tree { height: auto; }
  .voices-mobile-stream { height: auto; overflow: visible; mask-image: none; }
  .voices-mobile-track { animation: none; }
  .voices-mobile-set[aria-hidden="true"] { display: none; }
}
