/* Page-scoped compatibility layer for the structured AI landing-page blocks. */
.content--ai-workstation main,
.content--ai-product main { overflow: hidden; }
.cms-page--ai-workstation,
.cms-page--ai-product { font-size: 16px; line-height: 16px; }

.cms-page--ai-workstation.product-card,
.cms-page--ai-workstation .product-section .product-card { width: auto; min-width: 0; max-width: none; }
.cms-page--ai-workstation .product-image-wrap picture { display: contents; }

.content--ai-product,
.content--ai-product main { font-family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif; }
.content--ai-product main { background: #f5f5f5; }
.cms-page--ai-product .ai-product-catalog { display: contents; }
.cms-page--ai-product .product-swatches { visibility: visible; }
.cms-page--ai-product .product-swatches a {
  background: #3b3c3c;
  background: var(--swatch, #3b3c3c);
}
.cms-page--ai-product .filter-group label:hover { color: #b3b3b3; }
.cms-page--ai-product .filter-group label:hover input { border-color: #b3b3b3; }
.cms-page--ai-product .page-carousel__slide h1 {
  margin: 0 0 2.6875rem;
  color: #f5f5f5;
  font-size: 3rem;
  font-weight: 500;
  line-height: 1;
}

/* The source carousel is intrinsically sized by its 1920 x 408 artwork. */
@media (min-width: 1025px) {
  .cms-page--ai-product .page-carousel { height: auto; aspect-ratio: 80 / 17; }
}

/* Keep the source site's 64px dotted control ring and rotate only the ring. */
.cms-page--ai-product .page-carousel .carousel-arrow {
  width: 4rem;
  height: 2.75rem;
  background: transparent;
  border: 0;
}
.cms-page--ai-product .page-carousel .carousel-arrow::before {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 4rem;
  height: 4rem;
  border: 2px dotted rgb(255 255 255 / 85%);
  border-radius: 50%;
  content: "";
  transform: translate(-50%, -50%);
}
.cms-page--ai-product .page-carousel .carousel-arrow:hover { background: transparent; }
.cms-page--ai-product .page-carousel .carousel-arrow:hover::before {
  border-color: #e3540b;
  animation: ai-catalog-ring-spin .2s linear infinite;
}
.cms-page--ai-product .page-carousel .carousel-arrow--prev:hover::after { border-right-color: #e3540b; }
.cms-page--ai-product .page-carousel .carousel-arrow--next:hover::after { border-left-color: #e3540b; }

@keyframes ai-catalog-ring-spin {
  from { transform: translate(-50%, -50%) rotate(0); }
  to { transform: translate(-50%, -50%) rotate(1turn); }
}

@media (min-width: 1716px) {
  .cms-page--ai-product .product-results { width: 68.75rem; flex-basis: 68.75rem; }
}

@media (min-width: 641px) and (max-width: 900px) {
  .cms-page--ai-workstation { margin-top: 2.5rem; }
}

@media (min-width: 641px) and (max-width: 768px) {
  .cms-page--ai-product { margin-top: 5rem; }
}

@media (min-width: 641px) {
  .cms-page--ai-workstation .spec-inner td,
  .cms-page--ai-workstation .spec-inner th { line-height: 1; }
}

@media (min-width: 769px) and (max-width: 1024px) {
  .cms-page--ai-product .products-layout { width: calc(100% - 1rem); margin-inline: .5rem; }
}

@media (max-width: 1024px) {
  .cms-page--ai-product .page-carousel__slide h1 {
    margin-bottom: 1vw;
    font-size: 1.25rem;
    font-weight: 500;
  }
}

@media (max-width: 767px) {
  .content--ai-product main { background: #fff; }
  .cms-page--ai-product .page-carousel { height: calc(21.25vw + .625rem); aspect-ratio: auto; }
  .cms-page--ai-product .filter-group label:hover { color: #707070; }
  .cms-page--ai-product .filter-group label:hover input { border-color: #b3b3b3; }
}

@media (max-width: 520px) {
  .cms-page--ai-product .page-carousel { height: 21.25vw; margin-top: 1.25rem; }
  .cms-page--ai-product .page-carousel__slide h1 {
    margin-bottom: .3125rem;
    font-size: 1rem;
    font-weight: 400;
  }
  .cms-page--ai-product .page-carousel__slide > a > div { min-height: 2rem; }
}

@media (max-width: 640px) {
  .cms-page--ai-workstation { margin-top: -2.5rem; }
}