/* 展示框与后台裁剪框使用相同比例，在各个屏幕上等比缩放。 */
.home-ads .home-ads__shell {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: 16 / 5;
}
.home-ads__slide.has-image { padding: 0 !important; }
.home-ads__slide.has-image::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 48%;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(180deg, transparent, rgba(3, 16, 29, .78));
}
.home-ads__slide.has-image .home-ads__content {
  display: block !important;
  position: absolute;
  inset: auto clamp(24px, 6vw, 96px) clamp(54px, 8vw, 96px);
  z-index: 2;
  /* v4.4 的位置和视觉样式；仅让面板宽度随文案长度收缩。 */
  width: fit-content !important;
  max-width: 760px;
  padding: 16px 22px 18px;
  border-left: 4px solid var(--theme-accent, #d88922);
  border-radius: 0 16px 16px 0;
  background: linear-gradient(90deg, rgba(3, 16, 29, .76), rgba(3, 16, 29, .16));
  color: #fff;
  pointer-events: none;
  text-shadow: 0 3px 18px rgba(0, 0, 0, .45);
}
.home-ads__slide.has-image .home-ads__content h2 {
  margin: 0;
  color: #fff;
  font-size: clamp(24px, 3.4vw, 54px);
  line-height: 1.16;
  letter-spacing: -.035em;
  overflow-wrap: anywhere;
}
.home-ads__slide .home-ads__image { object-fit: cover; }
.company-story .company-story__image-frame {
  position: relative;
  display: block;
  height: auto;
  aspect-ratio: 16 / 10;
  padding: 0;
}
.company-story .company-story__media img { position: absolute; inset: 0; object-fit: cover; }
.product-card__image[role="button"], .product-card__expand-media[role="button"] { position: relative; cursor: zoom-in; }
.image-zoom-hint { display: none !important; }
.product-card [role="button"]:focus-visible { outline: 3px solid var(--theme-accent, #d88922); outline-offset: -4px; }
html.site-overlay-open, html.site-overlay-open body { overflow-y: hidden !important; }
#product-modal { width: min(1080px, 94vw); max-height: 92vh; max-height: 92dvh; overflow: auto; }
#product-modal .modal-card { padding: 32px; }
.product-modal__layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px; align-items: center; }
.product-modal__copy { min-width: 0; padding-top: 12px; overflow-wrap: anywhere; }
.product-modal__image-button { display: grid; position: relative; place-items: center; width: 100%; height: clamp(260px, 38vh, 420px); padding: 16px; border: 1px solid #e4eaf0; border-radius: 20px; background: #f4f7fa; cursor: zoom-in; }
.product-modal__image-button img { display: block; width: 100%; height: 100%; min-height: 0; object-fit: contain; }
.product-modal__image-button[hidden] { display: none; }
.product-modal__image-button:focus-visible { outline: 3px solid var(--theme-accent, #d88922); outline-offset: 3px; }
#product-modal .modal-close { z-index: 2; }
.image-viewer { width: min(1280px, 96vw); max-width: none; max-height: 94vh; max-height: 94dvh; padding: 0; border: 1px solid #ffffff30; border-radius: 22px; color: #fff; background: #0b1d2b; overflow: hidden; box-shadow: 0 30px 100px #0006; }
.image-viewer::backdrop { background: #030d17db; backdrop-filter: blur(8px); }
.image-viewer[open] { display: grid; height: min(850px, 94vh); height: min(850px, 94dvh); grid-template-rows: auto minmax(0, 1fr) auto; }
.image-viewer__header { position: relative; display: flex; align-items: center; padding: 18px 68px 18px 24px; min-height: 70px; border-bottom: 1px solid #ffffff20; }
.image-viewer__header h2 { margin: 0; font-size: 18px; color: #fff; line-height: 1.4; }
.image-viewer .modal-close { top: 16px; right: 18px; }
.image-viewer__viewport {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  cursor: grab;
  /* 保留滚轮缩放和中键拖动需要的溢出区域，只隐藏浏览器滚动条轨道。 */
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.image-viewer__viewport::-webkit-scrollbar { width: 0; height: 0; display: none; }
.image-viewer__viewport.is-panning { cursor: grabbing; user-select: none; }
.image-viewer__surface { display: grid; place-items: center; min-width: 100%; min-height: 100%; }
.image-viewer__surface img { display: block; max-width: none; max-height: none; object-fit: contain; }
.image-viewer img[hidden], .image-viewer [hidden] { display: none; }
.image-viewer__status { position: absolute; inset: 0; display: grid; place-items: center; padding: 24px; color: #cfdae4; text-align: center; pointer-events: none; }
.image-viewer__tools { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 10px; padding: 14px 20px; border-top: 1px solid #ffffff20; background: #0b1d2b; }
.image-viewer__tools button { border: 1px solid #ffffff38; border-radius: 999px; padding: 8px 16px; color: #fff; background: #ffffff0d; font: inherit; font-size: 14px; cursor: pointer; }
.image-viewer__tools button:disabled { opacity: .4; cursor: default; }
.image-viewer__tools span { min-width: 46px; text-align: center; font-size: 13px; }
.image-viewer button:focus-visible { outline: 3px solid var(--theme-accent, #d88922); outline-offset: 2px; }
.image-viewer__tools small { color: #a3b6c5; font-size: 12px; }
@media (max-width: 900px) {
  .product-modal__layout { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  #product-modal .modal-card { padding: 26px 20px; }
  .product-modal__image-button { height: clamp(220px, 38vh, 340px); }
  .product-modal__copy { padding-top: 4px; }
}
@media (max-width: 520px) {
  .home-ads .home-ads__controls > button.home-ads__arrow { width: 28px !important; height: 28px !important; font-size: 24px !important; }
  .home-ads .home-ads__dots { bottom: 6px !important; padding: 4px 8px !important; gap: 6px !important; }
  .home-ads .home-ads__dots button { width: 7px !important; height: 7px !important; }
  .home-ads .home-ads__dots button.is-active { width: 20px !important; }
  .image-viewer__header { padding-left: 16px; }
  .image-viewer__header h2 { font-size: 16px; }
  .image-viewer__tools { gap: 7px; padding: 10px; }
  .image-viewer__tools small { width: 100%; text-align: center; }
  .image-viewer__header { min-height: 60px; }
}