/* ============================================================
   VITERN / Thermal Topology direction
   Local concept layer: dark technical proof + luminous engineering paper
   ============================================================ */

.theme-thermal {
  --paper: #f4f7fb;
  --paper-bright: #fbfdff;
  --paper-blue: #edf4fc;
  --paper-line: rgba(16, 48, 84, 0.13);
  --paper-line-strong: rgba(16, 48, 84, 0.24);
  --ink: #071426;
  --ink-dim: #42556d;
  --ink-mute: #6c7d92;
  background: #03070c;
}

/* 固定噪点会在滚动时让整屏持续重绘；新版本以真实的明暗层级替代颗粒。 */
.theme-thermal::after { display: none; }

/* ---------- Hero / thermal topology ---------- */
.theme-thermal .hero {
  min-height: var(--hero-height);
  background: #02070c;
}

.theme-thermal .hero::before {
  z-index: 0;
  background:
    linear-gradient(90deg, rgba(2, 7, 13, 0.58) 0%, rgba(2, 7, 13, 0.38) 34%, rgba(2, 7, 13, 0.12) 57%, rgba(2, 7, 13, 0.02) 100%),
    linear-gradient(180deg, rgba(2, 7, 13, 0.02), rgba(2, 7, 13, 0.24));
}

.theme-thermal .hero::after {
  z-index: 0;
  background: linear-gradient(180deg, transparent 78%, rgba(3, 8, 14, 0.58) 100%);
}

.theme-thermal .hero-media { filter: none; }

.theme-thermal .hero-cad-image { opacity: 0.78; }
.theme-thermal .hero-cad-focus { display: none; }
.theme-thermal .hero-cad-stage { will-change: auto; }
.theme-thermal .hero-cad-image { animation: none; transform: none; }
.theme-thermal .hero-cad-scan,
.theme-thermal .hero-cad-node { display: none; }
.theme-thermal .hero-cad-status::after { animation: none; transform: scaleX(1); }

/* 05 方向：完整数据中心等距架构 + 蓝色冷却路径，
   不叠加抽象节点、扫描框和假数据标签。 */
.theme-thermal .hero-cad-image {
  opacity: 1;
  object-position: center center;
}
.theme-thermal .hero-media::before { opacity: 0.08; }

.theme-thermal .hero-grid { grid-template-columns: minmax(0, 0.88fr) minmax(430px, 1.12fr); }
.theme-thermal .hero-copy { max-width: 650px; text-shadow: 0 4px 32px rgba(0, 0, 0, 0.8); }
.theme-thermal .hero-title { font-size: clamp(44px, 4.65vw, 76px); }
.theme-thermal .hero-sub { max-width: 47ch; }
.theme-thermal .hero .btn-primary { background: #1678ef; color: #fff; }
.theme-thermal .hero .btn-primary:hover { background: #2b8cff; }

/* ---------- Shared light engineering-paper sections ---------- */
.theme-thermal .architecture,
.theme-thermal .capabilities,
.theme-thermal .partners {
  --text: var(--ink);
  --text-dim: var(--ink-dim);
  --text-mute: var(--ink-mute);
  --line: var(--paper-line);
  --line-strong: var(--paper-line-strong);
  color: var(--ink);
  background-color: var(--paper);
  background-image:
    linear-gradient(rgba(38, 91, 148, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(38, 91, 148, 0.035) 1px, transparent 1px),
    radial-gradient(circle at 76% 8%, rgba(74, 159, 255, 0.09), transparent 30%);
  background-size: 72px 72px, 72px 72px, auto;
  border-color: var(--paper-line);
}

.theme-thermal .architecture .eyebrow,
.theme-thermal .capabilities .eyebrow,
.theme-thermal .partners .eyebrow { color: var(--ink-mute); }

.theme-thermal .architecture .eyebrow-tag::after,
.theme-thermal .capabilities .eyebrow-tag::after,
.theme-thermal .partners .eyebrow-tag::after { background: var(--paper-line-strong); }

/* ---------- System architecture on white ---------- */
.theme-thermal .architecture {
  background-color: var(--paper-bright);
  border-top: 0;
}
.theme-thermal .architecture::before {
  left: auto;
  right: -9%;
  top: -10%;
  width: min(68vw, 900px);
  height: min(68vw, 900px);
  border: 1px solid rgba(43, 120, 205, 0.08);
  background: repeating-radial-gradient(circle, rgba(43, 120, 205, 0.06) 0 1px, transparent 1px 42px);
}
.theme-thermal .architecture-note { color: var(--ink-dim); font-size: 17px; }
.theme-thermal .architecture-route { color: #47617d; }
.theme-thermal .architecture-route span {
  border-color: rgba(14, 102, 198, 0.17);
  background: rgba(255, 255, 255, 0.7);
}
.theme-thermal .architecture-route i { color: #0875e1; }
.theme-thermal .hero-stack {
  padding: clamp(18px, 2vw, 30px);
  color: #eaf2fb;
  border: 1px solid rgba(119, 184, 245, 0.22);
  background:
    radial-gradient(circle at 54% 42%, rgba(24, 104, 197, 0.17), transparent 44%),
    linear-gradient(155deg, #08192b, #030a12 74%);
  box-shadow: 0 28px 78px rgba(8, 30, 54, 0.22);
}
.theme-thermal .stack-wrap::before {
  background: radial-gradient(52% 46% at 52% 46%, rgba(37, 125, 220, 0.13), transparent 70%);
}
.theme-thermal .sp-item { color: #8195ad; }
.theme-thermal .sp-item:hover { color: #d9e9f8; }
.theme-thermal .sp-item.is-active {
  color: #f2f8ff;
  border-color: rgba(104, 195, 255, 0.28);
  background: rgba(18, 106, 201, 0.14);
}
.theme-thermal .sp-item.is-active i { color: #69d5ff; }
.theme-thermal .stack-tags span { color: #9db3ca; }

/* ---------- Dark solution rail ---------- */

/* ---------- Company story / pale topology ---------- */

.theme-thermal .value-panel {
  color: #edf5ff;
  border-color: rgba(116, 188, 255, 0.22);
  background:
    radial-gradient(circle at 8% 10%, rgba(43, 128, 213, 0.2), transparent 34%),
    linear-gradient(145deg, #0a1b2f, #040c16);
  box-shadow: 0 32px 90px rgba(10, 35, 61, 0.22);
}
.theme-thermal .value-panel::before { -webkit-text-stroke-color: rgba(121, 202, 255, 0.07); }
.theme-thermal .value-lead { border-color: rgba(116, 188, 255, 0.16); }
.theme-thermal .value-kicker { color: #69d5ff; }
.theme-thermal .value-lead > p:last-child { color: #aebed0; }

/* ---------- Product index on white ---------- */
.theme-thermal .capabilities {
  background-color: var(--paper-bright);
  border-top: 1px solid var(--paper-line);
  border-bottom: 1px solid var(--paper-line);
}
.theme-thermal .cap-list {
  color: #edf5ff;
  padding: 0 clamp(18px, 3vw, 38px);
  border: 1px solid rgba(116, 188, 255, 0.2);
  background:
    radial-gradient(circle at 78% 0%, rgba(23, 112, 214, 0.16), transparent 32%),
    linear-gradient(155deg, #08192b, #030a12 72%);
  box-shadow: 0 30px 85px rgba(16, 42, 70, 0.18);
}
.theme-thermal .cap-row { border-color: rgba(116, 188, 255, 0.14); }
.theme-thermal .cap-row:hover { background: rgba(38, 128, 224, 0.08); }
.theme-thermal .cap-row.is-current { background: linear-gradient(90deg, rgba(38, 128, 224, 0.12), transparent 72%); }
.theme-thermal .cap-row.is-current .cap-num { color: #69d5ff; text-shadow: none; }
.theme-thermal .cap-title-en { color: #8196ae; }
.theme-thermal .cap-desc { color: #aebed0; }
.theme-thermal .cap-meta span { color: #8fa5bd; border-color: rgba(116, 188, 255, 0.14); background: rgba(15, 39, 65, 0.48); }
.theme-thermal .cap-row:hover .cap-meta span { border-color: rgba(116, 188, 255, 0.32); color: #d3e2f2; }
.theme-thermal .cap-arrow { color: #7e94ab; }
.theme-thermal .cap-row:hover .cap-arrow { color: #69d5ff; }
.theme-thermal .cap-glyph { color: #69d5ff; }
.theme-thermal .cap-row::after {
  background: linear-gradient(90deg, rgba(8, 117, 225, 0), rgba(8, 117, 225, 0.5) 48%, rgba(8, 117, 225, 0));
}

/* ---------- Dark validation dashboard ---------- */
.theme-thermal .proof {
  --text: var(--ink);
  --text-dim: var(--ink-dim);
  --text-mute: var(--ink-mute);
  --line: var(--paper-line);
  --line-strong: var(--paper-line-strong);
  color: var(--ink);
  position: relative;
  background:
    radial-gradient(circle at 76% 12%, rgba(17, 105, 204, 0.09), transparent 28%),
    var(--paper-bright);
}
.theme-thermal .proof-grid {
  color: #edf5ff;
  border-color: rgba(120, 174, 229, 0.2);
  background: rgba(120, 174, 229, 0.18);
  box-shadow: 0 34px 100px rgba(0, 0, 0, 0.34);
}
.theme-thermal .proof-card { min-height: 400px; color: #edf5ff; }
.theme-thermal .proof-card .proof-desc { color: #aebed0; }
.theme-thermal .proof-card .proof-meta { color: #74cfff; border-color: rgba(116, 188, 255, 0.15); }
.theme-thermal .proof-card:nth-child(4) { background: linear-gradient(160deg, rgba(11, 35, 61, 0.98), rgba(4, 11, 20, 0.98)); }
.theme-thermal .proof-principles { border-color: rgba(113, 177, 238, 0.2); background: rgba(113, 177, 238, 0.2); }

/* ---------- Applications on luminous paper ---------- */
.theme-thermal .partners {
  background-color: var(--paper-blue);
  background-image:
    radial-gradient(circle at 86% 80%, rgba(45, 145, 240, 0.1), transparent 28%),
    linear-gradient(rgba(38, 91, 148, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(38, 91, 148, 0.035) 1px, transparent 1px);
  background-size: auto, 72px 72px, 72px 72px;
}
.theme-thermal .partner-list {
  color: #edf5ff;
  counter-reset: application;
  padding: 0 clamp(18px, 3vw, 38px);
  border: 1px solid rgba(116, 188, 255, 0.2);
  background:
    radial-gradient(circle at 86% 0%, rgba(23, 112, 214, 0.16), transparent 34%),
    linear-gradient(155deg, #08192b, #030a12 72%);
  box-shadow: 0 30px 85px rgba(16, 42, 70, 0.18);
}
.theme-thermal .partner-row {
  position: relative;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.35fr);
  border-color: rgba(116, 188, 255, 0.14);
  padding-left: clamp(54px, 6vw, 92px);
}
.theme-thermal .partner-row::before {
  counter-increment: application;
  content: "0" counter(application);
  position: absolute;
  left: 8px;
  top: 50%;
  transform: translateY(-50%);
  font-family: var(--font-mono);
  font-size: 12px;
  color: #0875e1;
}
.theme-thermal .partner-row:hover { background: rgba(38, 128, 224, 0.08); }
.theme-thermal .partner-row p { color: #aebed0; font-size: 16px; }

/* ---------- Dark inquiry ending ---------- */
.theme-thermal .contact {
  --text: var(--ink);
  --text-dim: var(--ink-dim);
  --text-mute: var(--ink-mute);
  --line: var(--paper-line);
  --line-strong: var(--paper-line-strong);
  color: var(--ink);
  background:
    radial-gradient(circle at 76% 30%, rgba(20, 108, 211, 0.09), transparent 30%),
    var(--paper-blue);
}
.theme-thermal .contact-band {
  --text: #edf5ff;
  --text-dim: #aebed0;
  --text-mute: #8196ae;
  --line: rgba(116, 188, 255, 0.14);
  --line-strong: rgba(116, 188, 255, 0.3);
  color: #edf5ff;
  border-color: rgba(119, 181, 238, 0.2);
  background:
    linear-gradient(110deg, rgba(8, 26, 46, 0.96), rgba(4, 11, 20, 0.98)),
    var(--panel);
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.3);
}
.theme-thermal .contact .btn-primary { background: #1678ef; color: #fff; }
.theme-thermal .contact .btn-primary:hover { background: #2b8cff; }
.theme-thermal .cond-panel { background: rgba(2, 8, 15, 0.58); border-color: rgba(119, 181, 238, 0.18); }

/* ---------- Responsive ---------- */

@media (max-width: 768px) {
  .theme-thermal .hero::before {
    background:
      linear-gradient(180deg, rgba(2, 7, 13, 0.18) 0%, rgba(2, 7, 13, 0.05) 36%, rgba(2, 7, 13, 0.20) 72%, rgba(2, 7, 13, 0.42) 100%),
      linear-gradient(90deg, rgba(2, 7, 13, 0.24), rgba(2, 7, 13, 0.04));
  }
  .theme-thermal .hero::after {
    background: linear-gradient(180deg, rgba(2, 7, 13, 0.16), transparent 30%);
  }
  .theme-thermal .hero-media { filter: brightness(1.18) saturate(1.05); }
  .theme-thermal .hero-grid { grid-template-columns: 1fr; }
  .theme-thermal .hero-stack { padding: 10px; }
  .theme-thermal .partner-row { grid-template-columns: 1fr; padding-left: 50px; }
}

@media (max-width: 480px) {
  .theme-thermal .architecture-note { font-size: 16px; }
}

/* ============================================================
   Continuous page composition
   Replace isolated black rectangles with one connected tonal field.
   ============================================================ */

.theme-thermal main {
  background: var(--paper-bright);
}

.theme-thermal .architecture,
.theme-thermal .capabilities,
.theme-thermal .proof,
.theme-thermal .partners,
.theme-thermal .contact {
  border-top: 0;
  border-bottom: 0;
}

/* Hero dark field dissolves into engineering paper instead of cutting to white. */
.theme-thermal .architecture {
  background-color: var(--paper-bright);
  background-image:
    linear-gradient(180deg,
      #03080e 0%,
      #15283a 4%,
      #8196aa 10%,
      #d7e2ec 16%,
      rgba(251, 253, 255, 0.98) 25%),
    linear-gradient(rgba(38, 91, 148, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(38, 91, 148, 0.035) 1px, transparent 1px);
  background-size: auto, 72px 72px, 72px 72px;
}

.theme-thermal .architecture::before {
  right: -18%;
  top: 8%;
  width: min(78vw, 1040px);
  height: min(78vw, 1040px);
  border: 0;
  background: repeating-radial-gradient(circle, rgba(43, 120, 205, 0.06) 0 1px, transparent 1px 46px);
  mask-image: radial-gradient(circle, #000 0 52%, transparent 78%);
}

/* The four-layer drawing is no longer a framed black poster. */
.theme-thermal .hero-stack {
  padding: 0;
  overflow: visible;
  border: 0;
  background: transparent;
  box-shadow: none;
  isolation: isolate;
}
.theme-thermal .hero-stack::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 9% -8% 5%;
  border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(28, 85, 137, 0.16), rgba(28, 85, 137, 0.05) 45%, transparent 74%);
  filter: blur(18px);
}
.theme-thermal .stack-wrap {
  -webkit-mask-image: radial-gradient(ellipse 82% 92% at 50% 50%, #000 58%, rgba(0, 0, 0, 0.82) 72%, transparent 100%);
  mask-image: radial-gradient(ellipse 82% 92% at 50% 50%, #000 58%, rgba(0, 0, 0, 0.82) 72%, transparent 100%);
}
.theme-thermal .sp-item { color: #5d7187; }
.theme-thermal .sp-item:hover { color: #173b5c; }
.theme-thermal .sp-item.is-active {
  color: #0d3458;
  border-color: rgba(8, 117, 225, 0.2);
  background: rgba(255, 255, 255, 0.56);
  box-shadow: 0 10px 30px rgba(27, 73, 116, 0.08);
}
.theme-thermal .sp-item.is-active i { color: #0875e1; }
.theme-thermal .stack-tags span { color: #516981; }

/* Core products become an open technical rail on a full-width tonal transition. */

/* About section rises out of the dark rail gradually. */

/* One deep editorial anchor, with the four values left open on paper. */
.theme-thermal .value-panel {
  overflow: visible;
  border: 0;
  background: transparent;
  box-shadow: none;
  gap: clamp(18px, 3vw, 42px);
}
.theme-thermal .value-panel::before { display: none; }
.theme-thermal .value-lead {
  overflow: hidden;
  min-height: 520px;
  border: 0;
  border-radius: 56px 10px 56px 10px;
  background:
    radial-gradient(circle at 10% 8%, rgba(46, 139, 229, 0.25), transparent 38%),
    linear-gradient(148deg, #102b45, #06111d 72%);
  box-shadow: 0 34px 85px rgba(19, 53, 82, 0.22);
}

/* Product index and application index are lines, not dark containers. */
.theme-thermal .capabilities {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(ellipse at 104% 52%, rgba(8, 38, 64, 0.18), transparent 34%),
    linear-gradient(180deg, var(--paper-blue), var(--paper-bright));
}
.theme-thermal .cap-list,
.theme-thermal .partner-list {
  padding: 0;
  color: var(--ink);
  border: 0;
  background: transparent;
  box-shadow: none;
}
.theme-thermal .cap-list { border-top: 1px solid var(--paper-line-strong); }
.theme-thermal .cap-row {
  border-color: var(--paper-line);
  background: transparent;
}
.theme-thermal .cap-row:hover {
  background: linear-gradient(90deg, rgba(8, 117, 225, 0.075), transparent 72%);
}
.theme-thermal .cap-row.is-current {
  background: linear-gradient(90deg, rgba(8, 117, 225, 0.095), transparent 72%);
}
.theme-thermal .cap-row.is-current .cap-num,
.theme-thermal .cap-row:hover .cap-num { color: #0875e1; }
.theme-thermal .cap-title { color: #102c47; }
.theme-thermal .cap-title-en { color: #7b8da1; }
.theme-thermal .cap-desc { color: #4d6278; }
.theme-thermal .cap-meta span {
  color: #5b7188;
  border-color: rgba(16, 72, 126, 0.13);
  background: rgba(255, 255, 255, 0.5);
}
.theme-thermal .cap-row:hover .cap-meta span {
  color: #214c72;
  border-color: rgba(8, 117, 225, 0.24);
}
.theme-thermal .cap-arrow { color: #75889d; }
.theme-thermal .cap-row:hover .cap-arrow { color: #0875e1; }

/* Manufacturing flow reads as an open sequence rather than a 3x2 black wall. */
.theme-thermal .proof {
  overflow: hidden;
  background:
    radial-gradient(ellipse at 100% 42%, rgba(20, 76, 126, 0.14), transparent 34%),
    radial-gradient(ellipse at 0% 88%, rgba(80, 161, 230, 0.1), transparent 31%),
    linear-gradient(180deg, var(--paper-bright), #edf4fa);
}
.theme-thermal .proof-principles {
  gap: 16px;
  border: 0;
  background: transparent;
}
.theme-thermal .proof-principles span {
  min-height: 72px;
  padding: 14px 0;
  border-top: 1px solid var(--paper-line-strong);
  background: transparent;
}
.theme-thermal .proof-principles b { color: #0875e1; }
.theme-thermal .proof-principles em { color: #294761; }
.theme-thermal .proof-grid {
  gap: 0 clamp(24px, 4vw, 58px);
  overflow: visible;
  color: var(--ink);
  border: 0;
  background: transparent;
  box-shadow: none;
}
.theme-thermal .proof-card,
.theme-thermal .proof-card:nth-child(4),
.theme-thermal .proof-card:hover {
  min-height: 350px;
  padding: clamp(28px, 3vw, 42px) 0;
  color: var(--ink);
  border-top: 1px solid var(--paper-line-strong);
  background: transparent;
}
.theme-thermal .proof-card .proof-val { color: #173b5c; }
.theme-thermal .proof-card .proof-name { color: #122e48; }
.theme-thermal .proof-card .proof-desc { color: #4d6278; }
.theme-thermal .proof-card .proof-meta {
  color: #2679bd;
  border-color: var(--paper-line);
}

.theme-thermal .partners {
  position: relative;
  overflow: hidden;
  background-color: var(--paper-blue);
  background-image:
    radial-gradient(ellipse at -6% 44%, rgba(7, 38, 65, 0.13), transparent 32%),
    linear-gradient(rgba(38, 91, 148, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(38, 91, 148, 0.035) 1px, transparent 1px);
  background-size: auto, 72px 72px, 72px 72px;
}
.theme-thermal .partner-list { border-top: 1px solid var(--paper-line-strong); }
.theme-thermal .partner-row {
  color: var(--ink);
  border-color: var(--paper-line);
}
.theme-thermal .partner-row:hover {
  background: linear-gradient(90deg, rgba(8, 117, 225, 0.07), transparent 72%);
}
.theme-thermal .partner-row::before { color: #0875e1; }
.theme-thermal .partner-row h3 { color: #122e48; }
.theme-thermal .partner-row p { color: #4d6278; }

/* The final CTA becomes the page transition into the footer, not another card. */
.theme-thermal .contact {
  color: #edf5ff;
  background:
    radial-gradient(ellipse at 84% 56%, rgba(31, 108, 181, 0.2), transparent 36%),
    linear-gradient(180deg,
      var(--paper-blue) 0%,
      #cbd8e3 8%,
      #71879a 17%,
      #2d465d 27%,
      #102538 41%,
      #071522 64%,
      #050e18 100%);
}
.theme-thermal .contact-band {
  color: #edf5ff;
  border: 0;
  background: transparent;
  box-shadow: none;
}
.theme-thermal .contact .eyebrow,
.theme-thermal .contact-mail { color: #aebed0; }
.theme-thermal .cond-panel {
  border-color: rgba(153, 210, 255, 0.2);
  border-radius: 32px 8px 32px 8px;
  background: rgba(4, 17, 30, 0.34);
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.14);
}
.theme-thermal .footer {
  border-color: rgba(122, 180, 230, 0.1);
  background: #050e18;
}

@media (max-width: 768px) {
  .theme-thermal .architecture {
    background-image:
      linear-gradient(180deg, #03080e 0%, #6f8498 7%, #e7eef5 14%, rgba(251, 253, 255, 0.98) 23%),
      linear-gradient(rgba(38, 91, 148, 0.035) 1px, transparent 1px),
      linear-gradient(90deg, rgba(38, 91, 148, 0.035) 1px, transparent 1px);
  }
  .theme-thermal .stack-wrap {
    -webkit-mask-image: radial-gradient(ellipse 94% 94% at 50% 50%, #000 62%, transparent 100%);
    mask-image: radial-gradient(ellipse 94% 94% at 50% 50%, #000 62%, transparent 100%);
  }
  .theme-thermal .value-lead { min-height: 430px; }

  .theme-thermal .proof-grid { gap: 0 24px; }
}
