/* =========================================
   H5 首页 — 独立移动端样式（Figma 604:1907）
   仅作用于 max-width: 768px，不修改 styles.css
   ========================================= */

@media (max-width: 768px) {
  html {
    font-size: calc(100vw / 3.9);
    min-width: 0;
    scroll-behavior: auto;
  }

  body {
    min-width: 0;
    overscroll-behavior-y: contain;
  }

  /* 首页 H5：窗口不滚动，仅 #home-scroll 内滚动，视频层在 body 外不受牵连 */
  html.home-mobile-scroll-root,
  body.home-mobile-scroll-root {
    height: 100%;
    overflow: hidden;
    overscroll-behavior: none;
  }

  body.home-mobile-scroll-root #home-scroll {
    position: fixed;
    inset: 0;
    z-index: 1;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-y: contain;
  }

  /* ---------- 图片占位 ---------- */
  .img-ph {
    background-color: lightblue;
    display: block;
  }

  /* 隐藏 PC Header */
  .page > #header-placeholder,
  .page > #header-placeholder .header {
    display: none !important;
  }

  .page > #header-placeholder {
    height: 0;
    pointer-events: none;
  }

  /* ---------- Banner（Figma 604:1954） ---------- */
  .page {
    --banner-h: 100dvh;
  }

  @supports (height: 100svh) {
    .page {
      --banner-h: 100svh;
    }
  }

  .banner {
    position: relative;
    width: 100%;
    overflow: hidden;
  }

  /* 文案区占位；视频在 body#mobile-banner-video-layer，滚动时不改其样式 */
  .page > .banner {
    position: relative;
    z-index: 2;
    width: 100%;
    height: var(--banner-h);
    min-height: -webkit-fill-available;
    pointer-events: none;
    background: transparent;
  }

  .page > .banner.banner--video-portaled {
    background: transparent;
  }

  #mobile-banner-video-layer {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: var(--banner-h);
    min-height: -webkit-fill-available;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
    /* 独立合成层，滚动发生在 #home-scroll 内 */
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
  }

  #mobile-banner-video-layer .banner__bg {
    contain: strict;
  }

  #mobile-banner-video-layer.mobile-banner-video-layer--hidden {
    clip-path: inset(100% 0 0 0);
    pointer-events: none;
  }

  .page.page--banner-bg-hidden > .banner .banner__content {
    opacity: 0;
    pointer-events: none;
  }

  .page > .preface,
  .page > .company,
  .page > .service,
  .page > .work-process,
  .page > .models,
  .page > #footer-placeholder,
  .page > #mobile-menu-placeholder {
    position: relative;
  }

  .page > .company,
  .page > .service,
  .page > .work-process,
  .page > .models,
  .page > #footer-placeholder {
    z-index: 2;
  }

  #mobile-banner-video-layer .banner__bg,
  .page > .banner .banner__bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    background-color: #111111;
  }

  /* 底部渐隐与 Preface 叠压渐变对齐，减轻视频区滚入下方模块时的硬切感 */
  .banner__bg::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    height: 1.7rem;
    pointer-events: none;
    background: linear-gradient(0deg, #111111 0%, rgba(17, 17, 17, 0) 100%);
  }

  .banner__slides {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
  }


  .banner__slide {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: 0;
    transition: opacity 1.2s ease-in-out;
    pointer-events: none;
  }

  .banner__slide--active {
    opacity: 1;
    z-index: 1;
  }

  /* 非当前 slide 不绘制视频层，防止 iOS 多路视频与滚动合成冲突 */
  .banner__slide:not(.banner__slide--active) .banner__slide-video {
    visibility: hidden;
  }

  @media (prefers-reduced-motion: reduce) {
    .banner__slide {
      transition: opacity 0.35s ease;
    }
  }

  /* 视频掉帧时露出封面图，避免透出 .banner__bg 纯黑底 */
  .banner__slide-img {
    display: block;
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    object-position: center;
    z-index: 0;
    pointer-events: none;
  }

  .banner__slide-video {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    object-position: center;
    pointer-events: none;
    /* 不用 inset 大阴影遮罩（styles.css），避免滚动时重绘卡顿 */
    box-shadow: none;
    background-color: transparent;
  }

  .banner__slide::before {
    display: block;
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: rgba(0, 0, 0, 0.2);
  }

  .banner__slide::after {
    display: none;
    content: none;
  }

  .banner__content {
    --banner-exit-p: 0;
    position: absolute;
    inset: 0;
    z-index: 2;
    contain: layout style;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    max-width: none;
    padding: env(safe-area-inset-top) 0 env(safe-area-inset-bottom);
    margin: 0;
    pointer-events: none;
  }

  .banner__title {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 100%;
    height: auto;
    margin: 0;
    font-family: var(--font-en);
    font-size: 0.54rem;
    font-weight: 800;
    line-height: normal;
    letter-spacing: 0;
    color: var(--color-white);
  }

  .banner__title-line {
    position: static;
    display: block;
    white-space: nowrap;
    margin: 0;
    text-align: center;
  }

  .banner__title-line--from {
    transform: none;
  }

  .banner__title-line--from::after {
    content: ' ZERO';
  }

  .banner__title-line--zero {
    display: none;
  }

  .banner__title-line--launch {
    left: auto;
    top: auto;
    transform: none;
  }

  .banner__desc {
    position: static;
    right: auto;
    bottom: auto;
    left: auto;
    top: auto;
    transform: none;
    width: 3.42rem;
    max-width: calc(100% - 0.48rem);
    min-height: 0;
    margin: 0.24rem 0 0;
    font-family: var(--font-zh);
    font-size: 0.18rem;
    font-weight: 700;
    line-height: 0.3rem;
    color: var(--color-white);
    text-align: center;
    overflow-wrap: break-word;
    word-break: normal;
    hyphens: none;
  }

  .banner__desc p {
    margin: 0;
    line-height: 0.3rem;
    overflow-wrap: break-word;
    word-break: normal;
  }

  .banner__desc p + p {
    margin-top: 0;
  }

  .banner__pagination {
    display: none !important;
  }

  /* H5：CSS 变量驱动文案退场（无 GSAP ScrollTrigger，减轻滚动卡顿） */
  .banner__title-line--from,
  .banner__title-line--launch,
  .banner__desc {
    transition: none;
  }

  .banner:not(.banner--text-exited):not(.banner--text-instant) .banner__title-line--from {
    opacity: calc(1 - var(--banner-exit-p, 0));
    transform: translate3d(calc(-45vw * var(--banner-exit-p, 0)), 0, 0);
    pointer-events: none;
  }

  .banner:not(.banner--text-exited):not(.banner--text-instant) .banner__title-line--launch {
    opacity: calc(1 - var(--banner-exit-p, 0));
    transform: translate3d(calc(45vw * var(--banner-exit-p, 0)), 0, 0);
    pointer-events: none;
  }

  .banner:not(.banner--text-exited):not(.banner--text-instant) .banner__desc {
    opacity: calc(1 - var(--banner-exit-p, 0));
    transform: translate3d(0, calc(-0.24rem * var(--banner-exit-p, 0)), 0);
    pointer-events: none;
  }

  .banner--text-instant .banner__title-line--from,
  .banner--text-instant .banner__title-line--launch,
  .banner--text-instant .banner__desc {
    transition:
      opacity 0.62s cubic-bezier(0.4, 0, 0.2, 1),
      transform 0.62s cubic-bezier(0.22, 1, 0.36, 1);
  }

  .banner--text-exited .banner__title-line--from {
    opacity: 0;
    transform: translate3d(-45vw, 0, 0);
    pointer-events: none;
  }

  .banner--text-exited .banner__title-line--launch {
    opacity: 0;
    transform: translate3d(45vw, 0, 0);
    pointer-events: none;
  }

  .banner--text-exited .banner__desc {
    opacity: 0;
    transform: translate3d(0, -0.24rem, 0);
    pointer-events: none;
  }

  .banner--text-instant .banner__title-line--from,
  .banner--text-instant .banner__title-line--launch,
  .banner--text-instant .banner__desc {
    transition: none !important;
  }

  @media (prefers-reduced-motion: reduce) {
    .banner:not(.banner--text-exited) .banner__title-line--from,
    .banner:not(.banner--text-exited) .banner__title-line--launch,
    .banner:not(.banner--text-exited) .banner__desc {
      transform: none;
      transition: opacity 0.2s ease;
    }

    .banner--text-exited .banner__title-line--from,
    .banner--text-exited .banner__title-line--launch,
    .banner--text-exited .banner__desc {
      transform: none;
    }
  }

  /* ---------- Preface（Figma 604:1946） ---------- */
  .preface {
    position: relative;
    z-index: 3;
    width: 100%;
    height: 6.2rem;
    min-height: 6.2rem;
    margin-top: -1.7rem;
    background-color: transparent;
    overflow: hidden;
  }

  .preface__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(0deg, #111111 73.065%, rgba(17, 17, 17, 0) 100%);
    pointer-events: none;
  }

  .preface__inner {
    position: absolute;
    left: 50%;
    top: calc(50% + 0.74rem);
    transform: translate(-50%, -50%);
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.31rem;
    width: 100%;
    max-width: 3.9rem;
    padding: 0 0.24rem;
    box-sizing: border-box;
    text-align: center;
  }

  .preface__title {
    margin: 0;
    max-width: 100%;
    font-family: var(--font-en);
    font-size: 0.4rem;
    font-weight: 500;
    line-height: normal;
    color: var(--color-white);
    text-align: center;
    white-space: normal;
    overflow-wrap: break-word;
    word-break: normal;
  }

  .preface__subtitle {
    margin: 0;
    width: 100%;
    min-width: 100%;
    font-family: var(--font-zh);
    font-size: 0.18rem;
    font-weight: 700;
    line-height: normal;
    color: var(--color-white);
    text-align: center;
    overflow-wrap: break-word;
    word-break: normal;
  }

  .preface__subtitle-zh {
    font-family: inherit;
    font-weight: inherit;
    line-height: inherit;
  }

  .preface__zero,
  .preface__period {
    font-family: var(--font-en);
    font-weight: 800;
    line-height: normal;
  }

  /* ---------- Company（Figma 604:1929） ---------- */
  .company {
    min-height: 0;
    background: var(--color-gray-bg);
  }

  .company__inner {
    padding: 0.48rem 0.24rem 1.65rem;
    max-width: none;
  }

  .company__inner.container {
    padding-left: 0.24rem;
    padding-right: 0.24rem;
    padding-bottom: 0.32rem;
  }

  .company__layout {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
  }

  .company__col-left {
    display: contents;
  }

  .company__heading {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.08rem;
    margin: 0;
    order: 1;
  }

  .company__title {
    margin: 0;
    font-family: var(--font-en);
    font-size: 0.48rem;
    font-weight: 800;
    line-height: normal;
    color: var(--color-black);
  }

  .company__subtitle {
    margin: 0;
    font-family: var(--font-zh);
    font-size: 0.18rem;
    font-weight: 700;
    line-height: normal;
    color: var(--color-black);
    opacity: 0.4;
  }

  .company__content {
    max-width: none;
    width: 100%;
    padding-top: 0;
    margin-top: 0.62rem;
    display: flex;
    flex-direction: column;
    gap: 0;
    order: 2;
  }

  .company__headline {
    margin: 0 0 0.32rem;
    font-family: var(--font-zh);
    font-size: 0.24rem;
    font-weight: 700;
    line-height: 0.4rem;
    color: var(--color-black);
    overflow-wrap: break-word;
    word-break: normal;
  }

  .company__headline-line {
    display: block;
  }

  .company__zero {
    font-family: var(--font-en);
    font-weight: 800;
  }

  .company__detail {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.48rem;
    width: 100%;
  }

  .company__text {
    margin: 0;
    font-family: var(--font-zh);
    font-size: 0.16rem;
    font-weight: 500;
    line-height: 0.3rem;
    color: var(--color-black);
    overflow-wrap: break-word;
    word-break: normal;
  }

  .company__more {
    display: inline-block;
    line-height: 0;
    vertical-align: top;
  }

  .company__more-inner {
    display: none;
  }

  .company__more-img--h5 {
    display: block;
    width: auto;
    height: 0.16rem;
  }

  .company__media {
    display: block;
    width: 100%;
    height: 1.9rem;
    margin-top: 0.32rem;
    border-radius: 0.04rem;
    overflow: hidden;
    order: 3;
  }

  .company__media-img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    object-position: center;
    border-radius: 0.04rem;
  }

  .company__media::before {
    display: none;
    content: none;
  }

  /* ---------- Service（Figma 604:1923 / 621:2558） ---------- */
  .service__scroll-stage,
  .service__scroll-pin {
    min-height: 0 !important;
    position: static;
    display: block;
    height: auto;
  }

  .service {
    padding: 0.48rem 0;
    overflow: visible;
    background: var(--color-black);
  }

  .service__inner {
    padding: 0;
    max-width: none;
  }

  .service__inner.container {
    padding-left: 0;
    padding-right: 0;
  }

  .service__heading {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.08rem;
    margin: 0 0 0.48rem;
    padding: 0 0.24rem;
  }

  .service__title {
    margin: 0;
    font-family: var(--font-en);
    font-size: 0.48rem;
    font-weight: 800;
    line-height: normal;
    color: var(--color-white);
  }

  .service__subtitle {
    margin: 0;
    font-family: var(--font-zh);
    font-size: 0.18rem;
    font-weight: 700;
    line-height: normal;
    color: var(--color-white);
    opacity: 0.4;
  }

  .service__list {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 0 0.24rem;
    gap: 0;
  }

  .service__card {
    position: relative;
    width: 3.42rem;
    max-width: 100%;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 0 !important;
    padding: 0;
    border-radius: 0;
    background: var(--color-black);
    overflow: hidden;
    transition: max-height 0.4s ease, min-height 0.4s ease, margin-top 0.4s ease;
    min-height: 0;
  }

  .service__card:not(.is-expanded) {
    position: relative;
    z-index: 2;
    min-height: 0.64rem;
    max-height: 0.64rem;
  }

  .service__card.is-expanded {
    min-height: 4.24rem;
    max-height: 4.24rem;
    z-index: 1;
  }

  .service__card-header,
  .service__card.is-expanded .service__card-header {
    display: flex;
    align-items: center;
    gap: 0.16rem;
    width: 100%;
    height: 0.64rem;
    min-height: 0.64rem;
    max-height: 0.64rem;
    padding: 0.2rem 0.16rem;
    box-sizing: border-box;
    border: none;
    background: var(--color-black);
    position: relative;
    z-index: 3;
    pointer-events: auto;
    cursor: pointer;
    text-align: left;
    color: var(--color-white);
  }

  /* 收起态：标题下方显示 1px 横线 */
  .service__card:not(.is-expanded) .service__card-header::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    background: rgba(255, 255, 255, 0.15);
    pointer-events: none;
  }

  .service__card-index {
    font-family: var(--font-en);
    font-size: 0.16rem;
    font-weight: 800;
    line-height: normal;
    color: var(--color-white);
    flex-shrink: 0;
  }

  .service__card-title {
    font-family: var(--font-zh);
    font-size: 0.24rem;
    font-weight: 500;
    line-height: normal;
    color: var(--color-white);
    white-space: normal;
    overflow-wrap: break-word;
    word-break: normal;
  }

  html[lang="en"] .service__card-title {
    font-size: 0.18rem;
  }

  html[lang="ja"] .service__card-title {
    font-size: 0.22rem;
  }

  .service__card-panel {
    position: relative;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height 0.4s ease, opacity 0.35s ease;
  }

  .service__card.is-expanded .service__card-panel {
    max-height: 3.6rem;
    opacity: 1;
    overflow: hidden;
  }

  /* 展开态不再显示横线（原 PC 内嵌横线在 H5 隐藏） */
  .service__card-divider {
    display: none;
  }

  .service__card-body {
    position: relative;
    width: 100%;
    height: 3.6rem;
    min-height: 3.6rem;
    margin: 0;
    border-radius: 0.08rem;
    overflow: hidden;
    background: transparent;
  }

  .service__card-list {
    position: absolute;
    top: 0.16rem;
    left: 0.16rem;
    z-index: 2;
    width: 3.1rem;
    max-width: calc(100% - 0.32rem);
    margin: 0;
    padding: 0 0 0 0.24rem;
    font-family: var(--font-zh);
    font-size: 0.16rem;
    font-weight: 400;
    line-height: 0.32rem;
    color: var(--color-white);
    list-style: none;
    overflow-wrap: break-word;
    word-break: normal;
  }

  .service__card-list li {
    display: flex;
    align-items: flex-start;
    gap: 0.08rem;
    list-style: none;
    margin-left: 0;
  }

  .service__card-list li::before {
    content: "";
    flex-shrink: 0;
    width: 0.04rem;
    height: 0.04rem;
    margin-top: calc((1lh - 0.04rem) / 2);
    border-radius: 50%;
    background-color: currentColor;
  }

  .service__card-list__text {
    flex: 1;
    min-width: 0;
  }

  .service__card-list__note {
    display: block;
  }

  .service__card-visual {
    position: absolute;
    inset: 0;
    z-index: 1;
    border-radius: 0.08rem;
    overflow: hidden;
    background-color: var(--color-black);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
  }

  /* 渐变遮罩：左侧加深以便文字阅读，右侧露出图片 */
  .service__card-visual::after {
    display: block;
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 0.08rem;
    pointer-events: none;
  }

  .service__card-img {
    display: none !important;
  }

  /* 移动端竖向画框：超宽图用 cover 铺满， focal 与 PC 对齐 */
  .service__card--01 .service__card-visual {
    background-image: url('../images/mobile/home_service_img1.jpg');
    background-position: 42% 32%;
    background-size: cover;
  }

  .service__card--02 .service__card-visual {
    background-image: url('../images/mobile/home_service_img2.jpg');
    background-position: 50% 28%;
    background-size: cover;
  }

  .service__card--03 .service__card-visual {
    background-image: url('../images/mobile/home_service_img3.jpg');
    background-position: 50% 24%;
    background-size: cover;
  }

  .service__card--04 .service__card-visual {
    background-image: url('../images/mobile/home_service_img4.jpg');
    background-position: 50% 42%;
    background-size: cover;
  }

  .service__card--05 .service__card-visual {
    background-image: url('../images/mobile/home_service_img5.jpg');
    background-position: 50% 38%;
    background-size: cover;
  }

  /* ---------- Work Process（Figma 604:1913） ---------- */
  .work-process__scroll-stage,
  .work-process__scroll-pin {
    min-height: 0 !important;
    position: static;
    display: block;
    height: auto;
  }

  .work-process {
    min-height: 0;
    padding: 0.48rem 0;
    overflow: visible;
    background: var(--color-black);
  }

  .work-process__inner {
    max-width: none;
    margin: 0;
    width: 100%;
  }

  .work-process__header {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.08rem;
    margin: 0 0 0.48rem;
    padding: 0 0.24rem;
    text-align: center;
  }

  .work-process__title {
    font-family: var(--font-en);
    font-size: 0.48rem;
    font-weight: 800;
    line-height: normal;
    color: var(--color-white);
  }

  .work-process__subtitle {
    margin-top: 0;
    font-family: var(--font-zh);
    font-size: 0.18rem;
    font-weight: 700;
    line-height: normal;
    color: var(--color-white);
    opacity: 0.6;
  }

  .work-process__scroll {
    overflow: visible;
    padding-bottom: 0;
    cursor: default;
  }

  .work-process__scroll.is-dragging {
    cursor: default;
    user-select: auto;
  }

  .work-process__list {
    position: static;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.2rem;
    width: 100%;
    min-height: 0;
    margin-left: 0;
    padding: 0 0.24rem;
  }

  .work-process__card {
    position: relative;
    left: auto !important;
    top: auto !important;
    width: 3.42rem;
    max-width: 100%;
    min-height: 4rem;
    height: 4rem;
    margin: 0 auto;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 0.08rem;
    background: var(--color-black);
    overflow: hidden;
  }

  .work-process__card-bg {
    display: block;
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    object-position: center;
    border-radius: 0.08rem;
    z-index: 0;
  }

  .work-process__card-bg--center {
    object-position: center;
  }

  .work-process__card-mask {
    position: absolute;
    inset: 0;
    border-radius: 0.08rem;
    background: linear-gradient(
      180deg,
      rgba(24, 24, 24, 0) 49.94%,
      #181818 99.89%
    );
    z-index: 1;
    pointer-events: none;
  }

  .work-process__icon {
    display: block;
    position: absolute;
    top: 0.23rem;
    left: 0.23rem;
    z-index: 2;
    width: 0.32rem;
    height: 0.32rem;
    max-width: none;
    object-fit: contain;
  }

  .work-process__card-body {
    position: absolute;
    bottom: 0.23rem;
    left: 0.23rem;
    z-index: 2;
    width: 2.94rem;
    max-width: calc(100% - 0.46rem);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.16rem;
    padding: 0;
  }

  .work-process__card-title {
    font-family: var(--font-zh);
    font-size: 0.24rem;
    font-weight: 500;
    line-height: normal;
    color: var(--color-white);
    overflow-wrap: break-word;
    word-break: normal;
  }

  .work-process__card-desc {
    font-family: var(--font-zh);
    font-size: 0.16rem;
    font-weight: 400;
    line-height: 0.24rem;
    color: var(--color-white);
    opacity: 0.6;
    overflow-wrap: break-word;
    word-break: normal;
  }

  .work-process__card::before,
  .work-process__card-body::before {
    display: none;
    content: none;
  }

  /* ---------- Gallery（Figma 604:1908）— 移动端图无缝循环滚动 ---------- */
  .gallery {
    height: 3.2rem;
    background: var(--color-white);
    overflow: hidden;
  }

  .gallery__viewport {
    height: 3.2rem;
    margin-left: 0;
    overflow: hidden;
  }

  .gallery__track {
    display: flex;
    align-items: stretch;
    width: max-content;
    height: 3.2rem;
    gap: 0;
    animation: gallery-mobile-marquee 18s linear infinite;
    will-change: transform;
  }

  .gallery__set {
    display: flex;
    flex-shrink: 0;
    align-items: stretch;
    gap: 0;
  }

  .gallery__item {
    flex-shrink: 0;
    margin: 0;
    padding: 0;
    line-height: 0;
    overflow: hidden;
  }

  .gallery__item--sm,
  .gallery__item--lg {
    width: auto;
    height: 3.2rem;
  }

  .gallery__img {
    display: block;
    width: auto;
    height: 3.2rem;
    max-width: none;
    margin: 0;
    padding: 0;
    border: 0;
    vertical-align: top;
    object-fit: cover;
    object-position: center;
  }

  .gallery__item--sm .gallery__img {
    width: 3.2rem;
  }

  .gallery__item--lg .gallery__img {
    width: 4.54rem;
  }

  .gallery__item::before {
    display: none;
  }

  @keyframes gallery-mobile-marquee {
    from {
      transform: translate3d(0, 0, 0);
    }

    to {
      transform: translate3d(-50%, 0, 0);
    }
  }
}

@media (max-width: 768px) and (prefers-reduced-motion: reduce) {
  .gallery__track {
    animation: none;
  }

  .service__card,
  .service__card-panel {
    transition: none;
  }
}

@media (min-width: 769px) {
  .service__card-img {
    display: none !important;
  }
}