@import url("../homefile/AlibabaPuHuiTi-3-45-Light/result.css");
@import url("../homefile/AlibabaPuHuiTi-3-55-Regular/result.css");
@import url("../homefile/AlibabaPuHuiTi-3-85-Bold/result.css");
@import url("../homefile/AlibabaPuHuiTi-3-95-ExtraBold/result.css");

.proInfo .pc {
  --design-width: 1920px;
  --design-height: 5267px;
  --page-scale: calc(100vw / var(--design-width));
  --ink: #243448;
  --cyan: #6cc3cd;
  --soft: #f4f4f6;
}

.proInfo .pc .product-page { min-width: 0; margin: 0; background: #fff; color: var(--ink); font-family: "Alibaba PuHuiTi 3.0 55 Regular", sans-serif; -webkit-font-smoothing: antialiased; }
h1, h2, p, figure { margin: 0; }
h1, h2, strong, b {font-family: "Alibaba PuHuiTi 3.0 85 Bold", "Alibaba PuHuiTi 3.0 55 Regular", sans-serif;}

.page-frame { width: 100%; height: calc(var(--design-height) * var(--page-scale)); overflow: hidden; display: flex; justify-content: center; align-items: flex-start; }
.product-page { width: var(--design-width); flex: 0 0 var(--design-width); transform: scale(var(--page-scale)); transform-origin: top center; overflow: hidden; }
.section { position: relative; width: var(--design-width); overflow: hidden; background-repeat: no-repeat; background-position: center top; background-size: var(--design-width) auto; }
.stage { position: relative; width: var(--design-width); height: 100%; margin: 0 auto; }

.feature-strip { height: 269px; background: #fff; }
.feature-list { display: flex; justify-content: center; gap: 80px; padding-top: 68px; }
.feature-list article {width: 368px;height: 125px;border-radius: 10px;background: linear-gradient(135deg, #d8e5f6 0%, #edf4ff 100%);display: flex;align-items: center;padding: 0 38px;gap: 20px;justify-content: center;}
.feature-list img {width: 43px;height: 43px;object-fit: contain;}
.feature-list strong {font-size: 26px;font-weight: 700;white-space: nowrap;color: #111820;letter-spacing: 1px;}

.hero-section { height: 801px; background-image: url("/api/media/file/TPS450AH_04.jpg"); }
.hero-copy {position: absolute;top: 182px;left: 1120px;width: 670px;}
/* ===== 文字渐变通用类（参考 V410 开发规范）===== */
.grad-line,
.grad-inline {
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  background-repeat: no-repeat;
}
.grad-line { display: block; }
.grad-inline { display: inline-block; vertical-align: top; }

/* 主标题渐变 —— 颜色与效果图保持一致 */
.grad-title {
  background-image: linear-gradient(180deg, #1d2e41 40%, #aab0b7 100%);
}
.hero-copy h1 {font-size: 56px;line-height: 1.2;}
.hero-copy > p {margin-top: 18px;font-size: 20px;line-height: 1.72;color: #334456;}
.hero-copy > p span, .identity-copy span { color: #54b7c6; font-weight: 700; }
.camera-specs { margin-top: 45px; display: grid; gap: 17px; }
.camera-specs p {display: flex;align-items: center;gap: 18px;font-size: 21px;}
.camera-specs b {font-weight: normal;/* min-width: 195px; */padding: 4px 24px;border-radius: 28px;background: var(--cyan);color: #fff;font-size: 20px;text-align: center;}
.camera-specs em { font-style: normal; color: #111820; }

.capture-section { height: 847px; background: #fff; }
.capture-grid { display: grid; grid-template-columns: 493px 407px 407px; gap: 35px; padding-top: 79px; padding-left: 272px; }
.panel-copy { height: 634px; padding: 142px 70px 0; border-radius: 13px; background: linear-gradient(135deg, #f5f5f7 0%, #fcfcfd 100%); }
.panel-copy h2 { font-size: 56px; line-height: 1.25; }
.panel-copy i, .size-stage i { display: block; width: 38px; height: 7px; border-radius: 6px; background: var(--cyan); }
.panel-copy i { margin-top: 35px; }
.panel-copy p {margin-top: 38px;font-size: 20px;line-height: 1.72;}
.capture-media img { width: 407px; height: 634px; object-fit: cover; border-radius: 13px; }
.capture-media p {margin-top: 28px;font-size: 18px;line-height: 1.35;text-align: center;white-space: nowrap;}

.format-section { height: 542px; background: var(--soft); }
.format-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 160px; padding: 87px 440px 0; }
.format-grid article { text-align: center; }
.format-grid img { width: 403px; height: 199px; object-fit: contain; margin: 0 auto; }
.format-grid h2 { margin-top: 38px; font-size: 35px; line-height: 1.2; }
.format-grid p {margin-top: 20px;font-size: 20px;line-height: 1.65;}

.identity-section { height: 802px; background-image: url("/api/media/file/TPS450AH_07.jpg"); }
.identity-copy { position: absolute; top: 175px; left: 456px; width: 450px; }
.identity-copy h2 { font-size: 58px; line-height: 1.22; }
.identity-copy p {margin-top: 42px;font-size: 20px;line-height: 1.72;}

.office-section { height: 870px; background-image: url("/api/media/file/TPS450AH_08.jpg"); }
.office-copy { position: absolute; top: 184px; left: 340px; width: 520px; }
.office-copy h2 { font-size: 57px; line-height: 1.24; }
.office-copy p {margin-top: 30px;font-size: 20px;line-height: 1.7;}
.office-copy b {display: block;width: 130px;margin-top: 76px;padding: 4px 10px;border-radius: 28px;background: var(--cyan);color: #fff;font-size: 24px;text-align: center;}

.scene-section { height: 637px; background: #fff; }
.scene-grid { display: grid; grid-template-columns: 657px 657px; gap: 65px; padding: 109px 273px 0; }
.scene-grid figure { position: relative; }
.scene-grid img { width: 657px; height: 473px; object-fit: cover; border-radius: 13px; }
.scene-grid figcaption {position: absolute;top: 32px;right: 30px;padding: 6px 30px;border-radius: 28px;background: var(--cyan);color: #fff;font-size: 24px;line-height: 1;}

.size-section { height: 499px; background-image: url("/api/media/file/TPS450AH_10.jpg"); }
.size-stage h2 { position: absolute; top: 214px; left: 331px; font-size: 56px; line-height: 1.2; }
.size-stage i {position: absolute;top: 285px;left: 331px;width: 220px;height: 2px;background: #bfc3c8;border-radius: 0;}

@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; } }