@media (prefers-reduced-motion:no-preference){body{animation:evPageIn .18s ease-out}@keyframes evPageIn{from{opacity:0}}}
.menu-toggle{display:none;background:none;border:0;cursor:pointer;flex-direction:column;gap:5px;padding:8px;z-index:22}
.menu-toggle span{display:block;width:20px;height:1.5px;background:rgba(255,255,255,.84);border-radius:1px;transition:transform .25s,opacity .25s}
.menu-toggle.active span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.menu-toggle.active span:nth-child(2){opacity:0}
.menu-toggle.active span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
@media (max-width:720px){
.menu-toggle{display:flex}
.navbar .menu{display:flex;position:fixed;top:0;left:0;width:100vw;height:100vh;height:100dvh;background:rgba(13,17,23,.96);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);flex-direction:column;align-items:center;justify-content:center;gap:40px;z-index:21;transform:translateY(-100%);transition:transform .4s cubic-bezier(.22,1,.36,1)}
.navbar .menu.open{transform:translateY(0)}
.navbar .menu a{font-size:24px}
}
@media (prefers-reduced-motion:reduce){
.navbar .menu{transition:none}
.menu-toggle span{transition:none}
}
.footer::before{content:"";display:block;height:1px;background:linear-gradient(to right,transparent,rgba(255,255,255,.08) 20%,rgba(255,255,255,.12) 50%,rgba(255,255,255,.08) 80%,transparent)}
.footer-status{display:flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:12px;letter-spacing:.1em;color:rgba(255,255,255,.5);margin-top:20px}
.footer-status-dot{width:6px;height:6px;border-radius:50%;background:#2DD4BF}
.footer-bottom span[aria-hidden="true"]{display:none}
@media (max-width:720px){.footer-bottom{justify-content:center}}
.menu a{position:relative}
.menu a::after{content:'';position:absolute;bottom:-2px;left:50%;width:0;height:2px;background:#2DD4BF;transition:width .3s,left .3s}
.menu a:hover::after{width:100%;left:0}
@media (max-width:900px){
.footer-top{flex-direction:column;gap:48px;padding:56px 0 40px}
.footer-cols{flex-wrap:wrap;gap:40px}
.footer-inner{padding:0 32px}
}
body{text-rendering:auto}
.logo-mark, .logo-mark circle, .logo-mark path { color: inherit; }
.logo .logo-mark, .footer-logo .logo-mark { color: var(--text-primary); }
@media (max-width: 810px) {
.footer-bottom { justify-content: flex-start !important; text-align: left !important; }
}
@media (max-width: 1024px) {
.footer-inner { padding-left: 40px !important; padding-right: 40px !important; }
}
@media (max-width: 720px) {
.footer-inner { padding-left: 20px !important; padding-right: 20px !important; }
}
@media (min-width: 811px) {
.footer-top {
display: grid;
grid-template-columns: 1.6fr 1fr 1fr 1fr;
gap: 64px;
align-items: start;
}
.footer-brand { flex: none; width: auto; min-width: 0; }
.footer-cols  { display: contents; }
.footer-col   { width: auto; min-width: 0; }
}
.footer-bottom {
max-width: 1440px;
margin-left: auto;
margin-right: auto;
padding-left: 80px;
padding-right: 80px;
box-sizing: border-box;
}
@media (max-width: 1024px) {
.footer-bottom { padding-left: 40px; padding-right: 40px; }
}
@media (max-width: 720px) {
.footer-bottom { padding-left: 20px; padding-right: 20px; }
}
[data-theme="light"] footer .footer-status,
[data-theme="light"] footer .footer-status *,
[data-theme="light"] footer h4,
[data-theme="light"] footer .footer-col h4, [data-theme="light"] footer .footer-col h3,
[data-theme="light"] footer .footer-title,
[data-theme="light"] footer .footer-brand p,
[data-theme="light"] footer .footer-inner p,
[data-theme="light"] footer .footer-brand-info p { color: rgba(0, 0, 0, 0.62) !important; }
[data-theme="light"] footer a:link,
[data-theme="light"] footer a:visited,
[data-theme="light"] footer a,
[data-theme="light"] .footer-bottom a:link,
[data-theme="light"] .footer-bottom a:visited,
[data-theme="light"] .footer-bottom a,
[data-theme="light"] .footer-bottom span,
[data-theme="light"] .footer-bottom,
[data-theme="light"] footer .footer-col a:link,
[data-theme="light"] footer .footer-col a:visited,
[data-theme="light"] footer .meta,
[data-theme="light"] footer code { color: rgba(0, 0, 0, 0.7) !important; }
[data-theme="light"] footer a:hover,
[data-theme="light"] .footer-bottom a:hover { color: rgba(0, 0, 0, 0.95) !important; }
[data-theme="light"] .footer-status-dot { background: #0F766E !important; }
[data-theme="light"] footer, [data-theme="light"] #v2 footer { border-top-color: var(--line) !important; }
[data-theme="light"] { --w-55: rgba(0, 0, 0, 0.62) !important; }
.footer-bottom {
justify-content: flex-start !important;
text-align: left !important;
gap: 8px !important;
flex-wrap: wrap;
}
.footer-bottom span[aria-hidden="true"] { display: inline !important; }
.footer-bottom a { text-decoration: none; }
.footer-bottom a:hover { text-decoration: underline; }
@media (max-width: 720px) {
.footer-bottom { gap: 6px !important; }
}
.footer-bottom .beian-gongan {
display: inline-flex; align-items: center; gap: 4px;
text-decoration: none; white-space: nowrap;
}
.footer-bottom .beian-gongan img {
width: 13px; height: 14px; display: block; flex: none;
filter: none;
}
.footer-bottom .beian-gongan:hover { text-decoration: underline; }
.footer-bottom .beian-gongan:hover img { text-decoration: none; }
#v2{
--fs-h1:80px; --ls-h1:-.05em; --lh-h1:1;
--fs-h2:64px; --ls-h2:-.04em; --lh-h2:1;
--fs-h3:32px; --ls-h3:-.02em; --lh-h3:1.2;
--fs-body:16px; --ls-body:-.02em; --lh-body:1.6;
--fs-eyebrow:18px; --ls-eyebrow:.06em; --lh-eyebrow:24px;
--fs-small:14px; --ls-small:-.01em;
--w-page:1344px; --w-text:720px;
--pad-section:120px; --pad-section-sm:60px;
--gap-20:20px; --gap-30:30px; --gap-40:40px;
--r-card:16px; --r-sm:4px; --r-pill:100px;
--bg:#FFFFFF; --bg-card:#F3F4F6; --bg-card-60:rgba(243,244,246,.6);
--bg-dark:#030712;
--tx:#111827; --tx-2:#4B5563; --tx-3:#69707E; --tx-4:#D1D5DB;
--tx-on-dark:#FFFFFF; --tx-on-dark-2:rgba(255,255,255,.6);
--brand:#224EEE; --brand-2:#1D4ED8; --accent:#38BDF8;
--line:#E5E7EB;
--sh-1:0 2px 4px rgba(0,0,0,.06);
--sh-2:0 2px 8px rgba(0,0,0,.08);
}#v2 *{box-sizing:border-box}#v2{scroll-behavior:smooth}#v2{margin:0;background:var(--bg);color:var(--tx);
font-family:var(--font-body);
font-size:var(--fs-body);font-weight:500;line-height:var(--lh-body);letter-spacing:var(--ls-body);
-webkit-font-smoothing:antialiased}#v2 a{color:inherit;text-decoration:none}#v2 button{font:inherit}#v2 .page{max-width:var(--w-page);margin:0 auto;padding:0 40px}#v2 .spec-bar{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.9);backdrop-filter:blur(16px);
border-bottom:1px solid var(--line);padding:9px 40px;display:flex;align-items:center;gap:12px;
flex-wrap:wrap;font-size:var(--fs-small);letter-spacing:var(--ls-small);color:var(--tx-3)}#v2 .spec-bar b{color:var(--brand);font-weight:600}#v2 .spec-bar .k{font-family:ui-monospace,Menlo,monospace;color:var(--brand-2);font-size:12px}#v2 .spec-bar a{color:var(--brand-2);border-bottom:1px solid rgba(45,102,248,.3)}#v2 nav{display:flex;align-items:center;height:72px;border-bottom:1px solid var(--line);background:var(--bg)}#v2 nav .in{display:flex;align-items:center;gap:var(--gap-40);width:100%}#v2 nav .brand{font-size:18px;font-weight:600;letter-spacing:-.02em;display:flex;align-items:center;gap:9px}#v2 nav .brand i{width:9px;height:9px;border-radius:var(--r-sm);background:var(--brand);display:block}#v2 nav .links{display:flex;gap:24px;margin-left:auto;font-size:var(--fs-body);color:var(--tx-3)}#v2 nav .links a:hover{color:var(--tx)}#v2 nav .cta{background:var(--brand);color:#fff;border-radius:var(--r-sm);padding:10px 18px;
font-size:var(--fs-small);font-weight:600}#v2 nav .cta:hover{background:var(--brand-2)}#v2 section{padding:var(--pad-section) 0}#v2 section.sm{padding:var(--pad-section-sm) 0}#v2 .eyebrow{font-size:var(--fs-eyebrow);font-weight:500;line-height:var(--lh-eyebrow);
letter-spacing:var(--ls-eyebrow);color:var(--tx-2);margin-bottom:var(--gap-20);text-transform:uppercase}#v2 h1{font-size:clamp(40px,6vw,var(--fs-h1));font-weight:500;line-height:var(--lh-h1);
letter-spacing:var(--ls-h1);margin:0;max-width:15ch}#v2 h2{font-size:clamp(30px,4.6vw,var(--fs-h2));font-weight:500;line-height:var(--lh-h2);
letter-spacing:var(--ls-h2);margin:0;max-width:18ch}#v2 h3{font-size:clamp(20px,2.4vw,var(--fs-h3));font-weight:500;line-height:var(--lh-h3);
letter-spacing:var(--ls-h3);margin:0}#v2 h4{font-size:24px;font-weight:500;line-height:1.3;letter-spacing:-.01em;margin:0}#v2 .lead{font-size:var(--fs-body);font-weight:500;line-height:var(--lh-body);letter-spacing:var(--ls-body);
color:var(--tx-3);max-width:var(--w-text);margin:var(--gap-20) 0 0}#v2 .small{font-size:var(--fs-small);line-height:1.5;letter-spacing:var(--ls-small);
color:var(--tx-3);max-width:var(--w-text);margin:var(--gap-20) 0 0}#v2
.hero{background:var(--bg-dark);color:var(--tx-on-dark);padding:120px 0 80px}#v2 .hero .hd{max-width:820px;margin:0 auto;display:flex;flex-direction:column;gap:24px}#v2 .hero .eyebrow{color:var(--tx-on-dark-2)}#v2 .hero h1{color:#fff;max-width:16ch}#v2 .hero h1 .accent{color:var(--accent)}#v2 .hero .lead{color:var(--tx-on-dark-2);max-width:600px}#v2
.ask{margin-top:44px;max-width:820px;width:100%}#v2 .ask .box{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.14);
border-radius:var(--r-card);padding:16px 16px 12px;transition:border-color .2s,box-shadow .2s}#v2
.ask .box:focus-within{border-color:rgba(56,189,248,.55);box-shadow:0 0 0 3px rgba(56,189,248,.18)}#v2 .ask textarea{width:100%;background:transparent;border:none;outline:none;resize:none;
color:rgba(255,255,255,.92);font-family:inherit;font-size:18px;line-height:1.6;
letter-spacing:var(--ls-body);padding:2px;display:block;max-height:148px}#v2 .ask textarea::placeholder{color:rgba(255,255,255,.55)}#v2 .ask .row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:6px}#v2 .ask .hint{font-size:12px;color:rgba(255,255,255,.55);letter-spacing:.01em}#v2 .ask .send{width:36px;height:36px;flex:none;border-radius:50%;border:none;background:var(--accent);
color:#030712;display:flex;align-items:center;justify-content:center;cursor:pointer;
transition:background .2s,transform .2s,opacity .2s}#v2 .ask .send:not(:disabled):hover{background:#7DD3FC;transform:translateY(-1px)}#v2 .ask .send:disabled{background:rgba(255,255,255,.18);opacity:.4;cursor:default}#v2 .ask .send svg{width:16px;height:16px}#v2 .ask .ok{display:none;font-size:14px;line-height:1.6;color:rgba(255,255,255,.9);padding:4px 2px}#v2 .ask.done form{display:none}#v2 .ask.done .ok{display:block}#v2
.ask .examples{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}#v2 .ask .examples button{background:transparent;border:1px solid rgba(255,255,255,.18);
color:rgba(255,255,255,.7);border-radius:var(--r-pill);padding:7px 14px;font-size:13px;
cursor:pointer;transition:border-color .2s,color .2s,background .2s}#v2 .ask .examples button:hover{border-color:rgba(255,255,255,.45);color:#fff;background:rgba(255,255,255,.06)}#v2
.stats{border-top:1px solid var(--line);border-bottom:1px solid var(--line);
display:grid;grid-template-columns:repeat(4,1fr);margin-top:var(--gap-40)}#v2 .stat{padding:44px 0 40px;border-left:1px solid var(--line)}#v2 .stat:first-child{border-left:none}#v2 .stat b{display:block;font-size:56px;font-weight:500;line-height:.95;letter-spacing:-.045em}#v2 .stat span{display:block;margin-top:14px;font-size:var(--fs-small);letter-spacing:var(--ls-small);color:var(--tx-3);max-width:20ch}#v2 .stat em{font-style:normal;color:var(--brand)}#v2
.cap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.86fr);gap:80px;align-items:start}#v2 .evidence{border-left:2px solid var(--accent);padding:6px 0 6px 22px;
font-family:ui-monospace,Menlo,monospace;font-size:13.5px;line-height:2.1;color:var(--tx-3)}#v2 .evidence div{display:flex;gap:12px}#v2 .evidence i{color:var(--brand);font-style:normal;min-width:78px}#v2
.trust{text-align:center;background:var(--bg-card-60)}#v2 .trust h2{margin:0 auto;max-width:20ch}#v2 .trust .lead{margin-left:auto;margin-right:auto;text-align:center}#v2
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap-20);margin-top:var(--gap-40)}#v2 .card{background:var(--bg);border:1px solid var(--line);border-radius:var(--r-card);
padding:24px 24px 28px;display:flex;flex-direction:column;gap:16px;min-height:230px;transition:transform .25s cubic-bezier(.22,1,.36,1),box-shadow .25s}#v2 .card:hover{transform:translateY(-3px);}#v2 .card .tag{font-family:ui-monospace,Menlo,monospace;font-size:12px;letter-spacing:.06em;color:var(--brand-2)}#v2 .card h4, #v2 .card h3{margin:0;font-size:24px;font-weight:500;line-height:1.3;letter-spacing:-.01em}#v2 .card p{margin:0;font-size:var(--fs-small);line-height:1.55;letter-spacing:var(--ls-small);color:var(--tx-3)}#v2 .card .meta{margin-top:auto;font-family:ui-monospace,Menlo,monospace;font-size:12px;color:var(--tx-2)}#v2 .card:hover .meta{color:var(--brand)}#v2
.mech{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);
border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden;margin-top:var(--gap-40)}#v2 .mech div{background:var(--bg-card);padding:34px 28px}#v2 .mech b{display:block;font-family:ui-monospace,Menlo,monospace;font-size:12px;
letter-spacing:.08em;color:var(--brand);margin-bottom:16px}#v2 .mech h4, #v2 .mech h3{margin:0 0 10px;font-size:17px;font-weight:500;letter-spacing:-.016em}#v2 .mech p{margin:0;font-size:var(--fs-small);line-height:1.55;letter-spacing:var(--ls-small);color:var(--tx-3)}#v2
.rule{height:1px;background:var(--line);margin:0}#v2 .glyph{display:block;color:var(--line);margin:0 0 28px}#v2
.final{background:var(--bg-dark);color:var(--tx-on-dark);text-align:center}#v2 .final h2{margin:0 auto;max-width:16ch;color:#fff}#v2 .final .lead{color:var(--tx-on-dark-2);margin-left:auto;margin-right:auto;text-align:center;max-width:520px}#v2 .final .ctas{display:flex;gap:12px;justify-content:center;margin-top:36px;flex-wrap:wrap}#v2 .btn{display:inline-flex;align-items:center;gap:8px;border-radius:var(--r-sm);padding:14px 22px;
font-size:var(--fs-body);font-weight:600;letter-spacing:var(--ls-body);
transition:transform .2s cubic-bezier(.22,1,.36,1),background .2s,border-color .2s}#v2 .btn-primary{background:var(--brand);color:#fff}#v2 .btn-primary:hover{transform:translateY(-1px);background:var(--brand-2)}#v2 .btn-on-dark{border:1px solid rgba(255,255,255,.28);color:#fff}#v2 .btn-on-dark:hover{border-color:#fff;background:rgba(255,255,255,.08)}#v2 .spec{margin:0 auto;max-width:var(--w-page);padding:0 40px 80px}#v2 .spec table{border-collapse:collapse;width:100%;font-size:13.5px;letter-spacing:var(--ls-small)}#v2 .spec th, #v2 .spec td{text-align:left;padding:9px 12px;border-bottom:1px solid var(--line);vertical-align:top}#v2 .spec th{color:var(--tx-3);font-weight:500;font-size:12px;text-transform:uppercase;letter-spacing:.08em}#v2 .spec td:first-child{color:var(--tx-3);white-space:nowrap;width:1%}#v2 .spec code{font-family:ui-monospace,Menlo,monospace;font-size:12.5px;color:var(--brand-2)}#v2 footer{background:var(--bg-card);border-top:1px solid var(--line);padding:36px 0}#v2 footer .page{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;
font-size:var(--fs-small);letter-spacing:var(--ls-small);color:var(--tx-3)}#v2 @media (max-width:1200px){.page{padding:0 32px}#v2 .hero{padding:100px 0 70px}#v2 .grid3{grid-template-columns:repeat(2,1fr)}#v2 }
@media (max-width:810px){
.page{padding:0 22px}#v2 section{padding:80px 0}#v2 .cap{grid-template-columns:1fr;gap:36px}#v2 .stats{grid-template-columns:repeat(2,1fr)}#v2 .stat{padding:34px 0 30px;border-left:none;border-top:1px solid var(--line)}#v2 .stat:nth-child(-n+2){border-top:none}#v2 .grid3, #v2 .mech{grid-template-columns:1fr}#v2 nav .links{display:none}#v2 .hero{padding:80px 0 90px}#v2 .spec{padding:0 22px 60px}#v2 .spec-bar{padding:9px 22px}#v2 .stat b{font-size:42px}#v2 }
#v2 .feat{list-style:none;padding:0;margin:var(--gap-20) 0 0;display:grid;gap:12px}#v2 #v2 .feat li{display:flex;gap:12px;align-items:flex-start;color:var(--tx-3);font-size:var(--fs-body);line-height:var(--lh-body)}#v2 #v2 .feat li::before{content:"✓";color:var(--brand-2);flex:none;font-weight:600}#v2 .faq{margin-top:var(--gap-40);display:grid;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden}#v2 .faq details{background:var(--bg);padding:15px 18px}#v2 .faq summary{cursor:pointer;color:var(--tx);font-weight:600;font-size:var(--fs-body);list-style:none;display:flex;justify-content:space-between;gap:12px}#v2 .faq summary::-webkit-details-marker{display:none}#v2 .faq summary::after{content:"+";color:var(--tx-2);flex:none}#v2 .faq details[open] summary::after{content:"–"}#v2 .faq p{margin:12px 0 0;color:var(--tx-3);font-size:var(--fs-small);line-height:1.65;max-width:none}#v2 .pathbox{background:var(--bg-card-60);border:1px solid var(--line);border-radius:var(--r-card);padding:18px;display:block}#v2 .pathbox .k{font-family:ui-monospace,Menlo,monospace;font-size:11px;letter-spacing:.08em;color:#4B5563}#v2 .pathbox .t{display:block;margin-top:8px;color:var(--tx);font-weight:600}#v2 .pathbox .d{display:block;margin-top:6px;color:var(--tx-3);font-size:var(--fs-small);line-height:1.6}
#v2 .hero::before,#v2 .hero::after{content:none!important;display:none!important;
background:none!important;box-shadow:none!important}
#v2 .hero{display:block!important;min-height:0!important;
align-items:initial!important;justify-content:initial!important}
#v2 .eyebrow::before{content:none!important;display:none!important}
#v2 .motif-node,#v2 .motif-seq,#v2 .motif-arrow,.motif-node,.motif-seq,.motif-arrow{display:none!important}
#v2 .trial{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
border:none!important;border-radius:0!important;padding:0!important;
background:none!important;width:100%!important;box-shadow:none!important}
#v2 .trial:focus-within{border:none!important;box-shadow:none!important}
#v2 .trial.success{border:none!important;background:none!important}
#v2 .hero .tagline,#v2 .tagline{text-align:left!important}
#v2 .prose-body table {
display: block; max-width: 100%; overflow-x: auto;
-webkit-overflow-scrolling: touch; box-sizing: border-box;
}
@media (max-width: 810px) {
#v2 .prose-body th, #v2 .prose-body td { white-space: nowrap; font-size: 14px; padding: 10px 12px; }
}
#v2 figure, #v2 .fig {
background: #F9FAFB !important; border: 1px solid var(--line) !important;
border-radius: var(--r-card); padding: 32px; margin: 40px 0;
max-width: 100% !important;
}
#v2 figure *, #v2 .fig * { color: var(--tx-3); }
#v2 figure strong, #v2 .fig strong, #v2 figure h4, #v2 .fig h4 { color: var(--tx); }
#v2 figcaption { color: var(--tx-3) !important; font-size: 14px; margin-top: 16px; }
#v2 pre, #v2 .prose-body pre {
background: #F3F4F6; border: 1px solid var(--line); border-radius: 8px;
padding: 20px 24px; margin: 24px 0; max-width: 100%; box-sizing: border-box;
overflow-x: auto; -webkit-overflow-scrolling: touch;
font-family: "JetBrains Mono", ui-monospace, monospace;
font-size: 13px; line-height: 1.7; color: var(--tx);
white-space: pre; word-break: normal;
}
#v2 .prose-body code {
overflow-wrap: anywhere; word-break: break-word; max-width: 100%;
}
#v2 .prose-body > pre { max-width: 100% !important; }
main.pmain, .pmain { max-width: none !important; margin: 0 !important; padding: 0 !important; }
#v2 { max-width: none !important; margin: 0 !important; padding: 0 !important; }
@media (max-width: 1024px) { .nav-inner { padding-left: 40px !important; padding-right: 40px !important; } }
@media (max-width: 720px)  { .nav-inner { padding-left: 20px !important; padding-right: 20px !important; } }
#v2 .phead, #v2 .prose-body {
max-width: 1440px; margin-left: auto; margin-right: auto;
padding-left: 80px; padding-right: 80px; box-sizing: border-box;
}
#v2 .phead { padding-top: 120px; padding-bottom: 0; }
#v2 .back {
display: inline-block; font-size: 14px; color: var(--tx-3);
text-decoration: none; margin-bottom: 28px;
}
#v2 .back:hover { color: var(--tx); }
#v2 .phead .eyebrow { color: var(--tx-3); margin: 0 0 20px; }
#v2 .ph-title {
font-size: clamp(32px, 5vw, 64px); font-weight: 500; line-height: 1.08;
letter-spacing: -0.03em; color: var(--tx); margin: 0 0 16px; max-width: 22ch;
}
#v2 .ph-meta {
font-family: ui-monospace, Menlo, monospace; font-size: 13px;
letter-spacing: .04em; color: var(--tx-3); margin: 0 0 28px;
}
#v2 .ph-intro {
font-size: 18px; line-height: 1.7; color: var(--tx-3);
margin: 0; max-width: 720px;
}
#v2 .prose-body { padding-top: 96px; padding-bottom: 140px; }
#v2 .prose-body > * { max-width: 760px; }
#v2 .prose-body h2 {
font-size: clamp(26px, 3.4vw, 44px); font-weight: 500; line-height: 1.15;
letter-spacing: -0.02em; color: var(--tx);
margin: 72px 0 24px;
}
#v2 .prose-body h3 {
font-size: 22px; font-weight: 600; line-height: 1.3;
color: var(--tx); margin: 48px 0 16px;
}
#v2 .prose-body p {
font-size: 17px; line-height: 1.75; color: var(--tx-3);
margin: 0 0 24px;
}
#v2 .prose-body p strong, #v2 .prose-body li strong { color: var(--tx); font-weight: 600; }
#v2 .prose-body p em, #v2 .prose-body li em { font-style: italic; color: var(--tx); }
#v2 .prose-body a { color: #0F766E; text-decoration: none; }
#v2 .prose-body a:hover { text-decoration: underline; }
#v2 .prose-body code {
font-family: "JetBrains Mono", ui-monospace, monospace; font-size: .88em;
background: #F3F4F6; color: var(--tx); padding: 2px 6px; border-radius: var(--r-sm);
}
#v2 .prose-body ul, #v2 .prose-body ol { margin: 0 0 24px; padding-left: 24px; }
#v2 .prose-body li { font-size: 17px; line-height: 1.75; color: var(--tx-3); margin-bottom: 12px; }
#v2 .prose-body li::marker { color: var(--tx-3); }
#v2 .prose-body blockquote {
margin: 32px 0; padding: 20px 24px;
border-left: 3px solid var(--line); background: #F9FAFB;
font-size: 16px; line-height: 1.7; color: var(--tx-3); border-radius: 0 8px 8px 0;
}
#v2 .prose-body blockquote strong { color: var(--tx); }
#v2 .prose-body hr { border: none; border-top: 1px solid var(--line); margin: 56px 0; }
#v2 .prose-body figure { margin: 40px 0; max-width: 100%; }
#v2 .prose-body figcaption { font-size: 14px; color: var(--tx-3); margin-top: 12px; }
#v2 .callout {
margin: 32px 0; padding: 24px 28px; max-width: 760px;
background: #F9FAFB; border: 1px solid var(--line);
border-radius: var(--r-card); font-size: 16px; line-height: 1.7; color: var(--tx-3);
}
#v2 .callout strong { color: var(--tx); }
#v2 .ctabox {
margin: 64px 0 0; padding: 56px 48px; max-width: 760px;
background: var(--bg-dark); border-radius: var(--r-card);
display: flex; flex-direction: column; gap: 16px;
}
#v2 .ctatext, #v2 .ctabox p { color: var(--tx-on-dark-2) !important; font-size: 17px; line-height: 1.7; margin: 0 !important; }
#v2 .ctabox a, #v2 .ctabox .cta { color: var(--tx-on-dark) !important; white-space: normal; }
#v2 .ctabox .ctas { display: flex; gap: 16px; flex-wrap: wrap; margin-top: 16px; }
@media (max-width: 1024px) {
#v2 .phead, #v2 .prose-body { padding-left: 40px; padding-right: 40px; }
}
@media (max-width: 810px) {
#v2 .phead { padding-top: 88px; }
#v2 .prose-body { padding-top: 64px; padding-bottom: 88px; }
#v2 .prose-body h2 { margin-top: 48px; }
#v2 .ctabox { padding: 40px 24px; }
}
@media (max-width: 720px) {
#v2 .phead, #v2 .prose-body { padding-left: 20px; padding-right: 20px; }
}
#v2 .metrics {
display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px;
margin: 40px 0; max-width: 100% !important;
}
#v2 .metric {
background: #fff; border: 1px solid var(--line);
border-radius: var(--r-card); padding: 28px 24px;
}
#v2 .mval {
font-family:var(--font-body); font-size: 34px; font-weight: 600;
line-height: 1.1; letter-spacing: -0.02em; color: var(--tx); display: block;
}
#v2 .mlab {
font-size: 13.5px; line-height: 1.5; color: var(--tx-3);
margin: 10px 0 0; display: block;
}
#v2 .prose-body > .metrics, #v2 .prose-body > figure { max-width: 100% !important; }
#v2 .prose-body table { width: 100%; border-collapse: collapse; margin: 32px 0; font-size: 15px; }
#v2 .prose-body th, #v2 .prose-body td {
text-align: left; padding: 12px 16px; border-bottom: 1px solid var(--line); color: var(--tx-3);
}
#v2 .prose-body th { color: var(--tx); font-weight: 600; border-bottom-width: 2px; }
@media (max-width: 810px) {
#v2 .metrics { grid-template-columns: 1fr; gap: 16px; }
}
:lang(zh) #v2 h1 { line-height: 1.08; letter-spacing: normal; font-weight: 500; word-break: keep-all; text-wrap: balance; }
:lang(zh) #v2 h2 { line-height: 1.15; letter-spacing: normal; font-weight: 600; word-break: keep-all; text-wrap: balance; }
:lang(zh) #v2 p, :lang(zh) #v2 li { line-height: 1.8; }
:lang(zh) #v2 .eyebrow, :lang(zh) #v2 .ph-meta { letter-spacing: 0.02em; }
html, body { background: #FFFFFF !important; color: #111827 !important; }
#v2, #v2 .sec, #v2 .psec, #v2 .phead, #v2 main { background: transparent !important; }
#v2 { margin: 0; background: #FFFFFF !important; color: #111827 !important;
font-family:var(--font-body); }
#v2 main.pmain, main.pmain { max-width: none !important; margin-left: auto !important;
margin-right: auto !important; padding-left: 0 !important; padding-right: 0 !important; }
#v2 .sec-inner { max-width: 1344px !important; margin: 0 auto !important; padding: 0 80px !important; }
#v2 .psec { padding: 96px 0 0 !important; border-top: 0 !important; }
#v2 .psec:last-of-type { padding-bottom: 140px !important; }
@media (max-width: 1024px) {
#v2 .sec-inner { padding: 0 40px !important; }
#v2 .psec { padding-top: 72px !important; }
}
@media (max-width: 720px) {
#v2 .sec-inner { padding: 0 20px !important; }
#v2 .psec { padding-top: 56px !important; }
}
:root {
--r-sm: 4px;
--r-card: 16px;
--r-pill: 100px;
--accent-brand: #1D4ED8;
--accent-brand-glow: rgba(29,78,216,.12);
--accent-brand-glow-strong: rgba(29,78,216,.22);
--accent-brand-hover: #1E40AF;
--accent-teal: #0F766E;
--accent-teal-glow: rgba(15,118,110,.10);
--bg-alt: #F6F7F9;
--bg-base: #FFFFFF;
--bg-elevated: #FFFFFF;
--bg-navbar: rgba(255,255,255,.82);
--bg-surface: #F6F7F9;
--border-default: rgba(0,0,0,.10);
--border-strong: rgba(0,0,0,.18);
--border-subtle: rgba(0,0,0,.055);
--card-veil: linear-gradient(to top,rgba(255,255,255,.96),transparent);
--ls-display: -.03em;
--shadow-btn: 0 1px 2px rgba(16,24,40,.08);
--shadow-card: 0 1px 2px rgba(16,24,40,.04),0 12px 28px rgba(16,24,40,.07);
--signal-fail: #FF5F56;
--signal-pass: #2DD4BF;
--signal-warn: #FFBD2E;
--text-body: 18px;
--text-desc: #55565A;
--text-display: clamp(36px,4.2vw,64px);
--text-h1: 44px;
--text-h2: 36px;
--text-h3: 20px;
--text-muted: #86868B;
--text-primary: #1C1C1E;
--text-secondary: #55565A;
--text-small: 14px;
--text-title: #0B0B0C;
--w-03: rgba(0,0,0,0.048);
--w-04: rgba(0,0,0,0.064);
--w-05: rgba(0,0,0,0.08);
--w-06: rgba(0,0,0,0.096);
--w-07: rgba(0,0,0,0.112);
--w-08: rgba(0,0,0,0.128);
--w-09: rgba(0,0,0,0.144);
--w-10: rgba(0,0,0,0.16);
--w-12: rgba(0,0,0,0.192);
--w-14: rgba(0,0,0,0.2);
--w-16: rgba(0,0,0,0.2);
--w-18: rgba(0,0,0,0.2);
--w-20: rgba(0,0,0,0.2);
--w-22: rgba(0,0,0,0.22);
--w-24: rgba(0,0,0,0.24);
--w-25: rgba(0,0,0,0.25);
--w-28: rgba(0,0,0,0.28);
--w-30: rgba(0,0,0,0.3);
--w-35: rgba(0,0,0,0.35);
--w-38: rgba(0,0,0,0.38);
--w-40: rgba(0,0,0,0.4);
--w-42: rgba(0,0,0,0.42);
--w-44: rgba(0,0,0,0.44);
--w-45: rgba(0,0,0,0.45);
--w-50: rgba(0,0,0,0.5);
--w-52: rgba(0,0,0,0.52);
--w-55: rgba(0, 0, 0, 0.62);
--w-56: rgba(0,0,0,0.56);
--w-60: rgba(0,0,0,0.6);
--w-64: rgba(0,0,0,0.64);
--w-66: rgba(0,0,0,0.66);
--w-72: rgba(0,0,0,0.72);
--w-75: rgba(0,0,0,0.75);
--w-78: rgba(0,0,0,0.78);
--w-84: rgba(0,0,0,0.84);
}
.navbar .logo-mark, .navbar .logo-text,
.navbar .logo-mark circle, .navbar .logo-mark path { color: #E8EAED !important; }
.pmain, .pmain p, .pmain li, .pmain ul, .pmain ol, .pmain td, .pmain th,
.prose-body, .psec, .fig, .plabel, .mquote-t, .mquote-d, .bm-atglance,
.sec-desc, .ctatext, .ph-note, .hero-sub, .plan-feats li { color: rgba(17, 24, 39, .86) !important; }
.pmain h2, .pmain h3, .pmain h4, .psec h2, .psec h3, .prose-body h2, .prose-body h3 { color: #111827 !important; }
.pmain strong, .pmain b, .prose-body strong, .psec strong { color: #0B1220 !important; }
.pmain a, .prose-body a, .psec a { color: #1D4ED8; }
.pmain .uc-cta, .pmain .uc-cta *, .pmain .uc-card, .pmain .uc-card *,
.pmain .icell, .pmain .icell *, .pmain .pillar, .pmain .pillar *, .pmain .ctabox, .pmain .ctabox *,
.uc-cta, .uc-cta *, .uc-card, .uc-card *, .icell, .icell *, .pillar, .pillar *, .ctabox, .ctabox * { color: rgba(255, 255, 255, .88) !important; }
.pmain .uc-cta h1, .pmain .uc-cta h2, .pmain .uc-cta h3,
.pmain .pillar h2, .pmain .pillar h3, .pillar h2, .pillar h3,
.uc-cta h1, .uc-cta h2, .uc-cta h3, .ctabox h1, .ctabox h2, .ctabox h3 { color: #FFFFFF !important; }
.pmain .uc-cta a, .uc-cta a, .uc-card a, .icell a, .pillar a, .ctabox a { color: #9EC5FF !important; }
.pmain .tl-ver, .tl-ver, .pmain .tl-t, .tl-t, .pmain .saxis, .saxis { color: #111827 !important; }
.pmain .tl-date, .tl-date { color: rgba(17, 24, 39, .62) !important; }
.navbar .menu a { color: rgba(255, 255, 255, .72); }
.navbar .menu a:hover, .navbar .menu a.active { color: rgba(255, 255, 255, .96); }
.navbar .seg button, .navbar .seg a { color: rgba(255, 255, 255, .92); }
:root {
--bg: #FFFFFF !important;
--bg-base: #FFFFFF !important;
--bg-alt: #F6F7F9 !important;
--bg-elevated: #FFFFFF !important;
--bg-surface: #F6F7F9 !important;
--bg-page: #FFFFFF !important;
--bg-navbar: rgba(255,255,255,.92) !important;
--bg-dark: #F3F4F6 !important;
--text-primary: #111827 !important;
--text-secondary: rgba(17,24,39,.72) !important;
--text-muted: rgba(17,24,39,.56) !important;
--text-title: #111827 !important;
--border-subtle: rgba(0,0,0,.06) !important;
--border-default: rgba(0,0,0,.10) !important;
--border-strong: rgba(0,0,0,.16) !important;
}
[data-theme="dark"],
[data-theme="light"] {
background-color: #FFFFFF !important;
color: #111827 !important;
}
html, body {
background-color: #FFFFFF !important;
color: #111827 !important;
}
.theme-toggle,
button[class*="theme"],
a[class*="theme"] {
display: none !important;
}
.navbar {
background: rgba(255,255,255,.92) !important;
color: #111827 !important;
--text-primary: #111827 !important;
}
.navbar .logo-mark,
.navbar .logo-text,
.navbar .logo {
color: #111827 !important;
}
.navbar .menu a,
.navbar .nav-link {
color: rgba(17,24,39,.72) !important;
}
.navbar .menu a:hover,
.navbar .nav-link:hover {
color: #111827 !important;
}
.hero,
.phead,
section[class*="hero"] {
background-color: #FFFFFF !important;
color: #111827 !important;
}
.hero::before,
.phead::before,
section[class*="hero"]::before {
opacity: .5 !important;
}
.hero::after,
.phead::after,
section[class*="hero"]::after {
background: linear-gradient(to bottom,
rgba(255,255,255,.94) 0%,
rgba(255,255,255,.88) 40%,
rgba(255,255,255,.96) 100%) !important;
box-shadow: none !important;
}
#v2 .hero .hint,
#v2 .ask .hint,
.hero .trial-hint,
#v2 .ask .examples button,
.hero .examples button,
.hero .trial-hint span {
color: rgba(17,24,39,.72) !important;
}
#v2 .ask .examples button:hover,
.hero .examples button:hover {
color: #111827 !important;
}
.footer,
.linkcard,
.uc-cta,
.pillar,
.ctabox,
.uc-card,
.icell,
.footer-logo,
.footer-col,
.footer-brand,
.dark,
[data-theme="dark"] {
--text-primary: #E8EAED !important;
--text-secondary: rgba(255,255,255,.72) !important;
--text-muted: rgba(255,255,255,.56) !important;
--text-title: #F5F6F8 !important;
}
.navbar .seg button,
.navbar .seg a {
color: rgba(17,24,39,.72) !important;
}
.navbar .seg button.active,
.navbar .seg a.active {
color: #111827 !important;
background: rgba(17,24,39,.10) !important;
}
.accent,
#v2 .accent,
span.accent {
color: #0369A1 !important;
}
.cta-btn,
a.cta-btn,
#v2 .cta-btn {
color: #FFFFFF !important;
}
.hero h1, .hero h2, .hero h3,
.hero p, .hero .eyebrow, .hero .subtitle,
.hero .tagline, .hero .lead,
.phead h1, .phead h2, .phead p,
section[class*="hero"] h1,
section[class*="hero"] p,
section[class*="hero"] .eyebrow {
color: #111827 !important;
}
.pmain .cta-panel-card, #v2 .cta-panel-card, html body .cta-panel-card,
.pmain .cta-panel, #v2 .cta-panel, html body .cta-panel {
background-color: #FFFFFF !important;
border-color: rgba(17,24,39,.10) !important;
}
.pmain .cta-panel-card .cta-panel-title, #v2 .cta-panel-title, html body .cta-panel-title {
color: #111827 !important;
}
.pmain .cta-panel-card .cta-panel-desc, #v2 .cta-panel-desc, html body .cta-panel-desc {
color: rgba(17,24,39,.72) !important;
}
.pmain a.cta, #v2 a.cta, html body a.cta,
.pmain .ctas a.cta, #v2 .ctas a.cta,
.pmain .ctabox a.cta, #v2 .ctabox a.cta,
.pmain .ctabox .cta, #v2 .ctabox .cta {
color: rgba(17,24,39,.80) !important;
border-color: rgba(17,24,39,.32) !important;
}
.pmain a.cta:hover, #v2 a.cta:hover, html body a.cta:hover {
color: #111827 !important;
border-color: #111827 !important;
background-color: rgba(17,24,39,.04) !important;
}
.pmain code, #v2 code, html body code,
.pmain .uc-cta code, #v2 .uc-cta code, .pmain pre, #v2 pre, html body pre {
color: #111827 !important;
background-color: rgba(17,24,39,.06) !important;
}
.pmain .uc-cta .uc-cta-t, #v2 .uc-cta .uc-cta-t, html body .uc-cta-t,
.pmain .uc-cta h2, #v2 .uc-cta h2, .pmain .uc-cta h3, #v2 .uc-cta h3 {
color: #111827 !important;
}
.pmain .uc-cta .uc-cta-d, #v2 .uc-cta .uc-cta-d, html body .uc-cta-d,
.pmain .uc-cta p, #v2 .uc-cta p {
color: rgba(17,24,39,.72) !important;
}
.pmain .uc-cta .cta, #v2 .uc-cta .cta, html body .uc-cta .cta,
.pmain .ctas .cta, #v2 .ctas .cta, html body .cta {
color: rgba(17,24,39,.80) !important;
border-color: rgba(17,24,39,.32) !important;
}
.pmain .uc-cta .cta:hover, #v2 .uc-cta .cta:hover, html body .uc-cta .cta:hover {
color: #111827 !important;
border-color: #111827 !important;
background-color: rgba(17,24,39,.04) !important;
}
.pmain .uc-card, #v2 .uc-card, html body .uc-card,
.pmain .icell, #v2 .icell, html body .icell,
.pmain .pillar, #v2 .pillar, html body .pillar,
.pmain .ctabox, #v2 .ctabox, html body .ctabox,
.pmain .uc-cta, #v2 .uc-cta, html body .uc-cta {
background-color: #FFFFFF !important;
border-color: rgba(17,24,39,.10) !important;
color: #111827 !important;
}
.pmain .uc-card *, #v2 .uc-card *, html body .uc-card *,
.pmain .icell *, #v2 .icell *, html body .icell *,
.pmain .pillar *, #v2 .pillar *, html body .pillar *,
.pmain .ctabox *, #v2 .ctabox *, html body .ctabox * {
color: #111827 !important;
}
.pmain .uc-card .uc-card-d, #v2 .uc-card .uc-card-d,
.pmain .uc-card p, #v2 .uc-card p,
.pmain .pillar p, #v2 .pillar p,
.pmain .ctabox p, #v2 .ctabox p {
color: rgba(17,24,39,.72) !important;
}
.pmain .uc-card .uc-card-t, #v2 .uc-card .uc-card-t, html body .uc-card .uc-card-t,
.pmain .uc-card-t, #v2 .uc-card-t, html body .uc-card-t {
color: #111827 !important;
}
.pmain .uc-card .uc-card-d, #v2 .uc-card .uc-card-d, html body .uc-card .uc-card-d,
.pmain .uc-card-d, #v2 .uc-card-d, html body .uc-card-d,
.pmain .uc-card p, #v2 .uc-card p {
color: rgba(17,24,39,.72) !important;
}
.pmain .uc-card, #v2 .uc-card, html body .uc-card {
color: #111827 !important;
}
.pmain .ev-footer .ev-footer-col-title, #v2 .ev-footer-col-title, html body .ev-footer-col-title {
color: rgba(17,24,39,.50) !important;
}
.pmain .ev-footer *, #v2 .ev-footer *, html body .ev-footer * {
color: rgba(17,24,39,.72) !important;
}
.pmain .pdemo-tab, #v2 .pdemo-tab, html body .pdemo-tab,
.pmain .report .pdemo-tab, #v2 .report .pdemo-tab {
color: rgba(17,24,39,.60) !important;
}
.pmain .pdemo-tab.active, #v2 .pdemo-tab.active, html body .pdemo-tab.active {
color: #111827 !important;
}
.pmain .pdemo *, #v2 .pdemo *, html body .pdemo * {
color: #111827 !important;
}
#v2 .ask .box,
#v2 .trial,
.hero .trial,
.hero .ask .box {
background-color: rgba(17,24,39,.04) !important;
border-color: rgba(17,24,39,.14) !important;
}
#v2 .ask textarea,
#v2 .trial-input,
#v2 textarea,
#v2 input[type="text"],
#v2 input[type="email"],
#v2 input[type="search"],
.hero textarea,
.hero input[type="text"] {
color: #111827 !important;
}
#v2 .ask textarea::placeholder,
#v2 .trial-input::placeholder,
.hero textarea::placeholder,
.hero input::placeholder {
color: rgba(17,24,39,.45) !important;
}
#v2 .ask .examples button,
.hero .examples button {
background-color: rgba(17,24,39,.03) !important;
border-color: rgba(17,24,39,.14) !important;
}
#v2 .ask .examples button:hover,
.hero .examples button:hover {
border-color: rgba(17,24,39,.28) !important;
background-color: rgba(17,24,39,.06) !important;
}
#v2 .trial-send:disabled,
#v2 .ask .send:disabled {
background-color: rgba(17,24,39,.12) !important;
opacity: 1 !important;
}
.footer,
footer.footer {
background-color: #FFFFFF !important;
}
.footer .logo-text,
.footer .footer-copy,
.footer .footer-col h3,
.footer .footer-col h4,
.footer .footer-col a,
.footer .footer-bottom,
.footer .footer-bottom a,
.footer .bo-label,
.footer .bo-name,
.footer .bo-role,
.footer .footer-brand-info a {
color: rgba(17,24,39,.72) !important;
}
.footer .logo-mark,
.footer .footer-col a:hover,
.footer .footer-bottom a:hover {
color: #111827 !important;
}
.footer .footer-col h3,
.footer .footer-col h4 {
color: rgba(17,24,39,.50) !important;
}
code, kbd, samp,
.pmain code, .prose-body code, .psec code, pre code, pre {
color: #111827 !important;
background-color: rgba(17,24,39,.06) !important;
}
.ver, .tl-ver, .tl-date, .tl-t, .saxis,
.pmain .ver, .ph-title .ver {
color: rgba(17,24,39,.72) !important;
}
.accent, #v2 .accent, span.accent,
.accent-teal, .txt-accent {
color: #0369A1 !important;
}
.cta-btn:not(.primary):not(.cta-primary) {
color: #111827 !important;
border-color: rgba(17,24,39,.20) !important;
}
.cta-btn.primary, .cta-btn.cta-primary {
color: #FFFFFF !important;
}
.linkcard, .policy-link, .card {
background-color: #FFFFFF !important;
border-color: rgba(17,24,39,.10) !important;
}
.linkcard h2, .linkcard h3, .linkcard p, .linkcard span,
.policy-link h2, .policy-link h3, .policy-link p, .policy-link span,
.linkcard .t, .policy-link .t {
color: #111827 !important;
}
.linkcard p, .policy-link p, .linkcard .d, .policy-link .d {
color: rgba(17,24,39,.72) !important;
}
.seg {
background-color: rgba(17,24,39,.04) !important;
padding: 3px !important;
}
.seg button {
background-color: transparent !important;
color: rgba(17,24,39,.72) !important;
}
.seg button.active {
background-color: rgba(17,24,39,.12) !important;
color: #111827 !important;
}
.menu a, .navbar .menu a {
position: relative !important;
}
.menu a.active, .navbar .menu a.active {
color: #111827 !important;
font-weight: 500 !important;
}
.menu a.active::after, .navbar .menu a.active::after {
content: '' !important;
display: block !important;
position: absolute !important;
bottom: -8px !important;
left: 0 !important;
right: 0 !important;
height: 2px !important;
background-color: #111827 !important;
border-radius: 1px !important;
width: 100% !important;
}
#v2 .hero h1 .accent, #v2 .tagline .accent, #v2 h1.tagline .accent, #v2 .page-title .accent {
color: inherit !important;
}
.hero .cta,
.hero .page-ctas .cta,
#v2 .hero .cta,
.page-head .cta,
.sec.page-head .cta {
display: inline-flex !important;
align-items: center !important;
align-self: flex-start !important;
gap: 6px !important;
padding: 12px 24px !important;
border-radius: 8px !important;
background-color: #224eee !important;
color: #fff !important;
font-weight: 500 !important;
font-size: 14px !important;
line-height: 1.4 !important;
text-decoration: none !important;
border: 1px solid #224eee !important;
width: auto !important;
min-width: auto !important;
max-width: none !important;
transition: transform .15s ease, box-shadow .15s ease !important;
}
.hero .cta:hover,
.page-head .cta:hover {
transform: translateY(-1px) !important;
box-shadow: 0 6px 18px rgba(34,78,238,.25) !important;
}
.hero .ph-intro,
.hero .lead,
.page-head .sec-desc,
#v2 .page-head .sec-desc {
font-size: 1.25rem !important;
line-height: 1.55 !important;
color: rgba(17,24,39,.72) !important;
max-width: 680px !important;
margin: 16px 0 28px 0 !important;
}
.eyebrow, .ph-label, .plabel, .section-label {font-family: "Geist Mono", "JetBrains Mono", "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, "PingFang SC", "HarmonyOS Sans SC", MiSans, -apple-system, "Microsoft YaHei", sans-serif !important;
text-transform: uppercase !important;
letter-spacing: 0.12em !important;
font-size: 12px !important;
line-height: 1.4 !important;
font-weight: 600 !important;
color: rgba(17,24,39,.56) !important;
}
.demo-sec .eyebrow, .play-sec .eyebrow, .final .eyebrow, .dark-sec .eyebrow,
#v2 .demo-sec .eyebrow, #v2 .play-sec .eyebrow, #v2 .final .eyebrow {
color: rgba(255,255,255,.78) !important;
}
.page,
#v2 .page,
#v2 .page-inner,
.page-inner {
width: 100% !important;
max-width: 1344px !important;
margin-left: auto !important;
margin-right: auto !important;
padding-left: 32px !important;
padding-right: 32px !important;
box-sizing: border-box !important;
flex-shrink: 0 !important;
}
.logo-mark {
width: 26px !important;
height: 26px !important;
color: #000 !important;
}
.logo-mark circle,
.logo-mark path {
stroke: #000 !important;
stroke-width: 2.4px !important;
}
.logo {
color: #000 !important;
}
.logo-text {
font-weight: 700 !important;
font-size: 16px !important;
letter-spacing: -0.02em !important;
color: #000 !important;
}
.navbar {
height: 72px !important;
display: flex !important;
align-items: center !important;
}
.navbar .page.nav-inner,
.navbar .nav-inner {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
width: 100% !important;
max-width: 1344px !important;
margin-left: auto !important;
margin-right: auto !important;
padding-left: 32px !important;
padding-right: 32px !important;
height: 100% !important;
}
.navbar .menu {
display: flex !important;
align-items: center !important;
gap: 32px !important;
}
.navbar .menu a {
font-size: 14px !important;
font-weight: 450 !important;
color: rgba(17,24,39,.64) !important;
padding: 8px 0 !important;
}
.navbar .menu a:hover {
color: #111827 !important;
}
.hero,
#v2 .hero,
#v2 > section.hero {
display: flex !important;
flex-direction: column !important;
justify-content: flex-start !important;
align-items: flex-start !important;
height: auto !important;
min-height: 520px !important;
padding: 120px 0 80px !important;
}
.hero .hd {
max-width: none !important;
width: 100% !important;
}
#v2 .hero .hd > h1,
#v2 .hero .hd > .tagline,
#v2 .hero .hd > .page-title {
max-width: none !important;
width: 100% !important;
}
.hero h1,
.hero .tagline,
.page-head h1,
.page-head .page-title {
overflow-wrap: break-word !important;
word-break: break-word !important;
hyphens: auto !important;
}
.demo-sec .eyebrow, .play-sec .eyebrow, .final .eyebrow, .dark-sec .eyebrow,
.demo-sec .sec-inner > .eyebrow, .play-sec .eyebrow {
color: rgba(255,255,255,.78) !important;
opacity: 1 !important;
}
.final .btn-primary,
.final .cta {
background-color: #fff !important;
color: #111827 !important;
border-color: #fff !important;
}
.final .btn-on-dark {
background-color: transparent !important;
color: #fff !important;
border-color: rgba(255,255,255,.45) !important;
}
.final .cta:hover {
background-color: rgba(255,255,255,.88) !important;
border-color: rgba(255,255,255,.88) !important;
}
.final .btn-on-dark:hover {
background-color: rgba(255,255,255,.12) !important;
border-color: rgba(255,255,255,.7) !important;
}
.final .btn:not(.btn-on-dark):not(.btn-primary):not(.cta) {
background-color: transparent !important;
color: #fff !important;
border: 1px solid rgba(255,255,255,.42) !important;
}
.final .btn:not(.btn-on-dark):not(.btn-primary):not(.cta):hover {
background-color: rgba(255,255,255,.12) !important;
border-color: rgba(255,255,255,.7) !important;
}
.demo-sec h1, .demo-sec h2, .demo-sec h3, .demo-sec h4, .demo-sec .sec-title,
.play-sec h1, .play-sec h2, .play-sec h3, .play-sec h4, .play-sec .sec-title,
.final h1, .final h2, .final h3, .final h4 {
color: #fff !important;
}
.demo-sec p, .demo-sec .sec-desc, .demo-sec .demo-name,
.play-sec p, .play-sec .sec-desc, .play-sec .sub,
.final p, .final .lead {
color: rgba(255,255,255,.72) !important;
}
.demo-sec .demo-sub, .play-sec .demo-sub {
color: rgba(255,255,255,.56) !important;
}
.demo-sec .demo-card, .play-sec .demo-card {
background-color: rgba(255,255,255,.04) !important;
border-color: rgba(255,255,255,.1) !important;
}
.sec-inner,
.sec .sec-inner,
.demo-sec .sec-inner,
.play-sec .sec-inner,
#v2 .sec-inner {
width: 100% !important;
max-width: 1344px !important;
margin-left: auto !important;
margin-right: auto !important;
padding-left: 32px !important;
padding-right: 32px !important;
box-sizing: border-box !important;
}
.sec,
.demo-sec,
.play-sec {
width: 100% !important;
max-width: none !important;
margin-left: 0 !important;
margin-right: 0 !important;
}
.demo-grid {
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 24px !important;
width: 100% !important;
max-width: none !important;
justify-content: stretch !important;
padding-left: 0 !important;
padding-right: 0 !important;
margin-left: 0 !important;
margin-right: 0 !important;
}
.grid3, .grid2, .cards, .mech, .uc-grid {
padding-left: 0 !important;
padding-right: 0 !important;
margin-left: 0 !important;
margin-right: 0 !important;
}
.demo-card {
width: 100% !important;
max-width: none !important;
}
@media (max-width: 720px) {
.sec-inner, .sec .sec-inner, .demo-sec .sec-inner, #v2 .sec-inner {
padding-left: 20px !important;
padding-right: 20px !important;
}
.demo-grid {
grid-template-columns: 1fr !important;
}
}
@media (max-width: 720px) {
.page,
#v2 .page {
padding-left: 20px !important;
padding-right: 20px !important;
}
.hero,
#v2 .hero,
#v2 > section.hero {
padding: 64px 0 48px !important;
min-height: auto !important;
}
.hero h1,
.hero .tagline,
.page-head h1,
.page-head .page-title,
#v2 .hero h1,
#v2 .hero .tagline {
font-size: clamp(30px, 8vw, 44px) !important;
line-height: 1.12 !important;
letter-spacing: -0.02em !important;
}
.hero .lead,
.hero .ph-intro,
.page-head .sec-desc,
#v2 .hero .lead {
font-size: 16px !important;
line-height: 1.6 !important;
}
.hero .eyebrow,
.page-head .eyebrow {
font-size: 11px !important;
margin-bottom: 16px !important;
}
.navbar {
height: 64px !important;
}
.navbar .page.nav-inner,
.navbar .nav-inner {
padding-left: 20px !important;
padding-right: 20px !important;
}
.navbar .menu {
gap: 20px !important;
}
.navbar .menu a {
font-size: 13px !important;
}
.logo-text {
font-size: 15px !important;
}
#v2 .ask .box,
.ask .box {
padding: 14px !important;
}
}
.skip-link {
position: absolute !important;
left: -9999px !important;
top: 0 !important;
z-index: 9999 !important;
padding: 12px 20px !important;
background: #111827 !important;
color: #fff !important;
border-radius: 0 0 8px 0 !important;
font-size: 14px !important;
font-weight: 500 !important;
text-decoration: none !important;
}
.skip-link:focus {
left: 0 !important;
outline: 2px solid #224eee !important;
outline-offset: 2px !important;
}
@media (max-width: 480px) {
.hero h1,
.hero .tagline,
.page-head h1,
#v2 .hero h1 {
font-size: clamp(26px, 9vw, 34px) !important;
}
}
.hero .eyebrow,
.page-head .eyebrow {
font-size: 12px !important;
font-weight: 600 !important;
text-transform: uppercase !important;
letter-spacing: 0.14em !important;
color: rgba(17,24,39,.48) !important;
margin-bottom: 24px !important;
}
.hero h1,
.hero .tagline,
.page-head h1,
.page-head .page-title {
font-size: clamp(36px, 5vw, 64px) !important;
line-height: 1.08 !important;
letter-spacing: -.02em !important;
font-weight: 500 !important;
color: #111827 !important;
margin-bottom: 24px !important;
}
.hero .lead,
.hero .ph-intro,
.page-head .sec-desc {
font-size: 18px !important;
line-height: 1.6 !important;
color: rgba(17,24,39,.68) !important;
max-width: 640px !important;
margin-bottom: 32px !important;
}
.cta,
.btn-primary,
.btn {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
height: 44px !important;
padding: 0 24px !important;
border-radius: 8px !important;
font-size: 14px !important;
font-weight: 500 !important;
text-decoration: none !important;
transition: all .15s ease !important;
}
.cta,
.btn-primary {
background-color: #111827 !important;
color: #fff !important;
border: 1px solid #111827 !important;
}
.cta:hover,
.btn-primary:hover {
background-color: #1f2937 !important;
transform: translateY(-1px) !important;
}
.btn:not(.btn-primary) {
background-color: transparent !important;
color: #111827 !important;
border: 1px solid rgba(17,24,39,.16) !important;
}
.seg {
height: 32px !important;
padding: 3px !important;
background-color: rgba(17,24,39,.06) !important;
border: none !important;
border-radius: 999px !important;
}
.seg button {
height: 26px !important;
padding: 0 12px !important;
font-size: 12px !important;
font-weight: 500 !important;
color: rgba(17,24,39,.64) !important;
background-color: transparent !important;
border-radius: 999px !important;
}
.seg button.active {
background-color: #fff !important;
color: #111827 !important;
box-shadow: 0 1px 2px rgba(0,0,0,.08) !important;
}
#v2 .ask .box,
.ask .box,
#trial .box {
background-color: #fff !important;
border: 1px solid rgba(17,24,39,.2) !important;
border-radius: 16px !important;
box-shadow: 0 4px 24px rgba(0,0,0,.06) !important;
padding: 20px !important;
}
#v2 .ask textarea,
.ask textarea {
color: #111827 !important;
font-size: 16px !important;
line-height: 1.5 !important;
}
#v2 .ask textarea::placeholder,
.ask textarea::placeholder {
color: rgba(17,24,39,.65) !important;
}
#v2 .ask .hint,
.ask .hint {
color: rgba(17,24,39,.56) !important;
font-size: 13px !important;
}
#v2 .ask .examples button,
.ask .examples button {
background-color: rgba(17,24,39,.08) !important;
color: rgba(17,24,39,.78) !important;
border: 1px solid rgba(17,24,39,.1) !important;
border-radius: 999px !important;
padding: 8px 14px !important;
font-size: 13px !important;
}
#v2 .ask .examples button:hover,
.ask .examples button:hover {
background-color: rgba(17,24,39,.12) !important;
border-color: rgba(17,24,39,.16) !important;
}
#v2 .ask .examples button:hover,
.ask .examples button:hover {
background-color: rgba(17,24,39,.1) !important;
}
.final .cta, .final .btn,
.play-sec .cta, .play-sec .btn,
.footer .cta, .footer .btn,
.cta-panel .cta, .cta-panel .btn,
.ctabox .cta, .ctabox .btn,
.uc-cta .cta, .uc-cta .btn,
.linkcard .cta, .linkcard .btn,
.pillar .cta, .pillar .btn,
.icell .cta, .icell .btn,
.sm .cta, .sm .btn,
.trust .cta, .trust .btn,
.navbar .cta,
.dark .cta, .dark .btn,
.bg-dark .cta, .bg-dark .btn,
[data-theme="dark"] .cta {
background-color: rgba(255,255,255,.08) !important;
color: #fff !important;
border-color: rgba(255,255,255,.42) !important;
}
.final .cta:hover, .final .btn:hover,
.play-sec .cta:hover, .play-sec .btn:hover,
.footer .cta:hover, .footer .btn:hover,
.cta-panel .btn:hover, .ctabox .btn:hover, .uc-cta .btn:hover {
background-color: rgba(255,255,255,.16) !important;
border-color: rgba(255,255,255,.6) !important;
}
.final h1, .final h2, .final h3, .final p, .final .lead,
.play-sec h1, .play-sec h2, .play-sec h3, .play-sec p, .play-sec .lead {
color: #fff !important;
}
.final .lead, .play-sec .lead, .final .sub, .play-sec .sub {
color: rgba(255,255,255,.68) !important;
}
.card,
.linkcard,
.uc-card,
.rcard {
border-radius: 16px !important;
border: 1px solid rgba(17,24,39,.08) !important;
background-color: #fff !important;
overflow: hidden !important;
}