/* premium polish layer (homepage zh + en). 8px scale: 8 16 24 32 48 64 96 */
:root{--r-s:10px;--r-m:16px;--r-l:24px;--b:1px solid rgba(13,11,18,.08);--sh:0 1px 2px rgba(13,11,18,.04),0 8px 24px -12px rgba(13,11,18,.12);--sh-h:0 2px 4px rgba(13,11,18,.05),0 16px 40px -16px rgba(13,11,18,.22)}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition-duration:.01ms!important}}
/* section rhythm */
.sec{padding:96px 0}section.sec,section.uc{padding-top:96px;padding-bottom:96px}
@media(max-width:720px){.sec,section.sec,section.uc{padding-top:64px;padding-bottom:64px}}
/* headers: one consistent centered pattern */
#usecases .eyebrow,#usecases h2,#usecases .sub,#usecases .lead,.how .eyebrow,.how h2,#features .eyebrow,#features h2,#features .sub,#features .lead,.feat6 .eyebrow,.feat6 h2,#connect .eyebrow,#connect h2,.flow .eyebrow,.flow h2,section.sand:not(#features) .eyebrow,section.sand:not(#features) h2{text-align:center;margin-left:auto;margin-right:auto}
#usecases .sub,#usecases .lead,#features .sub,#features .lead,#connect .sub,#connect .lead{max-width:640px}
.eyebrow{font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;margin-bottom:16px}
.sec h2,section.uc h2,section.flow h2{font-size:clamp(30px,3.6vw,46px);line-height:1.12;letter-spacing:-.025em;margin-bottom:16px;text-wrap:balance}
.sec .sub,.sec .lead,section.uc .lead{font-size:17px;line-height:1.6;opacity:.78;text-wrap:pretty}
@media(max-width:720px){.sec h2,section.uc h2,section.flow h2{font-size:28px}.sec .sub,.sec .lead,section.uc .lead{font-size:15.5px}}
/* cards: one radius / border / shadow system */
.sec .card,.g3>.card,.grid3>.card,.feat6 .card,.cov .card{border-radius:var(--r-m);border:var(--b);box-shadow:var(--sh);transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s}
.sec .card:hover,.feat6 .card:hover{transform:translateY(-2px);box-shadow:var(--sh-h)}
.night .card,.flow .card{box-shadow:none}
.g3,.grid3{gap:16px}
/* redundant "works with" rows (agent row lives in the flow section) */
.works,.worksrow{display:none!important}
/* demos: stage height fixed -> no layout shift between tabs */
.dstage{display:grid}.dstage>.dterm{grid-area:1/1;display:block;visibility:hidden;opacity:0;transition:opacity .25s}.dstage>.dterm.on{visibility:visible;opacity:1}.dbody{min-height:0!important}.dterm{border:1px solid rgba(255,255,255,.06)}

.dtabs{margin:32px 0 24px}.dtab{transition:background .2s,color .2s,border-color .2s}.dtab:hover:not(.on){border-color:rgba(13,11,18,.35)}
/* connect card */
.onb,.cx.onb{border-radius:var(--r-l)!important;box-shadow:0 1px 2px rgba(13,11,18,.04),0 24px 48px -24px rgba(13,11,18,.25)!important;border:var(--b)}
/* buttons */
.btn{transition:transform .15s,box-shadow .2s,background .2s}.btn:active{transform:translateY(1px)}
/* footer */
footer{padding-top:48px;padding-bottom:32px}footer nav a{transition:color .2s}
/* focus */
a:focus-visible,button:focus-visible{outline:2px solid #E8572A;outline-offset:2px;border-radius:6px}
.fi.lu{display:grid;width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,rgba(232,87,42,.14),rgba(184,50,90,.10));position:relative;margin-bottom:16px}.fi.lu::after{content:"";position:absolute;inset:10px;background:#E8572A;-webkit-mask:var(--i) center/contain no-repeat;mask:var(--i) center/contain no-repeat}
.hcopybox{margin:32px 0 8px;max-width:520px}.hcopybox small{display:block;font-size:13px;opacity:.7;margin-bottom:8px}.hcopybox .code{position:relative;border-radius:12px;background:rgba(251,248,241,.06);border:1px solid rgba(251,248,241,.14)}.hcopybox pre{margin:0;padding:14px 88px 14px 16px;font-size:14.5px;color:#FBF8F1;white-space:pre-wrap;word-break:break-all}.hcopybox .copy{top:50%;transform:translateY(-50%)}.hcopybox .copy:active{transform:translateY(-50%) scale(.96)}
.hcopybox pre{white-space:nowrap;overflow-x:auto;word-break:normal;font-size:14px;scrollbar-width:none}.hcopybox pre::-webkit-scrollbar{display:none}
@media(max-width:560px){.hero .pill{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;font-size:11px}.hcopybox pre{font-size:13px;padding-right:76px}.hero .stats{gap:16px 24px}}
section.how{display:none}.hero .lead{max-width:520px;font-size:18px}
.hcopy,.hgrid>*{min-width:0}.hcopybox,.hcopybox .code{max-width:100%;min-width:0}
