From 4db9ba8185eff9b3609d195abb2ff0252afd2a25 Mon Sep 17 00:00:00 2001
From: "3127647737@qq.com" <3127647737@qq.com>
Date: Mon, 3 Aug 2026 10:07:24 +0800
Subject: [PATCH] =?UTF-8?q?style:=20=E9=87=8D=E5=81=9A=E8=87=AA=E5=AE=9A?=
 =?UTF-8?q?=E4=B9=89=E9=A6=96=E9=A1=B5=E8=A7=86=E8=A7=89=E5=B1=82=E7=BA=A7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 oneinai.html | 2036 +++++++++++++++++++++-----------------------------
 1 file changed, 852 insertions(+), 1184 deletions(-)

diff --git a/oneinai.html b/oneinai.html
index 3684dc7..f6ea54d 100644
--- a/oneinai.html
+++ b/oneinai.html
@@ -1,1223 +1,910 @@
 <style>
-  /* New API renders custom HTML inside an isolated shadow root. Keep the
-     page self-contained and avoid document-level selectors or scripts. */
-    .oneinai-root {
-      --page: #f3f6fa;
-      --paper: rgba(255, 255, 255, 0.86);
-      --paper-solid: #ffffff;
-      --ink: #12223b;
-      --muted: #62718a;
-      --soft: #8c98aa;
-      --line: rgba(38, 63, 105, 0.14);
-      --line-strong: rgba(38, 63, 105, 0.22);
-      --blue: #1757c2;
-      --cyan: #19b8ac;
-      --gold: #c59a57;
-      --navy: #0c1a2f;
-      --navy-soft: #17304c;
-      --red: #ed1c24;
-      --ice: #eef7ff;
-      --mint: #eefbf8;
-      --shadow: rgba(48, 72, 112, 0.16);
-    }
+  /* Self-contained styles for NewAPI's custom HTML shadow root. */
+  :host {
+    scroll-behavior: smooth;
+  }
 
-    * { margin: 0; padding: 0; box-sizing: border-box; }
-
-    :host { scroll-behavior: smooth; }
-
-    .oneinai-root {
-      display: block;
-      width: 100%;
-      min-height: 100vh;
-      font-family: 'Manrope', 'Noto Serif SC', 'Microsoft YaHei', sans-serif;
-      color: var(--ink);
-      background:
-        repeating-linear-gradient(90deg, rgba(38, 63, 105, 0.035) 0, rgba(38, 63, 105, 0.035) 1px, transparent 1px, transparent 96px),
-        repeating-linear-gradient(0deg, rgba(38, 63, 105, 0.028) 0, rgba(38, 63, 105, 0.028) 1px, transparent 1px, transparent 96px),
-        linear-gradient(180deg, #f6f8fb 0%, #f8fafc 58%, #f3f7f6 100%);
-      line-height: 1.55;
-      font-weight: 500;
-      overflow-x: hidden;
-      -webkit-font-smoothing: antialiased;
-      text-rendering: geometricPrecision;
-    }
-
-    .oneinai-root::before {
-      content: '';
-      position: fixed;
-      inset: 0;
-      z-index: -2;
-      pointer-events: none;
-      background:
-        linear-gradient(90deg, rgba(255,255,255,0.82), transparent 18%, transparent 82%, rgba(255,255,255,0.82)),
-        linear-gradient(180deg, rgba(255,255,255,0.68), transparent 42%, rgba(255,255,255,0.76));
-    }
-
-    .oneinai-root::after {
-      content: '';
-      position: fixed;
-      inset: 0;
-      z-index: -1;
-      pointer-events: none;
-      opacity: 0.2;
-      background-image:
-        linear-gradient(135deg, rgba(23,87,194,0.08) 0 1px, transparent 1px 14px),
-        linear-gradient(45deg, rgba(184,138,50,0.07) 0 1px, transparent 1px 16px);
-      mask-image: linear-gradient(to bottom, rgba(255,255,255,1) 0%, transparent 68%);
-      -webkit-mask-image: linear-gradient(to bottom, rgba(255,255,255,1) 0%, transparent 68%);
-    }
-
-    a { color: inherit; text-decoration: none; }
-    button { font: inherit; }
-
-    .page {
-      width: min(1180px, calc(100% - 40px));
-      margin: 0 auto;
-      position: relative;
-    }
-
-    .hero {
-      min-height: 640px;
-      display: grid;
-      grid-template-columns: minmax(0, 1.02fr) minmax(360px, 0.98fr);
-      align-items: center;
-      gap: 64px;
-      padding: 68px 0 92px;
-      position: relative;
-      isolation: isolate;
-    }
-
-    .hero::before {
-      content: '';
-      position: absolute;
-      left: -90px;
-      right: -90px;
-      top: 0;
-      bottom: 30px;
-      z-index: 0;
-      border: 1px solid rgba(255,255,255,0.12);
-      border-radius: 0 0 26px 26px;
-      background: linear-gradient(118deg, #0b192e 0%, #112640 54%, #1b3a55 100%);
-      clip-path: polygon(0 0, 100% 0, 96% 92%, 4% 100%);
-      box-shadow: 0 34px 90px rgba(12, 26, 47, 0.24);
-    }
-
-    .hero-copy,
-    .logo-stage {
-      position: relative;
-      z-index: 1;
-    }
-
-    .hero-kicker {
-      display: flex;
-      align-items: center;
-      gap: 12px;
-      margin-bottom: 26px;
-      color: #dfb974;
-      font-size: 12px;
-      font-weight: 800;
-      letter-spacing: 2.2px;
-    }
-
-    .hero-kicker::before {
-      content: '';
-      width: 42px;
-      height: 1px;
-      background: #dfb974;
-      opacity: 0.9;
-    }
-
-    .hero h1 {
-      font-family: 'Noto Serif SC', 'Manrope', serif;
-      font-size: clamp(56px, 7vw, 84px);
-      line-height: 0.98;
-      font-weight: 900;
-      color: #f8fbff;
-      letter-spacing: 0;
-      margin-bottom: 26px;
-      max-width: 720px;
-    }
-
-    .hero h1 span {
-      display: block;
-      color: transparent;
-      background: linear-gradient(92deg, #f8fbff 0%, #8bd8d1 56%, #dfb974 100%);
-      -webkit-background-clip: text;
-      background-clip: text;
-    }
-
-    .lead {
-      max-width: 660px;
-      color: rgba(233, 241, 250, 0.76);
-      font-size: 19px;
-      line-height: 1.78;
-      margin-bottom: 22px;
-    }
-
-    .trust-strip {
-      display: grid;
-      grid-template-columns: repeat(2, minmax(0, 1fr));
-      gap: 18px;
-      max-width: 680px;
-      margin-bottom: 30px;
-    }
-
-    .trust-proof {
-      display: grid;
-      grid-template-columns: 34px minmax(0, 1fr);
-      gap: 12px;
-      align-items: center;
-      padding: 15px 0;
-      border-top: 1px solid rgba(255,255,255,0.2);
-      border-bottom: 1px solid rgba(255,255,255,0.1);
-    }
-
-    .trust-proof-accent {
-      border-top-color: rgba(223,185,116,0.72);
-    }
-
-    .trust-index {
-      color: #dfb974;
-      font-size: 11px;
-      font-weight: 800;
-      letter-spacing: 1px;
-    }
-
-    .trust-proof strong {
-      display: block;
-      color: #f8fbff;
-      font-size: 15px;
-      line-height: 1.3;
-      margin-bottom: 4px;
-    }
-
-    .trust-proof span:last-child {
-      display: block;
-      color: rgba(233,241,250,0.58);
-      font-size: 12px;
-      font-weight: 700;
-    }
-
-    .actions {
-      display: flex;
-      align-items: center;
-      flex-wrap: wrap;
-      gap: 14px;
-      margin-bottom: 42px;
-    }
-
-    .btn {
-      display: inline-flex;
-      align-items: center;
-      justify-content: center;
-      min-height: 48px;
-      padding: 0 22px;
-      border-radius: 8px;
-      border: 1px solid var(--line);
-      cursor: pointer;
-      transition: transform 0.2s ease, border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
-      font-size: 15px;
-      font-weight: 800;
-      white-space: nowrap;
-    }
-
-    .btn:focus-visible,
-    .doc-action:focus-visible {
-      outline: 2px solid var(--gold);
-      outline-offset: 4px;
-    }
-
-    .btn-primary {
-      background: linear-gradient(135deg, #2778e6, #1db5ae);
-      color: #ffffff;
-      border-color: rgba(23, 87, 194, 0.22);
-      box-shadow: 0 22px 54px rgba(23, 87, 194, 0.22);
-    }
-
-    .btn-primary:hover,
-    .btn-secondary:hover {
-      transform: translateY(-2px);
-    }
-
-    .btn-secondary {
-      color: #f8fbff;
-      background: rgba(255, 255, 255, 0.06);
-      border-color: rgba(255, 255, 255, 0.28);
-      box-shadow: 0 16px 40px rgba(5, 14, 28, 0.16);
-    }
-
-    .signal-row {
-      display: grid;
-      grid-template-columns: repeat(3, minmax(0, 1fr));
-      gap: 12px;
-      max-width: 680px;
-    }
-
-    .signal {
-      min-height: 84px;
-      padding: 17px 18px;
-      border: 1px solid rgba(255,255,255,0.15);
-      border-radius: 8px;
-      background: rgba(255, 255, 255, 0.07);
-      box-shadow: inset 0 1px 0 rgba(255,255,255,0.1), 0 16px 34px rgba(5, 14, 28, 0.14);
-      backdrop-filter: blur(16px);
-    }
-
-    .signal:first-child {
-      border-color: rgba(223,185,116,0.58);
-      background: rgba(197,154,87,0.12);
-    }
-
-    .signal strong {
-      display: block;
-      color: #f8fbff;
-      font-size: 20px;
-      line-height: 1.1;
-      margin-bottom: 7px;
-    }
-
-    .signal span {
-      display: block;
-      color: rgba(233,241,250,0.58);
-      font-size: 12px;
-      font-weight: 800;
-    }
-
-    .logo-stage {
-      min-height: 440px;
-      position: relative;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-    }
-
-    .stage-frame {
-      width: min(390px, 100%);
-      aspect-ratio: 1;
-      position: relative;
-      border-radius: 8px;
-      border: 1px solid rgba(23, 87, 194, 0.16);
-      background:
-        linear-gradient(145deg, rgba(255,255,255,0.96), rgba(238,247,255,0.84) 48%, rgba(238,251,248,0.92)),
-        #ffffff;
-      box-shadow:
-        0 36px 105px rgba(48, 72, 112, 0.18),
-        inset 0 1px 0 rgba(255,255,255,0.96);
-      overflow: hidden;
-      isolation: isolate;
-    }
-
-    .stage-frame::before {
-      content: '';
-      position: absolute;
-      inset: 28px;
-      border: 1px solid rgba(23, 87, 194, 0.12);
-      border-radius: 8px;
-      background:
-        linear-gradient(90deg, rgba(23,87,194,0.075) 1px, transparent 1px),
-        linear-gradient(0deg, rgba(23,87,194,0.065) 1px, transparent 1px);
-      background-size: 44px 44px;
-      opacity: 0.74;
-      z-index: -1;
-    }
-
-    .stage-frame::after {
-      content: '';
-      position: absolute;
-      inset: -30% 34% -20% 34%;
-      transform: rotate(24deg);
-      background: linear-gradient(180deg, transparent, rgba(23, 87, 194, 0.16), rgba(25, 184, 172, 0.13), transparent);
-      filter: blur(14px);
-      opacity: 0.72;
-      z-index: -1;
-    }
-
-    .hero-logo {
-      position: absolute;
-      width: 57%;
-      height: 57%;
-      inset: 0;
-      margin: auto;
-      object-fit: contain;
-      border-radius: 8px;
-      filter: drop-shadow(0 32px 46px rgba(48, 72, 112, 0.22));
-      animation: logoFloat 7s ease-in-out infinite;
-    }
-
-    .corner {
-      position: absolute;
-      width: 42px;
-      height: 42px;
-      border-color: rgba(184, 138, 50, 0.62);
-    }
-
-    .corner.tl { left: 18px; top: 18px; border-left: 1px solid; border-top: 1px solid; }
-    .corner.tr { right: 18px; top: 18px; border-right: 1px solid; border-top: 1px solid; }
-    .corner.bl { left: 18px; bottom: 18px; border-left: 1px solid; border-bottom: 1px solid; }
-    .corner.br { right: 18px; bottom: 18px; border-right: 1px solid; border-bottom: 1px solid; }
-
-    .metric-chip {
-      position: absolute;
-      min-width: 128px;
-      padding: 12px 14px;
-      border-radius: 8px;
-      border: 1px solid rgba(23, 87, 194, 0.14);
-      background: rgba(255, 255, 255, 0.82);
-      backdrop-filter: blur(18px);
-      box-shadow: 0 18px 50px rgba(48, 72, 112, 0.14);
-    }
-
-    .metric-chip strong {
-      display: block;
-      font-size: 18px;
-      line-height: 1.1;
-      color: #16213a;
-      margin-bottom: 5px;
-    }
-
-    .metric-chip span {
-      display: block;
-      color: var(--muted);
-      font-size: 12px;
-      font-weight: 800;
-    }
-
-    .chip-a { left: 0; top: 96px; }
-    .chip-b { right: 8px; top: 50px; }
-    .chip-c { left: 38px; bottom: 62px; }
-
-    .section {
-      position: relative;
-      padding: 108px 0;
-      border-top: 1px solid rgba(38, 63, 105, 0.08);
-    }
-
-    .section-head {
-      display: flex;
-      align-items: end;
-      justify-content: space-between;
-      gap: 36px;
-      margin-bottom: 34px;
-    }
-
-    .section-kicker {
-      color: var(--gold);
-      font-size: 12px;
-      font-weight: 800;
-      letter-spacing: 1.8px;
-      margin-bottom: 12px;
-    }
-
-    .section-title {
-      font-family: 'Noto Serif SC', 'Manrope', serif;
-      font-size: 42px;
-      line-height: 1.18;
-      font-weight: 900;
-      color: #142646;
-      letter-spacing: 0;
-    }
-
-    .section-desc {
-      max-width: 470px;
-      color: var(--muted);
-      font-size: 15px;
-      line-height: 1.8;
-    }
-
-    .grid-3 {
-      display: grid;
-      grid-template-columns: repeat(3, minmax(0, 1fr));
-      gap: 14px;
-    }
-
-    .feature-card,
-    .model-card {
-      position: relative;
-      min-height: 236px;
-      padding: 28px;
-      border-radius: 8px;
-      border: 1px solid var(--line);
-      background: rgba(255,255,255,0.78);
-      overflow: hidden;
-      box-shadow: 0 16px 44px rgba(48,72,112,0.06), inset 0 1px 0 rgba(255,255,255,0.96);
-      transition: transform 0.24s ease, border-color 0.24s ease, background 0.24s ease, box-shadow 0.24s ease;
-    }
-
-    .feature-card::before,
-    .model-card::before {
-      content: '';
-      position: absolute;
-      inset: 0;
-      background: linear-gradient(135deg, rgba(184,138,50,0.1), transparent 42%, rgba(25,184,172,0.1));
-      opacity: 0;
-      transition: opacity 0.24s ease;
-    }
-
-    .feature-card:hover,
-    .model-card:hover {
-      transform: translateY(-4px);
-      border-color: rgba(23, 87, 194, 0.24);
-      background: #ffffff;
-      box-shadow: 0 24px 68px rgba(48,72,112,0.13);
-    }
-
-    .feature-card:hover::before,
-    .model-card:hover::before {
-      opacity: 1;
-    }
-
-    .card-index {
-      position: relative;
-      display: inline-flex;
-      align-items: center;
-      justify-content: center;
-      width: 42px;
-      height: 42px;
-      margin-bottom: 30px;
-      border-radius: 8px;
-      border: 1px solid rgba(184, 138, 50, 0.36);
-      color: var(--gold);
-      background: rgba(255, 250, 239, 0.74);
-      font-size: 13px;
-      font-weight: 800;
-    }
-
-    .feature-name {
-      position: relative;
-      font-size: 20px;
-      color: #152746;
-      font-weight: 800;
-      margin-bottom: 12px;
-    }
-
-    .feature-txt {
-      position: relative;
-      color: var(--muted);
-      font-size: 15px;
-      line-height: 1.75;
-    }
-
-    .model-strip {
-      display: grid;
-      grid-template-columns: repeat(3, minmax(0, 1fr));
-      gap: 14px;
-    }
-
-    .model-card {
-      min-height: 170px;
-      display: grid;
-      grid-template-columns: 58px minmax(0, 1fr);
-      gap: 18px;
-      align-items: center;
-    }
-
-    .model-logo {
-      position: relative;
-      width: 58px;
-      height: 58px;
-      object-fit: contain;
-      border-radius: 8px;
-      background: #ffffff;
-      padding: 10px;
-      box-shadow: 0 12px 28px rgba(48, 72, 112, 0.1);
-    }
-
-    .model-title {
-      position: relative;
-      color: #152746;
-      font-size: 19px;
-      font-weight: 800;
-      margin-bottom: 7px;
-    }
-
-    .model-meta {
-      position: relative;
-      color: var(--soft);
-      font-size: 13px;
-      font-weight: 800;
-    }
-
-    .pricing {
-      display: grid;
-      grid-template-columns: minmax(0, 1.05fr) minmax(320px, 0.95fr);
-      gap: 18px;
-      align-items: stretch;
-    }
-
-    .pricing-main {
-      min-height: 330px;
-      padding: 42px;
-      border-radius: 8px;
-      border: 1px solid rgba(184, 138, 50, 0.22);
-      background:
-        linear-gradient(145deg, rgba(255,250,239,0.92), transparent 46%),
-        linear-gradient(120deg, rgba(23,87,194,0.08), transparent 52%, rgba(25,184,172,0.08)),
-        rgba(255,255,255,0.9);
-      box-shadow: 0 34px 88px rgba(48, 72, 112, 0.13);
-    }
-
-    .price-label {
-      color: var(--gold);
-      font-size: 13px;
-      font-weight: 800;
-      letter-spacing: 1.8px;
-      margin-bottom: 18px;
-    }
-
-    .price-main {
-      font-family: 'Noto Serif SC', 'Manrope', serif;
-      font-size: 64px;
-      line-height: 1;
-      color: #142646;
-      font-weight: 900;
-      letter-spacing: 0;
-      margin-bottom: 22px;
-    }
-
-    .price-note {
-      color: #52637d;
-      font-size: 17px;
-      line-height: 1.8;
-      max-width: 560px;
-    }
-
-    .price-note strong {
-      color: #1b3152;
-      font-weight: 900;
-    }
-
-    .pricing-aside {
-      display: grid;
-      gap: 12px;
-    }
-
-    .mini-stat {
-      padding: 24px;
-      border: 1px solid var(--line);
-      border-radius: 8px;
-      background: rgba(255, 255, 255, 0.86);
-      box-shadow: 0 16px 48px rgba(48, 72, 112, 0.08);
-    }
-
-    .mini-stat strong {
-      display: block;
-      color: #152746;
-      font-size: 28px;
-      margin-bottom: 8px;
-    }
-
-    .mini-stat span {
-      display: block;
-      color: var(--muted);
-      font-size: 13px;
-      font-weight: 800;
-    }
-
-    .provenance-bar {
-      display: grid;
-      grid-template-columns: auto minmax(0, 1fr);
-      gap: 4px 18px;
-      align-items: baseline;
-      margin-top: 18px;
-      padding: 18px 20px;
-      border: 1px solid rgba(197,154,87,0.3);
-      border-radius: 8px;
-      background: linear-gradient(100deg, rgba(255,250,239,0.82), rgba(255,255,255,0.62));
-    }
-
-    .provenance-label {
-      color: var(--gold);
-      font-size: 11px;
-      font-weight: 900;
-      letter-spacing: 1.6px;
-    }
-
-    .provenance-bar strong {
-      color: #183252;
-      font-size: 16px;
-    }
-
-    .provenance-bar p {
-      grid-column: 2;
-      color: var(--muted);
-      font-size: 13px;
-      line-height: 1.65;
-    }
-
-    .contact-panel {
-      display: grid;
-      grid-template-columns: minmax(0, 1fr) auto;
-      gap: 28px;
-      align-items: center;
-      padding: 34px;
-      border-radius: 8px;
-      border: 1px solid var(--line);
-      background:
-        linear-gradient(90deg, rgba(238,247,255,0.92), transparent 48%),
-        rgba(255, 255, 255, 0.88);
-      box-shadow: 0 22px 72px rgba(48, 72, 112, 0.1);
-    }
-
-    .contact-actions {
-      display: flex;
-      gap: 12px;
-      flex-wrap: wrap;
-      justify-content: flex-end;
-    }
-
-    .doc-action {
-      min-width: 230px;
-      padding: 14px 16px;
-      border-radius: 8px;
-      border: 1px solid rgba(23,87,194,0.16);
-      background: rgba(255, 255, 255, 0.9);
-      color: #152746;
-      cursor: pointer;
-      transition: transform 0.2s ease, border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
-      text-align: left;
-      box-shadow: 0 12px 34px rgba(48, 72, 112, 0.08);
-    }
-
-    .doc-action:hover {
-      transform: translateY(-2px);
-      border-color: rgba(184,138,50,0.46);
-      background: #ffffff;
-      box-shadow: 0 18px 48px rgba(48, 72, 112, 0.12);
-    }
-
-    .doc-action small {
-      display: block;
-      color: var(--soft);
-      font-size: 12px;
-      font-weight: 800;
-      margin-bottom: 4px;
-    }
-
-    .doc-action span {
-      display: block;
-      color: #152746;
-      font-size: 15px;
-      font-weight: 800;
-    }
-
-    .footer {
-      padding: 42px 0 54px;
-      border-top: 1px solid rgba(38, 63, 105, 0.1);
-      color: #7b8799;
-      font-size: 13px;
-      display: flex;
-      justify-content: space-between;
-      gap: 24px;
-    }
-
-    .fade-up {
-      opacity: 1;
-      transform: translateY(0);
-      animation: revealUp 0.72s cubic-bezier(0.2, 0.8, 0.2, 1) both;
-    }
-
-    .hero-copy { animation-delay: 0.04s; }
-    .logo-stage { animation-delay: 0.14s; }
-    .section-head { animation-delay: 0.08s; }
-    .grid-3 .fade-up:nth-child(2),
-    .model-strip .fade-up:nth-child(2) { animation-delay: 0.1s; }
-    .grid-3 .fade-up:nth-child(3),
-    .model-strip .fade-up:nth-child(3) { animation-delay: 0.16s; }
-
-    @keyframes revealUp {
-      from { opacity: 0; transform: translateY(18px); }
-      to { opacity: 1; transform: translateY(0); }
-    }
-
-    @keyframes logoFloat {
-      0%, 100% { transform: translateY(0) scale(1); }
-      50% { transform: translateY(-10px) scale(1.02); }
-    }
-
-    @media (max-width: 980px) {
-      .page { width: min(100% - 32px, 760px); }
-      .hero {
-        grid-template-columns: 1fr;
-        gap: 28px;
-        padding: 10px 0 58px;
-        min-height: auto;
-      }
-      .hero::before {
-        left: -20px;
-        right: -20px;
-        bottom: 0;
-        height: auto;
-        clip-path: polygon(0 0, 100% 0, 100% 97%, 0 100%);
-      }
-      .hero h1 { font-size: 64px; }
-      .lead { font-size: 17px; }
-      .logo-stage { min-height: 440px; order: -1; }
-      .stage-frame { width: min(390px, 88vw); }
-      .chip-a { left: 8px; top: 88px; }
-      .chip-b { right: 8px; top: 38px; }
-      .chip-c { left: 24px; bottom: 48px; }
-      .section-head,
-      .contact-panel,
-      .pricing {
-        grid-template-columns: 1fr;
-      }
-      .section-head { align-items: start; }
-      .contact-actions { justify-content: flex-start; }
-      .grid-3,
-      .model-strip {
-        grid-template-columns: 1fr;
-      }
-      .feature-card { min-height: 210px; }
-    }
-
-    @media (max-width: 1100px) {
-      .pricing { grid-template-columns: 1fr; }
-      .price-main { font-size: clamp(48px, 6vw, 64px); }
-      .signal-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
-      .signal:first-child { grid-column: 1 / -1; }
-    }
-
-    @media (max-width: 760px) {
-      .trust-strip {
-        grid-template-columns: 1fr;
-        gap: 0;
-      }
-      .signal-row {
-        grid-template-columns: 1fr;
-      }
-    }
-
-    @media (max-width: 620px) {
-      .page,
-      .hero,
-      .logo-stage { min-width: 0; }
-      .page { width: calc(100% - 28px); }
-      .hero { padding-top: 6px; padding-bottom: 32px; gap: 20px; }
-      .hero-kicker { gap: 8px; font-size: 10px; letter-spacing: 1.2px; }
-      .hero-kicker::before { width: 24px; }
-      .hero h1 { font-size: 44px; }
-      .lead { font-size: 16px; }
-      .actions { align-items: stretch; margin-bottom: 24px; }
-      .btn { width: 100%; }
-      .signal-row { grid-template-columns: 1fr; }
-      .logo-stage { min-height: 380px; }
-      .stage-frame { width: min(240px, 100%); max-width: 240px; min-width: 0; }
-      .metric-chip {
-        position: relative;
-        min-width: 0;
-        width: calc(100% - 12px);
-        justify-self: start;
-        padding: 10px 12px;
-      }
-      .metric-chip strong { font-size: 16px; }
-      .trust-proof { padding: 11px 0; }
-      .logo-stage {
-        grid-template-columns: repeat(2, minmax(0, 1fr));
-        display: grid;
-        gap: 10px 12px;
-        min-height: 0;
-        align-items: center;
-      }
-      .stage-frame {
-        grid-column: 1 / -1;
-        grid-row: 1;
-        justify-self: center;
-      }
-      .chip-a {
-        grid-column: 1;
-        grid-row: 2;
-        left: auto;
-        top: auto;
-      }
-      .chip-b {
-        grid-column: 2;
-        grid-row: 2;
-        right: auto;
-        top: auto;
-        justify-self: end;
-      }
-      .chip-c {
-        grid-column: 1 / -1;
-        grid-row: 3;
-        left: auto;
-        bottom: auto;
-        justify-self: center;
-        width: min(180px, 100%);
-      }
-      .stage-frame::after { filter: blur(8px); opacity: 0.5; }
-      .signal-row { display: none; }
-      .section { padding: 68px 0; }
-      .section-title { font-size: 32px; }
-      .pricing-main { padding: 28px; min-height: 280px; }
-      .price-main { font-size: clamp(28px, 10vw, 42px); white-space: nowrap; }
-      .provenance-bar {
-        grid-template-columns: 1fr;
-        gap: 8px;
-      }
-      .provenance-bar p { grid-column: 1; }
-      .contact-panel { padding: 24px; }
-      .doc-action { width: 100%; }
-      .footer { flex-direction: column; }
-    }
-
-    @media (max-width: 340px) {
-      .stage-frame { width: calc(100vw - 28px); }
-      .logo-stage { grid-template-columns: 1fr; }
-      .metric-chip {
-        grid-column: 1;
-        width: min(180px, 100%);
-        justify-self: center;
-      }
-      .chip-a { grid-row: 2; }
-      .chip-b { grid-row: 3; }
-      .chip-c { grid-row: 4; }
-    }
-
-    @media (prefers-reduced-motion: reduce) {
-      *,
-      *::before,
-      *::after {
-        animation-duration: 0.01ms !important;
-        animation-iteration-count: 1 !important;
-        scroll-behavior: auto !important;
-        transition-duration: 0.01ms !important;
-      }
-    }
-</style>
-<style>
-  /* Apple-inspired refinement: keep the custom home page legible beneath the
-     New API navigation and let the product proof carry the visual weight. */
   .oneinai-root {
-    --gold: #0071e3;
-    --blue: #0071e3;
-    --cyan: #0071e3;
-    --ink: #1d1d1f;
-    --muted: #6e6e73;
-    --soft: #86868b;
-    --line: rgba(0, 0, 0, 0.12);
+    --paper: #f2efe8;
+    --paper-light: #f8f6f1;
+    --ink: #1d1c1a;
+    --muted: #706d67;
+    --faint: #9c9890;
+    --line: rgba(29, 28, 26, 0.18);
+    --line-soft: rgba(29, 28, 26, 0.09);
+    --red: #ee342d;
+    --red-dark: #b92924;
+    --green: #54715a;
     display: block;
     width: 100%;
     min-height: 100vh;
-    color: #1d1d1f;
-    font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'PingFang SC', 'Microsoft YaHei', sans-serif;
-    background: linear-gradient(180deg, #ffffff 0%, #f5f5f7 58%, #f5f5f7 100%);
+    overflow: hidden;
+    color: var(--ink);
+    background: var(--paper);
+    font-family: 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', sans-serif;
+    font-size: 16px;
+    font-weight: 500;
+    line-height: 1.6;
+    text-rendering: optimizeLegibility;
+    -webkit-font-smoothing: antialiased;
   }
 
-  .oneinai-root::before,
-  .oneinai-root::after {
-    display: none;
+  .oneinai-root::before {
+    content: '';
+    position: fixed;
+    inset: 0;
+    z-index: 0;
+    pointer-events: none;
+    opacity: 0.25;
+    background-image: repeating-linear-gradient(
+      0deg,
+      rgba(29, 28, 26, 0.035) 0,
+      rgba(29, 28, 26, 0.035) 1px,
+      transparent 1px,
+      transparent 7px
+    );
+    mix-blend-mode: multiply;
+  }
+
+  .oneinai-root * {
+    box-sizing: border-box;
+  }
+
+  .oneinai-root a {
+    color: inherit;
+    text-decoration: none;
   }
 
   .page {
-    width: min(1180px, calc(100% - 40px));
+    position: relative;
+    z-index: 1;
+    width: min(1260px, calc(100% - 56px));
+    margin: 0 auto;
+  }
+
+  .masthead {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    min-height: 72px;
+    border-bottom: 1px solid var(--line);
+    gap: 32px;
+  }
+
+  .brand-lockup {
+    display: inline-flex;
+    align-items: center;
+    gap: 12px;
+    color: var(--ink);
+    font-size: 14px;
+    font-weight: 900;
+    letter-spacing: 0.12em;
+  }
+
+  .brand-mark {
+    width: 12px;
+    height: 12px;
+    background: var(--red);
+  }
+
+  .masthead-note {
+    color: var(--muted);
+    font-size: 12px;
+    letter-spacing: 0.08em;
+  }
+
+  .masthead-nav {
+    display: flex;
+    align-items: center;
+    gap: 26px;
+    color: var(--muted);
+    font-size: 13px;
+  }
+
+  .masthead-nav a {
+    position: relative;
+    padding: 8px 0;
+    transition: color 180ms ease;
+  }
+
+  .masthead-nav a::after {
+    content: '';
+    position: absolute;
+    right: 0;
+    bottom: 2px;
+    left: 0;
+    height: 1px;
+    background: var(--red);
+    transform: scaleX(0);
+    transform-origin: right center;
+    transition: transform 180ms ease;
+  }
+
+  .masthead-nav a:hover,
+  .masthead-nav a:focus-visible {
+    color: var(--ink);
+  }
+
+  .masthead-nav a:hover::after,
+  .masthead-nav a:focus-visible::after {
+    transform: scaleX(1);
+    transform-origin: left center;
   }
 
   .hero {
-    min-height: 620px;
-    gap: 72px;
-    padding: 88px 0 96px;
+    display: grid;
+    grid-template-columns: minmax(0, 1.22fr) minmax(330px, 0.78fr);
+    gap: clamp(42px, 8vw, 130px);
+    align-items: end;
+    min-height: min(790px, calc(100vh - 72px));
+    padding: clamp(76px, 10vw, 136px) 0 clamp(92px, 12vw, 156px);
+    border-bottom: 1px solid var(--line);
   }
 
-  .hero::before {
-    display: none;
+  .hero-copy {
+    max-width: 760px;
+    animation: rise-in 720ms cubic-bezier(0.2, 0.8, 0.2, 1) both;
   }
 
-  .hero-kicker {
-    color: #6e6e73;
-    letter-spacing: 1.6px;
+  .eyebrow,
+  .section-kicker,
+  .proof-label,
+  .price-label {
+    color: var(--red-dark);
+    font-size: 11px;
+    font-weight: 900;
+    letter-spacing: 0.18em;
+    line-height: 1.3;
+    text-transform: uppercase;
   }
 
-  .hero-kicker::before {
-    background: #0071e3;
+  .eyebrow {
+    display: inline-flex;
+    align-items: center;
+    gap: 12px;
+    margin-bottom: 30px;
   }
 
-  .hero h1,
-  .section-title,
-  .price-main {
-    font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'PingFang SC', 'Microsoft YaHei', sans-serif;
-    letter-spacing: 0;
+  .eyebrow::before {
+    content: '';
+    width: 42px;
+    height: 1px;
+    background: var(--red);
   }
 
   .hero h1 {
-    color: #1d1d1f;
-    font-size: clamp(56px, 6.6vw, 84px);
-    font-weight: 700;
-    line-height: 1.02;
+    max-width: 760px;
+    margin: 0 0 32px;
+    color: var(--ink);
+    font-family: 'Noto Serif SC', 'Songti SC', 'STSong', serif;
+    font-size: clamp(56px, 8.2vw, 124px);
+    font-weight: 900;
+    letter-spacing: 0;
+    line-height: 0.98;
   }
 
   .hero h1 span {
-    color: #0071e3;
-    background: none;
+    display: block;
+    color: var(--red);
   }
 
-  .lead {
-    color: #515154;
-    font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'PingFang SC', 'Microsoft YaHei', sans-serif;
-    font-size: 18px;
-    line-height: 1.75;
+  .hero-lead {
+    max-width: 550px;
+    margin: 0 0 32px;
+    color: var(--muted);
+    font-size: clamp(16px, 1.5vw, 19px);
+    line-height: 1.8;
   }
 
-  .trust-proof {
-    border-top-color: rgba(0, 0, 0, 0.16);
-    border-bottom-color: rgba(0, 0, 0, 0.08);
-    background: rgba(255, 255, 255, 0.42);
-    backdrop-filter: blur(16px) saturate(1.05);
+  .hero-lead strong {
+    color: var(--ink);
+    font-weight: 800;
   }
 
-  .trust-proof-accent {
-    border-top-color: #0071e3;
+  .hero-actions {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    gap: 12px;
+    margin-bottom: 60px;
   }
 
-  .trust-index,
-  .section-kicker,
-  .price-label,
-  .provenance-label {
-    color: #0071e3;
+  .btn {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    gap: 12px;
+    min-height: 48px;
+    padding: 0 18px;
+    border: 1px solid var(--ink);
+    border-radius: 0;
+    cursor: pointer;
+    font-size: 14px;
+    font-weight: 800;
+    line-height: 1;
+    transition: background 180ms ease, color 180ms ease, border-color 180ms ease, transform 180ms ease;
   }
 
-  .trust-proof strong,
-  .section-title,
-  .feature-name,
-  .model-title,
-  .price-main,
-  .mini-stat strong,
-  .provenance-bar strong {
-    color: #1d1d1f;
-  }
-
-  .trust-proof span:last-child,
-  .section-desc,
-  .feature-txt,
-  .model-meta,
-  .price-note,
-  .mini-stat span,
-  .provenance-bar p {
-    color: #6e6e73;
+  .btn:hover,
+  .btn:focus-visible {
+    transform: translateY(-2px);
   }
 
   .btn-primary {
-    background: #0071e3;
-    border-color: #0071e3;
-    box-shadow: 0 10px 24px rgba(0, 113, 227, 0.2);
+    color: var(--paper-light);
+    background: var(--ink);
+  }
+
+  .btn-primary:hover,
+  .btn-primary:focus-visible {
+    border-color: var(--red);
+    background: var(--red);
   }
 
   .btn-secondary {
-    color: #1d1d1f;
-    background: #ffffff;
-    border-color: #d2d2d7;
-    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.04);
-  }
-
-  .signal {
-    border-color: #d2d2d7;
-    background: rgba(255, 255, 255, 0.66);
-    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.05);
-    backdrop-filter: blur(18px) saturate(1.06);
-  }
-
-  .signal:first-child {
-    border-color: #0071e3;
-    background: #f0f6ff;
-  }
-
-  .signal:first-child strong {
-    font-size: 18px;
-    white-space: nowrap;
-  }
-
-  .signal strong,
-  .metric-chip strong {
-    color: #1d1d1f;
-  }
-
-  .signal span,
-  .metric-chip span {
-    color: #6e6e73;
-  }
-
-  .stage-frame {
-    border-color: #d2d2d7;
-    background: #ffffff;
-    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.1), inset 0 1px 0 #ffffff;
-  }
-
-  .stage-frame::before {
-    border-color: rgba(0, 113, 227, 0.12);
-    opacity: 0.58;
-  }
-
-  .stage-frame::after {
-    opacity: 0.28;
-  }
-
-  .corner {
-    border-color: rgba(0, 113, 227, 0.42);
-  }
-
-  .metric-chip {
-    border-color: #d2d2d7;
-    background: rgba(255, 255, 255, 0.58);
-    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.07), inset 0 1px 0 rgba(255,255,255,0.92);
-    backdrop-filter: blur(18px) saturate(1.08);
-    transition: transform 0.28s ease, box-shadow 0.28s ease;
-    animation: chipDrift 6s ease-in-out infinite;
-  }
-
-  .metric-chip:hover {
-    transform: translateY(-4px);
-    box-shadow: 0 18px 36px rgba(0, 0, 0, 0.1), inset 0 1px 0 rgba(255,255,255,0.96);
-  }
-
-  .chip-b { animation-delay: -1.8s; }
-  .chip-c { animation-delay: -3.6s; }
-
-  @keyframes chipDrift {
-    0%, 100% { transform: translateY(0); }
-    50% { transform: translateY(-6px); }
-  }
-
-  .stage-frame {
-    width: min(360px, 100%);
+    color: var(--ink);
     background: transparent;
-    border: 0;
-    box-shadow: none;
-    overflow: visible;
   }
 
-  .stage-frame::before,
-  .stage-frame::after,
-  .corner {
-    display: none;
+  .btn-secondary:hover,
+  .btn-secondary:focus-visible {
+    color: var(--red-dark);
+    border-color: var(--red);
   }
 
-  .hero-logo {
-    width: 68%;
-    height: 68%;
-    filter: drop-shadow(0 22px 30px rgba(0, 0, 0, 0.15));
+  .icon {
+    width: 16px;
+    height: 16px;
+    flex: 0 0 16px;
+  }
+
+  .trust-grid {
+    display: grid;
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+    max-width: 650px;
+    border-top: 1px solid var(--line);
+  }
+
+  .trust-item {
+    display: grid;
+    grid-template-columns: 34px minmax(0, 1fr);
+    gap: 12px;
+    min-height: 88px;
+    padding: 18px 18px 0 0;
+  }
+
+  .trust-item + .trust-item {
+    padding-left: 18px;
+    border-left: 1px solid var(--line);
+  }
+
+  .trust-index {
+    color: var(--red);
+    font-size: 12px;
+    font-weight: 900;
+    letter-spacing: 0.08em;
+  }
+
+  .trust-item strong {
+    display: block;
+    margin-bottom: 5px;
+    color: var(--ink);
+    font-size: 15px;
+    line-height: 1.35;
+  }
+
+  .trust-item span:last-child {
+    display: block;
+    color: var(--muted);
+    font-size: 12px;
+    line-height: 1.55;
+  }
+
+  .hero-proof {
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-end;
+    min-width: 0;
+    padding-left: clamp(24px, 4vw, 58px);
+    border-left: 1px solid var(--line);
+    animation: rise-in 720ms 120ms cubic-bezier(0.2, 0.8, 0.2, 1) both;
+  }
+
+  .proof-art {
+    position: relative;
+    display: grid;
+    place-items: center;
+    width: 100%;
+    max-width: 430px;
+    aspect-ratio: 1 / 0.94;
+    overflow: hidden;
+    background: var(--ink);
+  }
+
+  .proof-art::before,
+  .proof-art::after {
+    content: '';
+    position: absolute;
+    pointer-events: none;
+  }
+
+  .proof-art::before {
+    inset: 20px;
+    border: 1px solid rgba(242, 239, 232, 0.22);
+  }
+
+  .proof-art::after {
+    top: -18%;
+    right: 16%;
+    width: 1px;
+    height: 136%;
+    background: var(--red);
+    transform: rotate(36deg);
+    opacity: 0.9;
+  }
+
+  .proof-art img {
+    position: relative;
+    z-index: 1;
+    width: 70%;
+    height: auto;
+    object-fit: contain;
+    filter: drop-shadow(0 18px 28px rgba(0, 0, 0, 0.32));
+    transition: transform 320ms cubic-bezier(0.2, 0.8, 0.2, 1);
+  }
+
+  .proof-art:hover img {
+    transform: scale(1.04);
+  }
+
+  .proof-label {
+    position: absolute;
+    top: 34px;
+    left: 34px;
+    z-index: 2;
+    color: var(--paper-light);
+    font-size: 10px;
+  }
+
+  .proof-caption {
+    display: grid;
+    grid-template-columns: auto minmax(0, 1fr);
+    gap: 16px;
+    max-width: 430px;
+    padding-top: 16px;
+    border-bottom: 1px solid var(--line);
+    color: var(--muted);
+    font-size: 13px;
+  }
+
+  .proof-caption strong {
+    color: var(--ink);
+    font-weight: 800;
+  }
+
+  .proof-caption p {
+    margin: 0 0 16px;
+    line-height: 1.7;
+  }
+
+  .proof-caption .proof-count {
+    color: var(--red);
+    font-size: 12px;
+    font-weight: 900;
+    letter-spacing: 0.12em;
   }
 
   .section {
-    border-top-color: rgba(0, 0, 0, 0.08);
+    padding: clamp(84px, 11vw, 148px) 0;
+    border-bottom: 1px solid var(--line);
   }
 
-  .section-kicker,
-  .price-label,
-  .provenance-label {
-    letter-spacing: 1.6px;
+  .section-heading {
+    display: grid;
+    grid-template-columns: minmax(0, 1fr) minmax(280px, 0.72fr);
+    gap: 48px;
+    align-items: end;
+    margin-bottom: 48px;
   }
 
-  .feature-card,
-  .model-card,
-  .mini-stat,
-  .contact-panel,
-  .doc-action,
-  .pricing-main,
-  .provenance-bar {
-    border-color: #d2d2d7;
-    background: rgba(255, 255, 255, 0.72);
-    box-shadow: 0 12px 34px rgba(0, 0, 0, 0.04), inset 0 1px 0 #ffffff;
-    backdrop-filter: blur(16px) saturate(1.04);
+  .section-kicker {
+    margin-bottom: 18px;
   }
 
-  .feature-card::before,
-  .model-card::before {
-    display: none;
+  .section-title {
+    max-width: 700px;
+    margin: 0;
+    color: var(--ink);
+    font-family: 'Noto Serif SC', 'Songti SC', 'STSong', serif;
+    font-size: clamp(34px, 5vw, 66px);
+    font-weight: 900;
+    letter-spacing: 0;
+    line-height: 1.08;
   }
 
-  .feature-card:hover,
-  .model-card:hover,
-  .doc-action:hover {
-    border-color: #0071e3;
-    background: #ffffff;
-    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.07);
+  .section-description {
+    max-width: 430px;
+    margin: 0 0 4px;
+    color: var(--muted);
+    font-size: 15px;
+    line-height: 1.85;
   }
 
-  .card-index {
-    border-color: #d2d2d7;
-    color: #0071e3;
-    background: #f5f5f7;
+  .capability-list {
+    border-top: 1px solid var(--ink);
   }
 
-  .pricing-main {
-    background: #ffffff;
+  .capability-row {
+    display: grid;
+    grid-template-columns: 64px minmax(180px, 0.72fr) minmax(0, 1.5fr) 120px;
+    gap: 28px;
+    align-items: center;
+    min-height: 116px;
+    padding: 20px 0;
+    border-bottom: 1px solid var(--line);
+    transition: padding 220ms ease, background 220ms ease;
+  }
+
+  .capability-row:hover {
+    padding-right: 14px;
+    padding-left: 14px;
+    background: rgba(238, 52, 45, 0.055);
+  }
+
+  .row-index {
+    color: var(--red);
+    font-size: 12px;
+    font-weight: 900;
+    letter-spacing: 0.12em;
+  }
+
+  .row-title {
+    color: var(--ink);
+    font-family: 'Noto Serif SC', 'Songti SC', 'STSong', serif;
+    font-size: 21px;
+    font-weight: 900;
+  }
+
+  .row-detail {
+    max-width: 580px;
+    color: var(--muted);
+    font-size: 14px;
+    line-height: 1.75;
+  }
+
+  .row-tag {
+    justify-self: end;
+    color: var(--red-dark);
+    font-size: 10px;
+    font-weight: 900;
+    letter-spacing: 0.14em;
+    text-transform: uppercase;
+  }
+
+  .pricing-section {
+    padding-top: clamp(80px, 10vw, 126px);
+  }
+
+  .pricing-layout {
+    display: grid;
+    grid-template-columns: minmax(0, 1.2fr) minmax(260px, 0.8fr);
+    gap: clamp(38px, 9vw, 140px);
+    align-items: end;
+  }
+
+  .price-label {
+    margin-bottom: 18px;
+  }
+
+  .price-main {
+    margin: 0 0 22px;
+    color: var(--ink);
+    font-family: 'Noto Serif SC', 'Songti SC', 'STSong', serif;
+    font-size: clamp(54px, 8.6vw, 116px);
+    font-weight: 900;
+    letter-spacing: 0;
+    line-height: 0.98;
+    white-space: nowrap;
+  }
+
+  .price-note {
+    max-width: 600px;
+    margin: 0;
+    color: var(--muted);
+    font-size: 16px;
+    line-height: 1.85;
   }
 
   .price-note strong {
-    color: #0071e3;
+    color: var(--ink);
+    font-weight: 900;
   }
 
-  .provenance-bar {
-    background: #ffffff;
+  .price-facts {
+    border-top: 1px solid var(--ink);
   }
 
-  .doc-action,
-  .doc-action span {
-    color: #1d1d1f;
+  .price-fact {
+    display: grid;
+    grid-template-columns: 92px minmax(0, 1fr);
+    gap: 20px;
+    padding: 18px 0;
+    border-bottom: 1px solid var(--line);
+  }
+
+  .price-fact strong {
+    color: var(--ink);
+    font-size: 14px;
+    font-weight: 900;
+  }
+
+  .price-fact span {
+    color: var(--muted);
+    font-size: 13px;
+    line-height: 1.65;
+  }
+
+  .docs-section {
+    padding-bottom: clamp(76px, 10vw, 124px);
+  }
+
+  .docs-panel {
+    display: grid;
+    grid-template-columns: minmax(0, 1fr) auto;
+    gap: 48px;
+    align-items: end;
+    padding: clamp(32px, 5vw, 66px);
+    color: var(--paper-light);
+    background: var(--ink);
+  }
+
+  .docs-panel .section-kicker {
+    color: var(--red);
+  }
+
+  .docs-panel .section-title {
+    color: var(--paper-light);
+    font-size: clamp(34px, 5vw, 62px);
+  }
+
+  .docs-panel .section-description {
+    margin-top: 22px;
+    color: rgba(248, 246, 241, 0.64);
+  }
+
+  .doc-link {
+    display: inline-flex;
+    align-items: center;
+    gap: 18px;
+    min-width: 242px;
+    padding: 18px 0;
+    border-top: 1px solid rgba(248, 246, 241, 0.5);
+    border-bottom: 1px solid rgba(248, 246, 241, 0.5);
+    color: var(--paper-light);
+    font-size: 15px;
+    font-weight: 800;
+    transition: color 180ms ease, border-color 180ms ease, gap 180ms ease;
+  }
+
+  .doc-link:hover,
+  .doc-link:focus-visible {
+    gap: 24px;
+    color: var(--red);
+    border-color: var(--red);
+  }
+
+  .doc-link small {
+    display: block;
+    margin-bottom: 5px;
+    color: rgba(248, 246, 241, 0.54);
+    font-size: 10px;
+    font-weight: 900;
+    letter-spacing: 0.14em;
+    text-transform: uppercase;
+  }
+
+  .doc-link span {
+    display: block;
   }
 
   .footer {
-    border-top-color: rgba(0, 0, 0, 0.08);
-    color: #6e6e73;
+    display: flex;
+    justify-content: space-between;
+    gap: 24px;
+    padding: 24px 0 42px;
+    color: var(--faint);
+    font-size: 12px;
   }
 
-  @media (max-width: 980px) {
-    .hero {
-      gap: 40px;
-      padding: 64px 0 76px;
+  .footer p {
+    margin: 0;
+  }
+
+  .btn:focus-visible,
+  .masthead-nav a:focus-visible,
+  .doc-link:focus-visible {
+    outline: 2px solid var(--red);
+    outline-offset: 5px;
+  }
+
+  @keyframes rise-in {
+    from {
+      opacity: 0;
+      transform: translateY(20px);
+    }
+    to {
+      opacity: 1;
+      transform: translateY(0);
+    }
+  }
+
+  @media (max-width: 920px) {
+    .page {
+      width: min(100% - 40px, 720px);
     }
 
-    .hero::before {
+    .masthead-note {
       display: none;
     }
+
+    .hero {
+      grid-template-columns: 1fr;
+      gap: 68px;
+      min-height: auto;
+    }
+
+    .hero-proof {
+      max-width: 520px;
+      padding-left: 0;
+      border-left: 0;
+    }
+
+    .proof-art,
+    .proof-caption {
+      max-width: 520px;
+    }
+
+    .section-heading,
+    .pricing-layout {
+      grid-template-columns: 1fr;
+      gap: 24px;
+    }
+
+    .section-heading {
+      margin-bottom: 36px;
+    }
+
+    .capability-row {
+      grid-template-columns: 52px minmax(0, 1fr) 100px;
+      gap: 18px;
+    }
+
+    .row-detail {
+      grid-column: 2 / -1;
+      grid-row: 2;
+    }
+
+    .row-tag {
+      grid-column: 3;
+      grid-row: 1;
+    }
+
+    .docs-panel {
+      grid-template-columns: 1fr;
+      gap: 34px;
+    }
   }
 
   @media (max-width: 620px) {
+    .page {
+      width: calc(100% - 28px);
+    }
+
+    .masthead {
+      min-height: 64px;
+    }
+
+    .brand-lockup {
+      font-size: 13px;
+    }
+
+    .masthead-nav {
+      gap: 14px;
+      font-size: 12px;
+    }
+
+    .masthead-nav a:nth-child(2) {
+      display: none;
+    }
+
     .hero {
-      gap: 22px;
-      padding: 44px 0 54px;
+      gap: 54px;
+      padding-top: 64px;
+      padding-bottom: 82px;
+    }
+
+    .eyebrow {
+      margin-bottom: 24px;
+      font-size: 10px;
+      letter-spacing: 0.12em;
+    }
+
+    .eyebrow::before {
+      width: 26px;
     }
 
     .hero h1 {
-      font-size: 44px;
+      margin-bottom: 24px;
+      font-size: clamp(48px, 14vw, 76px);
     }
 
-    .lead {
-      font-size: 16px;
+    .hero-lead {
+      font-size: 15px;
+      line-height: 1.78;
     }
 
-    .stage-frame {
-      width: 240px;
-      max-width: 240px;
+    .hero-actions {
+      align-items: stretch;
+      margin-bottom: 42px;
+    }
+
+    .btn {
+      flex: 1 1 100%;
+      width: 100%;
+    }
+
+    .trust-grid {
+      grid-template-columns: 1fr;
+    }
+
+    .trust-item {
+      min-height: 76px;
+      padding: 16px 0;
+    }
+
+    .trust-item + .trust-item {
+      padding-left: 0;
+      border-top: 1px solid var(--line);
+      border-left: 0;
+    }
+
+    .proof-art::before {
+      inset: 14px;
+    }
+
+    .proof-label {
+      top: 26px;
+      left: 26px;
     }
 
     .section {
-      padding: 72px 0;
+      padding: 76px 0;
+    }
+
+    .section-heading {
+      margin-bottom: 32px;
+    }
+
+    .section-title {
+      font-size: 37px;
+    }
+
+    .section-description {
+      font-size: 14px;
+    }
+
+    .capability-row {
+      grid-template-columns: 38px minmax(0, 1fr);
+      gap: 12px;
+      padding: 18px 0;
+    }
+
+    .row-title {
+      font-size: 19px;
+    }
+
+    .row-detail {
+      grid-column: 2;
+      grid-row: 2;
+      font-size: 13px;
+    }
+
+    .row-tag {
+      display: none;
+    }
+
+    .price-main {
+      overflow-wrap: anywhere;
+      font-size: clamp(48px, 14vw, 70px);
+      white-space: normal;
+    }
+
+    .price-note {
+      font-size: 14px;
+    }
+
+    .price-fact {
+      grid-template-columns: 82px minmax(0, 1fr);
+      gap: 14px;
+    }
+
+    .docs-panel {
+      padding: 30px 24px;
+    }
+
+    .docs-panel .section-title {
+      font-size: 38px;
+    }
+
+    .doc-link {
+      min-width: 0;
+      width: 100%;
+    }
+
+    .footer {
+      flex-direction: column;
+      gap: 8px;
     }
   }
 
-  @media (max-width: 340px) {
-    .stage-frame {
-      width: 240px;
-      max-width: 240px;
+  @media (prefers-reduced-motion: reduce) {
+    .oneinai-root *,
+    .oneinai-root *::before,
+    .oneinai-root *::after {
+      animation-duration: 0.01ms !important;
+      animation-iteration-count: 1 !important;
+      scroll-behavior: auto !important;
+      transition-duration: 0.01ms !important;
     }
   }
 </style>
+
 <div class='oneinai-root'>
   <main class='page' id='top'>
+    <header class='masthead'>
+      <a class='brand-lockup' href='https://www.oneinai.com/' target='_blank' rel='noopener'>
+        <span class='brand-mark' aria-hidden='true'></span>
+        <span>ONEINAI</span>
+      </a>
+      <span class='masthead-note'>MODEL ACCESS / PRODUCTION READY</span>
+      <nav class='masthead-nav' aria-label='页面导航'>
+        <a href='#capability'>能力</a>
+        <a href='#pricing'>计价</a>
+        <a href='#docs'>文档</a>
+      </nav>
+    </header>
+
     <section class='hero'>
-      <div class='hero-copy fade-up'>
-        <div class='hero-kicker'>MODEL SUPPLY / ENTERPRISE ACCESS</div>
-        <h1>企业级 <span>AI 模型网关</span></h1>
-        <p class='lead'>本站所有模型均通过一手正规渠道采购，来源清晰可追溯；充值按 1 CNY = 1 USD 计价，让企业从接入到对账都保持透明。</p>
-        <div class='trust-strip'>
-          <div class='trust-proof'>
+      <div class='hero-copy'>
+        <div class='eyebrow'>ONEINAI / API GATEWAY</div>
+        <h1>模型接入，<span>回到基础设施。</span></h1>
+        <p class='hero-lead'><strong>一个入口，连接多种模型。</strong> 从请求转发、密钥管理到用量对账，把复杂的模型调用交给一套清晰、稳定、可追溯的基础设施。</p>
+        <div class='hero-actions'>
+          <a href='https://api.oneinai.com/register' target='_blank' rel='noopener' class='btn btn-primary'>
+            <span>开始使用</span>
+            <svg class='icon' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' aria-hidden='true'>
+              <path d='M5 12h14'></path>
+              <path d='m13 6 6 6-6 6'></path>
+            </svg>
+          </a>
+          <a href='https://www.oneinai.com/' target='_blank' rel='noopener' class='btn btn-secondary'>
+            <span>了解 ONEINAI</span>
+            <svg class='icon' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' aria-hidden='true'>
+              <path d='M14 3h7v7'></path>
+              <path d='M10 14 21 3'></path>
+              <path d='M21 14v5a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5'></path>
+            </svg>
+          </a>
+        </div>
+        <div class='trust-grid'>
+          <div class='trust-item'>
             <span class='trust-index'>01</span>
             <div>
               <strong>一手正规渠道采购</strong>
               <span>模型来源清晰，可追溯</span>
             </div>
           </div>
-          <div class='trust-proof trust-proof-accent'>
+          <div class='trust-item'>
             <span class='trust-index'>02</span>
             <div>
               <strong>1 CNY = 1 USD</strong>
@@ -1225,110 +912,92 @@
             </div>
           </div>
         </div>
-        <div class='actions'>
-          <a href='https://api.oneinai.com/register' target='_blank' rel='noopener' class='btn btn-primary'>立即构建</a>
-          <a href='https://www.oneinai.com/' target='_blank' rel='noopener' class='btn btn-secondary'>前往官网</a>
-        </div>
-        <div class='signal-row'>
-          <div class='signal'>
-            <strong>1 CNY = 1 USD</strong>
-            <span>充值计价规则</span>
-          </div>
-          <div class='signal'>
-            <strong>多模型</strong>
-            <span>本站所有模型</span>
-          </div>
-          <div class='signal'>
-            <strong>可追溯</strong>
-            <span>采购与用量链路</span>
-          </div>
-        </div>
       </div>
 
-      <div class='logo-stage fade-up'>
-        <div class='stage-frame' aria-label='ONEINAI 品牌标识'>
-          <span class='corner tl'></span>
-          <span class='corner tr'></span>
-          <span class='corner bl'></span>
-          <span class='corner br'></span>
-          <img class='hero-logo' src='https://minio.oneinai.com/oneinai/images/logo/oneinai(800x800).png' alt='ONEINAI Logo' loading='eager'>
+      <div class='hero-proof'>
+        <div class='proof-art' aria-label='ONEINAI 品牌标识'>
+          <span class='proof-label'>ONEINAI / 2026</span>
+          <img src='https://minio.oneinai.com/oneinai/images/logo/oneinai(800x800).png' alt='ONEINAI Logo' loading='eager'>
         </div>
-        <div class='metric-chip chip-a'>
-          <strong>一手</strong>
-          <span>正规渠道采购</span>
-        </div>
-        <div class='metric-chip chip-b'>
-          <strong>1:1</strong>
-          <span>充值计价比例</span>
-        </div>
-        <div class='metric-chip chip-c'>
-          <strong>可追溯</strong>
-          <span>模型来源链路</span>
+        <div class='proof-caption'>
+          <span class='proof-count'>01—03</span>
+          <p><strong>同一套入口，三件事被放回秩序里：</strong>接入、计价、追踪。</p>
         </div>
       </div>
     </section>
 
     <section class='section' id='capability'>
-      <div class='section-head fade-up'>
+      <div class='section-heading'>
         <div>
-          <div class='section-kicker'>CAPABILITY</div>
-          <h2 class='section-title'>为生产环境设计的模型网关</h2>
+          <div class='section-kicker'>CAPABILITY / 01</div>
+          <h2 class='section-title'>把复杂调用，压缩成一个入口。</h2>
         </div>
-        <p class='section-desc'>从账户、额度、密钥到请求转发，ONEINAI 将复杂模型能力收束为统一、清晰、可追踪的工程入口。</p>
+        <p class='section-description'>从账户、额度、密钥到请求转发，ONEINAI 将分散的模型能力整理为一套更适合生产环境的调用路径。</p>
       </div>
 
-      <div class='grid-3'>
-        <article class='feature-card fade-up'>
-          <div class='card-index'>01</div>
-          <h3 class='feature-name'>全球边缘加速</h3>
-          <p class='feature-txt'>智能路由请求至更近、更稳的线路，降低跨境调用中的抖动，保持关键业务响应流畅。</p>
+      <div class='capability-list'>
+        <article class='capability-row'>
+          <span class='row-index'>01</span>
+          <h3 class='row-title'>全球边缘加速</h3>
+          <p class='row-detail'>将请求路由至更近、更稳的线路，降低跨境调用中的抖动，让关键业务保持连续响应。</p>
+          <span class='row-tag'>ROUTING</span>
         </article>
-        <article class='feature-card fade-up'>
-          <div class='card-index'>02</div>
-          <h3 class='feature-name'>透明成本控制</h3>
-          <p class='feature-txt'>统一计价规则、清晰账单与用量记录，让团队可以按业务节奏规划模型预算。</p>
+        <article class='capability-row'>
+          <span class='row-index'>02</span>
+          <h3 class='row-title'>透明成本控制</h3>
+          <p class='row-detail'>统一计价规则、清晰账单与用量记录，让模型预算可以被看见、被核对，也被持续规划。</p>
+          <span class='row-tag'>BILLING</span>
         </article>
-        <article class='feature-card fade-up'>
-          <div class='card-index'>03</div>
-          <h3 class='feature-name'>企业级安全</h3>
-          <p class='feature-txt'>密钥分层管理、请求链路加密、服务状态监控，减少集成风险，支撑稳定上线。</p>
+        <article class='capability-row'>
+          <span class='row-index'>03</span>
+          <h3 class='row-title'>企业级安全</h3>
+          <p class='row-detail'>密钥分层管理、请求链路加密与服务状态监控，减少集成风险，支撑稳定上线。</p>
+          <span class='row-tag'>CONTROL</span>
         </article>
       </div>
     </section>
 
-    <section class='section' id='pricing'>
-      <div class='pricing fade-up'>
-        <div class='pricing-main'>
-          <div class='price-label'>ENTERPRISE PRICING</div>
+    <section class='section pricing-section' id='pricing'>
+      <div class='pricing-layout'>
+        <div>
+          <div class='price-label'>PRICING / CLEAR BY DESIGN</div>
           <div class='price-main'>1 CNY = 1 USD</div>
-          <p class='price-note'>充值按 <strong>1 CNY = 1 USD</strong> 统一计价；模型额度来自一手正规渠道采购，规则清晰、账单可核对。</p>
+          <p class='price-note'>充值按 <strong>1 CNY = 1 USD</strong> 统一计价；模型额度来自一手正规渠道采购，规则清晰，账单可核对。</p>
         </div>
-        <div class='pricing-aside'>
-          <div class='mini-stat'>
+        <div class='price-facts'>
+          <div class='price-fact'>
             <strong>一手采购</strong>
-            <span>模型来源清晰可追溯，方便企业核验</span>
+            <span>模型来源清晰可追溯，方便企业核验。</span>
           </div>
-          <div class='mini-stat'>
+          <div class='price-fact'>
             <strong>透明对账</strong>
-            <span>统一计价规则，便于预算与用量管理</span>
+            <span>统一计价规则，便于预算与用量管理。</span>
+          </div>
+          <div class='price-fact'>
+            <strong>统一入口</strong>
+            <span>接入路径保持一致，迁移成本更低。</span>
           </div>
         </div>
       </div>
     </section>
 
-    <section class='section' id='docs'>
-      <div class='contact-panel fade-up'>
+    <section class='section docs-section' id='docs'>
+      <div class='docs-panel'>
         <div>
-          <div class='section-kicker'>DOCUMENTATION</div>
-          <h2 class='section-title'>阅读 ONEINAI 文档</h2>
-          <p class='section-desc'>查看模型接入、密钥配置、接口调用和迁移说明，快速完成 NewAPI 生产环境集成。</p>
+          <div class='section-kicker'>DOCUMENTATION / NEXT STEP</div>
+          <h2 class='section-title'>从文档开始，<br>让系统开始工作。</h2>
+          <p class='section-description'>查看模型接入、密钥配置、接口调用和迁移说明，快速完成 NewAPI 生产环境集成。</p>
         </div>
-        <div class='contact-actions'>
-          <a class='doc-action' href='https://docs.oneinai.com/' target='_blank' rel='noopener'>
+        <a class='doc-link' href='https://docs.oneinai.com/' target='_blank' rel='noopener'>
+          <span>
             <small>文档地址</small>
             <span>docs.oneinai.com</span>
-          </a>
-        </div>
+          </span>
+          <svg class='icon' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' aria-hidden='true'>
+            <path d='M7 17 17 7'></path>
+            <path d='M7 7h10v10'></path>
+          </svg>
+        </a>
       </div>
     </section>
 
@@ -1337,5 +1006,4 @@
       <p>High-Performance API Infrastructure</p>
     </footer>
   </main>
-
 </div>