/*
 * ZH-ENG Product Detail Theme — Tech Blue
 * Scope every detail page inside .zheng-product-detail to avoid affecting
 * the rest of the website. Load this file globally from the site theme.
 */
.zheng-product-detail {
  --zh-blue-900: #063d7d;
  --zh-blue-700: #075bab;
  --zh-blue-600: #0566c9;
  --zh-cyan: #12a6d8;
  --zh-ink: #173a5e;
  --zh-muted: #526d89;
  --zh-line: #d8e5f3;
  --zh-soft: #eef6ff;
  --zh-soft-2: #f5f9fd;
  box-sizing: border-box;
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
  color: var(--zh-ink);
  background: #fff;
  font-family: Arial, Helvetica, sans-serif;
}

.zheng-product-detail *,
.zheng-product-detail *::before,
.zheng-product-detail *::after { box-sizing: border-box; }

.zheng-product-detail .zh-hero {
  padding: 58px 64px;
  color: #fff;
  background: linear-gradient(135deg, #062a5c, #075bab 62%, #18a2d0);
}
.zheng-product-detail .zh-eyebrow {
  color: #8ce9ff;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2px;
}
.zheng-product-detail .zh-hero h1 {
  margin: 14px 0 12px;
  color: #fff;
  font-size: clamp(30px, 4vw, 38px);
  line-height: 1.12;
}
.zheng-product-detail .zh-hero p {
  max-width: 700px;
  margin: 0;
  color: #e8f5ff;
  font-size: 17px;
  line-height: 1.7;
}

.zheng-product-detail .zh-content { padding: 46px 64px 64px; }
.zheng-product-detail .zh-rule {
  width: 56px;
  height: 3px;
  margin: 0 0 15px;
  background: var(--zh-cyan);
}
.zheng-product-detail .zh-section { margin-top: 42px; }
.zheng-product-detail h2 {
  margin: 0 0 12px;
  color: var(--zh-blue-900);
  font-size: 25px;
  line-height: 1.3;
}
.zheng-product-detail .zh-lead {
  margin: 0 0 28px;
  color: var(--zh-muted);
  font-size: 16px;
  line-height: 1.75;
}

/* Product image at left; two technical drawings on the right. */
.zheng-product-detail .zh-gallery {
  display: grid;
  grid-template-columns: minmax(0, 1.06fr) minmax(0, .94fr);
  gap: 24px;
  margin: 24px 0 46px;
}
.zheng-product-detail .zh-photo,
.zheng-product-detail .zh-drawing {
  border: 1px solid #dceafa;
  background: var(--zh-soft);
  text-align: center;
}
.zheng-product-detail .zh-photo { padding: 26px; }
.zheng-product-detail .zh-photo img {
  display: block;
  width: 100%;
  max-height: 510px;
  object-fit: contain;
  background: #fff;
}
.zheng-product-detail .zh-drawings { display: grid; gap: 18px; }
.zheng-product-detail .zh-drawing { padding: 14px; }
.zheng-product-detail .zh-drawing img {
  display: block;
  width: 100%;
  height: 178px;
  object-fit: contain;
  background: #fff;
}
.zheng-product-detail .zh-caption {
  padding-top: 12px;
  color: var(--zh-blue-600);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1px;
}

/* Spacious comparison table for series with many comparable models. */
.zheng-product-detail .zh-spec-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  border: 1px solid var(--zh-line);
  border-radius: 4px;
  font-size: 15px;
}
.zheng-product-detail .zh-spec-table th {
  padding: 17px 14px;
  color: #fff;
  background: var(--zh-blue-700);
  text-align: center;
  letter-spacing: .2px;
}
.zheng-product-detail .zh-spec-table td {
  padding: 17px 14px;
  color: #28445f;
  border-top: 1px solid #dbe7f4;
  text-align: center;
}
.zheng-product-detail .zh-spec-table tbody tr:nth-child(even) td { background: var(--zh-soft-2); }

/* Use these instead of a four-column table when a series has only a few models. */
.zheng-product-detail .zh-model-cards,
.zheng-product-detail .zh-info-cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}
.zheng-product-detail .zh-model-card,
.zheng-product-detail .zh-info-card {
  border: 1px solid var(--zh-line);
  background: #fff;
}
.zheng-product-detail .zh-model-card__title {
  padding: 15px 18px;
  color: #fff;
  background: var(--zh-blue-700);
  text-align: center;
  font-size: 17px;
  font-weight: 700;
}
.zheng-product-detail .zh-model-card table {
  width: 100%;
  border-collapse: collapse;
}
.zheng-product-detail .zh-model-card th,
.zheng-product-detail .zh-model-card td {
  width: 50%;
  padding: 14px;
  border-top: 1px solid var(--zh-line);
  text-align: center;
}
.zheng-product-detail .zh-model-card th {
  color: var(--zh-muted);
  font-weight: 400;
}
.zheng-product-detail .zh-model-card td {
  color: var(--zh-ink);
  font-weight: 700;
}
.zheng-product-detail .zh-model-card tr:nth-child(even) th,
.zheng-product-detail .zh-model-card tr:nth-child(even) td { background: #f8fbfe; }

.zheng-product-detail .zh-info-card { padding: 22px; }
.zheng-product-detail .zh-card-index {
  color: #00a2dd;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1px;
}
.zheng-product-detail .zh-info-card h3 {
  margin: 8px 0 10px;
  color: var(--zh-blue-900);
  font-size: 18px;
}
.zheng-product-detail .zh-info-card p {
  margin: 0;
  color: var(--zh-muted);
  font-size: 14px;
  line-height: 1.7;
}
.zheng-product-detail .zh-notice {
  margin-top: 34px;
  padding: 20px 22px;
  color: #315675;
  border-left: 4px solid var(--zh-cyan);
  background: #edf7fc;
  font-size: 14px;
  line-height: 1.7;
}

@media (max-width: 760px) {
  .zheng-product-detail .zh-hero,
  .zheng-product-detail .zh-content { padding: 34px 24px; }
  .zheng-product-detail .zh-gallery,
  .zheng-product-detail .zh-model-cards,
  .zheng-product-detail .zh-info-cards { grid-template-columns: 1fr; }
  .zheng-product-detail .zh-drawing img { height: auto; min-height: 180px; }
  .zheng-product-detail .zh-spec-table { font-size: 13px; }
  .zheng-product-detail .zh-spec-table th,
  .zheng-product-detail .zh-spec-table td { padding: 12px 8px; }
}
