:root{color-scheme:dark;--bg:#101010;--surface:#181818;--surface-raised:#252525;--line:#383838;--text:#f3f3f3;--muted:#b4b4b4;--accent:#f2f2f2;--ink:#181818;--sans:Inter,"PingFang SC","Microsoft YaHei",system-ui,sans-serif;--serif:"Songti SC","STSong",Georgia,serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:110px}
body{margin:0;background:#090909;color:var(--text);font-family:var(--sans);-webkit-font-smoothing:antialiased;line-height:1.65}
body.modal-open{overflow:hidden}
a{color:inherit;text-decoration:none}
button,input{font:inherit}
button{color:inherit;cursor:pointer;border:0}
button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
button:disabled{opacity:.35;cursor:default}
a:focus-visible,button:focus-visible,[tabindex]:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
h1,h2,h3,h4,p,figure{margin:0}
img{display:block;max-width:100%}
ul{padding-left:20px}
[hidden]{display:none!important}.ico{display:inline-block;width:1em;height:1em;vertical-align:-.15em;flex:none}.card-link>span .ico,.case-open .ico,.small-icon .ico,.education-symbol .ico{width:.75em;height:.75em}.button span[aria-hidden] .ico,.case-card-bottom .ico,.case-card-copy h3 .ico,.back-top .ico,.case-next h2 .ico{width:.8em;height:.8em}.icon-button .ico{width:.85em;height:.85em}.back-link{gap:7px}.back-link .ico{vertical-align:-.2em}.demo-action{display:inline-flex;align-items:center;gap:5px}.text-link>span .ico{width:1.35em;height:1.35em}
::selection{background:#e4e4e4;color:#111}
.site-shell{width:min(1360px,calc(100% - 48px));margin:24px auto;border:1px solid #2a2a2a;border-radius:24px;background:radial-gradient(ellipse 580px 460px at 50% 130px,#ffffff05,transparent),var(--bg);box-shadow:0 24px 100px #00000044;position:relative}
.wrap{width:calc(100% - 96px);max-width:1168px;margin-inline:auto}
.section{padding-block:56px}
section[id]{scroll-margin-top:22px}
.muted{color:var(--muted)}
.eyebrow,.small-label{font-size:11px;letter-spacing:.07em;color:var(--muted)}
.small-label{display:block}
.section-label{display:flex;align-items:center;gap:13px;font-size:10px;letter-spacing:.12em;color:#aaa;margin-bottom:24px}
.section-label>span:first-child{display:grid;place-items:center;width:30px;height:30px;border:1px solid #494949;border-radius:50%;color:#ccc;font-family:Georgia,serif;font-size:13px;letter-spacing:0}
.section-label:after{content:'';height:1px;flex:1;background:linear-gradient(90deg,#45454580,transparent);margin-left:10px}
.button{display:inline-flex;align-items:center;justify-content:space-between;gap:28px;padding:13px 21px;min-height:48px;border:1px solid #535353;border-radius:100px;font-size:13px;background:transparent;transition:background .2s,transform .2s}
.button:hover{background:#2b2b2b;transform:translateY(-2px)}
.primary{background:#f0f0f0;border-color:#f0f0f0;color:#151515;font-weight:500}
.primary:hover{background:#fff;border-color:#fff}
.button span[aria-hidden]{font-size:22px;line-height:1}
.text-link{display:inline-flex;align-items:center;gap:16px;font-size:13px;min-height:44px}
.text-link:hover{color:var(--accent)}
.icon-button{display:inline-grid;place-items:center;width:40px;height:40px;border:1px solid #474747;border-radius:50%;background:#1e1e1e;font-size:21px}
.icon-button:hover:not(:disabled){background:#363636}
.tags{display:flex;flex-wrap:wrap;gap:7px}
.tags span{font-size:11px;border:1px solid #414141;padding:4px 11px;border-radius:100px;color:#bcbcbc;background:transparent}
.skip-link{position:fixed;top:-100px;left:30px;z-index:99;background:var(--accent);color:var(--ink);padding:12px 20px}
.skip-link:focus{top:12px}
/* A quiet frame and compact navigation. */
.site-header{position:sticky;top:0;z-index:20;background:#101010;border-bottom:1px solid #2a2a2a;border-radius:26px 26px 0 0}
.header-inner{height:88px;display:flex;align-items:center;justify-content:space-between;gap:24px}
/* The name at the top left: FDE in the site's gradient and what it stands for, in a pill that lights up
   on hover — it is the way back to the first page. Phones show FDE alone. */
.brand{display:inline-flex;align-items:center;gap:12px;padding:9px 16px 9px 15px;border:1px solid transparent;border-radius:16px;background:linear-gradient(#171717,#171717) padding-box,linear-gradient(100deg,#333,#2a2a2a) border-box;white-space:nowrap;transition:transform .2s,box-shadow .25s,background .25s}
.brand:hover{transform:translateY(-1px);background:linear-gradient(#1b1b1b,#1b1b1b) padding-box,var(--fde-grad) border-box;box-shadow:0 8px 28px #8fb3ff26}
.brand:active{transform:none}
.brand:focus-visible{outline:2px solid var(--fde-c);outline-offset:3px}
.brand-name{font-size:21px;font-weight:800;letter-spacing:.06em;line-height:1;background:var(--fde-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.brand-tag{padding-left:12px;border-left:1px solid #343434;font-size:13px;font-weight:500;letter-spacing:.08em;line-height:1.2;color:#b4b4b4;transition:color .2s}
.brand:hover .brand-tag{color:#ececec}
@media(max-width:1060px){.brand-tag{display:none}.brand{padding-inline:14px}}
/* Three distinct personal cards,drawn from the reference's composition. */
.hero{padding-top:48px}
.hero-heading{text-align:center;position:relative;padding-bottom:38px}.hero-heading>.hello{margin-top:4px}
.hero-kicker{display:inline-flex;align-items:center;gap:7px;font-size:11px;letter-spacing:.08em;border:1px solid #454545;padding:5px 11px;border-radius:30px;color:#c6c6c6;background:#1a1a1a}
.hero-kicker>i{width:5px;height:5px;border-radius:50%;background:var(--accent)}
.hello{font-size:12px;color:#b3b3b3;margin-top:22px}
.hero h1{font-size:68px;font-weight:400;line-height:1.3;letter-spacing:-.035em;margin-top:5px;display:flex;justify-content:center;align-items:baseline;gap:26px}
.hero h1>span{font-family:Georgia,serif;font-style:italic;font-size:72px;color:#a4a4a4;letter-spacing:-.045em;font-weight:400}
.hero-description{font-size:20px;line-height:1.75;margin-top:13px;color:#e0e0e0;font-weight:350}
.hero-description em{font-family:var(--serif);font-size:23px;font-style:normal;color:#eee}
.hero-board{display:grid;grid-template-columns:1fr 1.08fr 1fr;gap:16px}
.intro-card,.hero-photo,.hero-connect{min-width:0;min-height:380px;border:1px solid #3a3a3a;border-radius:18px;overflow:hidden;position:relative}
.intro-card{padding:28px;background:linear-gradient(145deg,#202020,#151515);display:flex;flex-direction:column}
.card-label{display:flex;gap:10px;align-items:center;font-size:8px;letter-spacing:.09em;color:#aaa}
.small-icon{display:grid;place-items:center;width:30px;height:30px;border:1px solid #555;border-radius:50%;font-size:20px;color:#ddd}
.intro-card h2{font-size:31px;line-height:1.5;font-weight:400;letter-spacing:-.03em;margin-top:23px}
.intro-card>p{font-size:14px;line-height:2;color:#c2c2c2;margin:18px 0 20px}.intro-identity{align-self:start;margin-top:24px;font-size:13px;color:#e0e0e0;border:1px solid #4f4f4f;border-radius:30px;padding:5px 14px;background:#ffffff08}.contact-closing{font-size:13px;line-height:1.9;color:#8f8f8f;margin-top:22px;max-width:460px}
.intro-card .tags{margin:18px 0 17px}
.intro-card .tags span{font-size:10px;background:transparent;border-color:#444;padding:3px 11px;color:#b9b9b9}
.card-link{display:flex;align-items:center;justify-content:space-between;font-size:12px;border-top:1px solid #434343;padding-top:15px;margin-top:auto;color:#e5e5e5}
.card-link>span{display:grid;place-items:center;font-size:20px;width:25px;height:25px;border-radius:50%;background:#d9d9d9;color:#1a1a1a}
.hero-photo{isolation:isolate;background:#777;border-color:#777}
.hero-photo>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 35%;filter:saturate(.9);z-index:-2}
.hero-photo:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#15151518,transparent 32%,#101010e6 78%);z-index:-1}
.photo-label{position:absolute;top:19px;left:20px;font-size:8px;letter-spacing:.12em;background:#1717178c;border:1px solid #ffffff70;border-radius:30px;padding:5px 10px;backdrop-filter:blur(8px)}
.hero-photo figcaption{position:absolute;bottom:22px;left:23px;right:23px;color:#fff}.photo-title{display:block;font-size:17px;font-family:var(--serif);line-height:1.6;white-space:nowrap}.hero-photo figcaption>p{font-size:12px;line-height:1.85;color:#e6e6e6;margin-top:10px;text-shadow:0 1px 8px #0009}
.photo-cross{font-family:Georgia,serif;font-size:42px;color:#fff;line-height:1}
.hero-connect{display:flex;flex-direction:column;padding:28px;background:radial-gradient(ellipse at 100% 0,#ffffff0b,transparent 75%),#242424;color:#f0f0f0;border-color:#555;isolation:isolate}
.hero-connect .card-label{color:#b8b8b8;font-size:8px}
.hero-connect .small-icon{color:#ddd;border-color:#777;background:transparent}
.connect-role{font-family:Georgia,serif;font-style:italic;font-size:20px;color:#c0c0c0;margin-top:26px;line-height:1.3}
.hero-connect h2{font-size:31px;line-height:1.45;font-weight:400;margin-top:6px;letter-spacing:-.035em}
.hero-connect>p{font-size:13px;line-height:1.85;color:#bcbcbc;margin-top:13px}
.hero-connect>.button{margin-top:auto;background:#eee;color:#161616;border-color:#eee;position:relative;width:100%;font-size:12px}
.hero-connect>.button:hover{background:#fff}
.connect-orbit{position:absolute;right:-47px;top:90px;width:180px;height:180px;opacity:.2;z-index:-1;transform:rotate(-25deg)}
.connect-orbit>i{position:absolute;inset:0;border:1px solid #ddd;border-radius:50%}
.connect-orbit>i:nth-child(2){inset:0 38px}
.connect-orbit>i:nth-child(3){inset:38px 0}
.hero-foot{display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:10px;color:#959595;padding-block:25px}
.hero-foot>a{display:flex;align-items:center;gap:13px;color:#ccc}
.hero-foot>a>span{font-size:18px}
/* A small archive,with a clear card-to-detail relationship. */
.past-section{background:#141414;border-block:1px solid #303030;position:relative}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:28px}
.section-heading h2{font-size:43px;font-weight:450;line-height:1.35;letter-spacing:-.04em}
.section-heading h2>span{display:block;font-family:var(--serif);font-size:24px;font-weight:400;letter-spacing:0;color:#bdbdbd;margin-top:6px}
.section-heading>p{max-width:350px;font-size:14px;line-height:1.95;color:#b0b0b0}
.timeline-tools{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#aaa;margin-top:24px}
.timeline-tools>div{display:flex;gap:8px}
.timeline-instruction{font-size:11px;color:#9b9b9b;margin:3px 0 14px}
.journey-track{display:grid;grid-auto-flow:column;grid-auto-columns:215px;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:#666 #222;position:relative;padding:5px 0 16px;cursor:grab;overscroll-behavior-x:contain}
.journey-track.is-dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}
.timeline-card{position:relative;display:flex;flex-direction:column;align-items:start;text-align:left;scroll-snap-align:start;padding:20px 20px 16px;background:linear-gradient(145deg,#252525,#1c1c1c);border:1px solid #454545;border-radius:15px;min-height:208px;white-space:normal;transition:background .2s,border-color .2s}
.timeline-card:focus-visible{outline-offset:-4px}
.timeline-card:hover{background:#303030;border-color:#777}
.timeline-period{font-size:10px;color:#a5a5a5;letter-spacing:-.015em;padding-right:15px;white-space:nowrap}
.timeline-node{position:absolute;top:16px;right:15px;color:#929292;font-size:17px}
.timeline-year{font-family:Georgia,serif;font-style:italic;font-size:38px;font-weight:400;line-height:1.2;letter-spacing:-.03em;color:#b1b1b1;margin-top:17px}
.timeline-card strong{font-size:17px;font-weight:500;color:#eee;margin-top:12px;letter-spacing:-.02em}
.timeline-position{font-size:11px;color:#b7b7b7;margin-top:5px}
.timeline-phase{font-size:10px;display:flex;align-items:center;justify-content:space-between;gap:10px;align-self:stretch;color:#a7a7a7;border-top:1px solid #474747;padding-top:12px;margin-top:16px}
.timeline-phase>span{font-size:15px}
.timeline-card.selected{background:#e8e8e8;border-color:#eee;box-shadow:0 5px 20px #0002}
.timeline-card.selected .timeline-period,.timeline-card.selected .timeline-position{color:#555}
.timeline-card.selected .timeline-year{color:#575757}
.timeline-card.selected strong{color:#171717}
.timeline-card.selected .timeline-phase{color:#555;border-color:#bcbcbc}
.timeline-card.selected .timeline-node{color:#444}
.career-panels{margin-top:12px}
.career-panel{display:grid;grid-template-columns:165px 1fr;border:1px solid #e2e2e2;border-radius:17px;overflow:hidden;background:#eaeaea;color:#222}
.career-index{background:#d9d9d9;padding:28px 24px;display:flex;flex-direction:column;align-items:start;position:relative;overflow:hidden;isolation:isolate;border-right:1px solid #c3c3c3}
.career-index>.career-mark{position:absolute;right:-26px;bottom:-34px;font-size:170px;line-height:0;color:#0000000d;z-index:-1}
.career-index>span{font-size:10px;letter-spacing:.09em;color:#666}
.career-index>strong{font-family:Georgia,serif;font-style:italic;font-size:47px;font-weight:400;line-height:1.2;color:#313131;margin-top:25px;letter-spacing:-.045em}
.career-index>small{font-size:10px;color:#666;line-height:1.8;margin-top:11px}
.career-content{padding:28px}
.career-heading{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px}
.career-heading .eyebrow{width:100%;font-size:10px;color:#656565;margin-bottom:2px}
.career-heading h3{font-size:28px;font-weight:450;line-height:1.5;color:#191919}
.career-position{font-size:11px;color:#555;border:1px solid #bbb;background:transparent;border-radius:30px;padding:3px 11px}
.career-content>h4{font-size:16px;font-weight:500;margin-top:16px;line-height:1.8;color:#252525}
.career-content>p{font-size:14px;line-height:1.95;color:#565656;margin-top:10px}
.career-work{display:grid;grid-template-columns:1.35fr 1fr;gap:14px;margin-top:23px}
.career-work>div{padding:19px;border:1px solid #d0d0d0;background:#f4f4f4;border-radius:12px}
.career-work>div:last-child{background:#dedede}
.career-work .small-label{font-size:11px;color:#333}
.career-work ul{padding-left:16px;margin:11px 0 0}
.career-work li,.career-work p{font-size:13px;line-height:1.9;color:#535353}
.career-work li::marker{color:#999}
.career-work li+li{margin-top:8px}
.career-work p{margin-top:11px}
.credits-label{margin:18px 0 10px}
.career-resume{margin-top:20px;padding:22px 24px;border:1px solid #d0d0d0;background:#f4f4f4;border-radius:12px}
.resume-block+.resume-block{margin-top:16px;padding-top:16px;border-top:1px dashed #cfcfcf}
.career-resume p{font-size:14px;line-height:1.9;color:#3f3f3f}
.career-resume p+p{margin-top:4px}
.career-resume .heading{font-weight:600;color:#1f1f1f}
.career-resume .bullet{position:relative;padding-left:16px}
.career-resume .bullet:before{content:'•';position:absolute;left:2px;color:#888}
.career-resume .numbered{padding-left:1.4em;text-indent:-1.4em}
.education-note>div>span+span{color:#8a8a8a}.education-note+.education-note{margin-top:10px}
.career-work .tags span{font-size:10px;padding:3px 8px;color:#5b5b5b;border-color:#b7b7b7}
.education-note{display:flex;align-items:center;gap:18px;border:1px solid #393939;border-radius:13px;background:#1c1c1c;padding:18px 22px;margin-top:14px;color:#aaa}
.education-symbol{display:grid;place-items:center;width:31px;height:31px;border-radius:8px;background:#303030;color:#ccc;font-size:22px}
.education-note>div{display:flex;align-items:baseline;flex-wrap:wrap;gap:14px;flex:1}
.education-note strong{font-size:13px;color:#ddd;font-weight:450}
.education-note>div>span,.education-note time{font-size:11px}
.education-note time{white-space:nowrap}
/* Original product imagery inside neutral display spaces. */
.case-context{display:flex;align-items:center;gap:23px;border:0;border-radius:0;background:transparent;padding:10px 0 10px 22px;margin:0 0 32px;border-left:2px solid #707070}
.case-context>span{color:#dedede;font-family:Georgia,serif;font-style:italic;font-size:28px;line-height:1.2;white-space:nowrap}
.case-context small{display:block;font-family:var(--sans);font-size:8px;font-style:normal;color:#909090;letter-spacing:.02em;margin-top:7px}
.case-context>p{font-size:12px;line-height:1.9;color:#aaa;border-left:1px solid #393939;padding-left:23px;max-width:740px}
.case-grid{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;gap:24px}
/* Each cover is a real capture of the demo, shown flat and large, bleeding off the right edge. */
.case-card{--tint:#6f6f6f;min-width:0;display:flex;flex-direction:column;background:#181818;border:1px solid #333;border-radius:18px;overflow:hidden;transition:transform .3s,border-color .3s,box-shadow .3s}
.case-card.sage{--tint:#3f8a68}
.case-card.blue{--tint:#1592ad}
.case-card.sand{--tint:#86a46f}
.case-card.violet{--tint:#8b5cf6}
.case-card:hover{transform:translateY(-4px);border-color:#5a5a5a;box-shadow:0 22px 44px #00000055}
.case-cover{position:relative;aspect-ratio:16/11;overflow:hidden;isolation:isolate;background:radial-gradient(90% 75% at 88% 6%,color-mix(in srgb,var(--tint) 42%,transparent),transparent 70%),linear-gradient(160deg,#232323,#151515 70%);border-bottom:1px solid #2c2c2c}
.case-cover:before{content:'';position:absolute;inset:0;z-index:-1;background-image:linear-gradient(#ffffff08 1px,transparent 1px),linear-gradient(90deg,#ffffff08 1px,transparent 1px);background-size:28px 28px;mask-image:linear-gradient(180deg,#000 10%,transparent 60%)}
.case-cover-top{position:absolute;top:20px;left:24px;right:20px;display:flex;align-items:center;gap:12px;color:#d6d6d6}
.case-index{font-family:Georgia,serif;font-style:italic;font-size:22px;line-height:1;color:#f0f0f0}
.case-kicker{font-size:10px;letter-spacing:.12em;color:#a9a9a9;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.case-live{display:inline-flex;align-items:center;gap:6px;font-size:10px;color:#e6e6e6;padding:5px 10px;border-radius:30px;border:1px solid #ffffff26;background:#ffffff0d;white-space:nowrap}
.case-live>i{width:6px;height:6px;border-radius:50%;background:color-mix(in srgb,var(--tint) 70%,#fff);box-shadow:0 0 0 3px color-mix(in srgb,var(--tint) 30%,transparent)}
.case-open{width:31px;height:31px;display:grid;place-items:center;border-radius:50%;border:1px solid #ffffff2e;background:#ffffff0d;font-size:23px;flex:none;transition:background .3s,color .3s}
.case-card:hover .case-open{background:#f2f2f2;color:#151515}
.cover-shot{position:absolute;top:66px;left:24px;width:112%;margin:0;border-radius:10px 0 0 0;overflow:hidden;background:#0f0f0f;box-shadow:0 0 0 1px #ffffff1f,0 26px 50px #00000080;transition:transform .45s cubic-bezier(.2,.7,.2,1)}
.cover-shot>img{display:block;width:100%;height:auto;aspect-ratio:16/10}
.case-card:hover .cover-shot{transform:translate(-8px,-6px)}
.case-card-copy{padding:24px;display:flex;flex-direction:column;flex:1}
.case-card-copy h3{font-size:25px;line-height:1.5;font-weight:450;display:flex;align-items:start;justify-content:space-between;gap:12px;letter-spacing:-.025em;color:#f1f1f1}
.case-card-copy h3>span{font-size:22px;color:#bbb}
.case-card-copy>p{font-size:14px;line-height:1.95;color:#b1b1b1;margin-top:12px}
.case-role{display:inline-block;margin-top:16px;border:0;border-radius:0;padding:0;font-size:11px;color:#aaa;background:transparent}
.case-card-bottom{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:#d0d0d0;border-top:1px solid #333;margin-top:auto;padding-top:14px}
.case-card-copy>.case-role{margin-bottom:20px}
.case-card-bottom>span:last-child{font-size:22px;line-height:1}
/* A quiet note shelf and a charcoal contact card. */
.knowledge-section{padding-block:8px 40px}
.knowledge-layout{display:flex;align-items:center;gap:26px;padding:30px 34px;background:linear-gradient(110deg,#222,#191919);border:1px solid #414141;border-radius:20px}
.knowledge-layout>div:nth-child(2){flex:1}
.knowledge-layout h2{font-size:31px;font-weight:450;letter-spacing:-.03em}
.knowledge-layout p{font-size:13px;color:#aaa;margin-top:7px}
.coming-soon{display:inline-flex;align-items:center;gap:7px;border:1px solid #555;padding:7px 13px;border-radius:100px;font-size:11px;color:#bcbcbc;white-space:nowrap;background:#292929}
.coming-soon>i{height:5px;width:5px;border-radius:50%;background:#999}
.notebook-art{position:relative;width:80px;height:80px;flex:none}
.notebook-art>i{position:absolute;width:47px;height:61px;border:1px solid #ffffff30;border-radius:7px;background:#555;top:8px;left:16px;transform:rotate(-20deg)}
.notebook-art>i:nth-child(2){background:#999;transform:rotate(-7deg)}
.notebook-art>i:nth-child(3){background:#ddd;transform:rotate(8deg);box-shadow:3px 5px 9px #00000033}
.notebook-art>span{position:absolute;top:18px;left:30px;color:#555;font-size:28px;transform:rotate(8deg)}
.contact-section{border-top:1px solid #333;padding-block:40px 40px}
.contact-layout{display:grid;grid-template-columns:1.35fr 1fr;gap:64px;align-items:center;padding-top:10px}
.contact-copy{position:relative}
.contact-stamp{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:0;border:1px dashed #555;border-radius:50%;width:82px;height:82px;margin-bottom:24px;transform:rotate(-12deg);color:#aaa}
.contact-stamp>span{font-size:6px;letter-spacing:.14em}
.contact-stamp>i{font-family:Georgia,serif;font-size:32px;font-weight:400;line-height:1.3}
.contact-layout h2{font-size:clamp(38px,4.2vw,58px);font-weight:400;line-height:1.36;letter-spacing:-.05em}
.contact-layout h2 em{font-family:var(--serif);font-weight:400;font-style:normal;letter-spacing:-.03em;color:#aaa}
.contact-copy>p{font-size:14px;color:#aaa;line-height:2;margin-top:23px}
.contact-copy>.tags{margin-top:24px}
.contact-card{padding:32px;border:1px solid #5a5a5a;border-radius:22px;background:radial-gradient(ellipse at 100% 0,#ffffff09,transparent 70%),#252525;color:#ddd;box-shadow:0 12px 45px #00000033;display:flex;flex-direction:column;align-items:start;position:relative}
.contact-card-top{display:flex;justify-content:space-between;align-items:center;width:100%;padding-bottom:27px;border-bottom:1px solid #535353;margin-bottom:27px}
.contact-spark{font-size:38px;color:#d3d3d3;line-height:1}
.contact-card-top>span:last-child{font-size:9px;line-height:1.8;letter-spacing:.05em;color:#aaa;text-align:right}
.contact-card .eyebrow{color:#aaa;font-size:9px}
.contact-number{font-size:clamp(27px,2.8vw,39px);line-height:1.4;letter-spacing:-.055em;font-variant-numeric:tabular-nums;margin-top:12px;color:#eee}
.contact-card>.muted{font-size:12px;color:#aaa;margin-top:6px}
.contact-card>.primary{background:#eee;border-color:#eee;color:#181818;width:100%;margin-top:26px}
.contact-card>.primary:hover{background:#fff}
.contact-card>.text-link{font-size:11px;align-self:center;margin-top:9px;color:#bbb}
.site-footer{display:grid;grid-template-columns:1.55fr 1fr;gap:16px;padding-bottom:22px}
.footer-identity,.footer-explore{border:1px solid #353535;border-radius:17px;position:relative;padding:27px;overflow:hidden;background:linear-gradient(145deg,#1c1c1c,#242424);isolation:isolate}
.footer-brand{font-size:26px;font-weight:800;letter-spacing:.06em;display:inline-block;line-height:1.4;background:var(--fde-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.footer-brand>span{display:block;font-size:13px;font-weight:500;letter-spacing:.12em;color:#9a9a9a;-webkit-text-fill-color:#9a9a9a;margin-top:4px}
.footer-identity>p{font-size:12px;color:#aaa;line-height:1.85;margin-top:21px}
.footer-watermark{font-size:170px;line-height:1;font-weight:800;letter-spacing:-.02em;position:absolute;right:0;bottom:-17px;color:#ffffff09;z-index:-1}
.footer-explore{background:radial-gradient(ellipse at 100% 100%,#60606030,transparent),#262626;display:flex;flex-direction:column}
.footer-explore>.small-label{color:#aaa}
.footer-explore>nav{display:flex;gap:7px;flex-wrap:wrap;margin-top:18px}
.footer-explore>nav a{border:1px solid #444;border-radius:30px;padding:4px 11px;font-size:11px;color:#bcbcbc;background:transparent}
.footer-explore>nav a:hover{background:#3a3a3a}
.back-top{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:#bbb;margin-top:auto;padding-top:22px}
.back-top>span{font-size:22px}
.footer-bottom{grid-column:1/-1;display:flex;justify-content:space-between;gap:20px;font-size:9px;letter-spacing:.04em;color:#888;padding-top:9px}
.back-link{display:inline-flex;align-items:center;min-height:38px;font-size:12px;color:#ccc;border:1px solid #454545;border-radius:30px;padding:4px 14px;background:#202020}
.back-link:hover{background:#333}
.demo-note{font-size:11px;color:#b5b5b5;border:1px solid #454545;border-radius:20px;padding:6px 11px;background:#202020}
.demo-window{border:1px solid #777;border-radius:17px;overflow:hidden;background:#f5f5f5;box-shadow:0 18px 55px #00000044}
.demo-window-bar{display:flex;align-items:center;gap:20px;min-height:49px;padding:10px 16px;background:#ddd;color:#555;font-size:11px;border-bottom:1px solid #bbb}
.window-traffic{display:flex;gap:5px}
.window-traffic i{width:7px;height:7px;border-radius:50%;background:#999}
.window-traffic i:first-child{background:#888}
.window-traffic i:nth-child(2){background:#aaa}
.demo-window-bar>span{flex:1;text-align:center}
.demo-action{font-size:11px;color:#333;background:#eee;border:1px solid #aaa;border-radius:30px;padding:4px 11px;min-height:28px;white-space:nowrap}
.demo-action:hover{background:#fff}
.demo-window iframe{display:block;width:100%;height:690px;border:0;background:#f7f7f7}
.demo-caption{font-size:11px;color:#aaa;line-height:1.95;margin-top:15px;max-width:900px}
.delivery-list{padding-left:18px;font-size:12px;line-height:2;color:#bcbcbc;margin-top:20px}
.delivery-list li+li{margin-top:7px}
.delivery-list li::marker{color:#888}
.case-next{display:flex;align-items:center;justify-content:space-between;gap:35px;padding-block:55px}
.case-next .eyebrow{color:#aaa;font-size:10px}
.case-next h2{font-size:30px;font-weight:450;margin-top:9px;letter-spacing:-.03em}
.case-next h2>span{color:#ccc;margin-left:14px}
.case-next .button{font-size:12px}
/* Case pages: a compact title row,the working demo,then a short project note. */
.case-top{padding-block:24px 6px}.case-title-row{display:flex;align-items:center;gap:18px;margin-bottom:14px}.case-title-row .back-link{flex:none;gap:6px}.case-title{flex:1;min-width:0}.case-title h1{font-size:21px;font-weight:500;line-height:1.4;letter-spacing:-.01em}.case-title p{font-size:12px;line-height:1.7;color:#a8a8a8;margin-top:2px}.case-title-row .demo-note{flex:none;white-space:nowrap}
.case-about{padding-top:44px}.case-about>h2{font-size:19px;font-weight:500;margin-bottom:14px}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.about-grid+.about-features,.about-features+.about-grid{margin-top:12px}.about-grid>article{padding:22px;border:1px solid #393939;border-radius:14px;background:#1b1b1b}.about-grid p{font-size:13px;line-height:1.95;color:#b8b8b8;margin-top:10px}.about-grid .about-lead{font-size:14px;color:#e8e8e8}.about-grid .tags{margin-top:16px}.about-foundation{margin-top:16px}.about-features{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}.about-features>article{padding:18px 20px;border:1px solid #333;border-radius:12px;background:#171717}.about-features h3{font-size:14px;font-weight:500;line-height:1.6}.about-features p{font-size:12px;line-height:1.85;color:#a8a8a8;margin-top:6px}.case-page .case-next{padding-block:40px}.case-page .case-next h2{font-size:22px}
/* Dialogs and feedback. */
.copy-dialog::backdrop{background:#000000b3;backdrop-filter:blur(8px)}
.copy-dialog{padding:30px;border:1px solid #555;border-radius:20px;background:#222;color:var(--text);width:min(390px,calc(100% - 32px))}
.copy-dialog>.icon-button{position:absolute;right:17px;top:17px}
.copy-dialog h2{font-size:27px;font-weight:450;margin-top:28px}
.copy-dialog>p{font-size:13px;color:#bbb;margin-block:15px}
.copy-dialog input{width:100%;background:#eee;border:1px solid #aaa;color:#222;padding:13px;border-radius:9px;font-size:25px}
.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,15px);background:#eee;color:#222;border:1px solid #ccc;border-radius:100px;padding:12px 22px;box-shadow:0 8px 40px #00000077;font-size:12px;max-width:90%;width:max-content;z-index:60;opacity:0;pointer-events:none;transition:.2s}
.toast.visible{opacity:1;transform:translate(-50%,0)}
.missing-page,.redirect-page{padding-block:100px}
.missing-page h1,.redirect-page h1{font-size:40px;font-weight:400;margin-block:30px}
.redirect-page p{color:var(--muted);margin-block:20px}
@media(min-width:1600px){.site-shell{margin-block:38px}.hero{padding-top:48px}.hero-heading{padding-bottom:37px}.hero-board>div,.hero-photo{min-height:390px}}
@media(max-width:1150px){.site-shell{width:calc(100% - 32px);margin-block:16px}.wrap{width:calc(100% - 64px)}.header-inner{gap:16px;height:80px}.hero h1{font-size:59px}.hero h1>span{font-size:62px}.hero-board{gap:12px;grid-template-columns:1fr 1fr 1fr}.intro-card,.hero-connect{padding:22px}.intro-card h2,.hero-connect h2{font-size:27px}.card-label{font-size:7px;gap:7px}.small-icon{width:26px;height:26px;font-size:17px}.intro-card>p{font-size:12px}.hero-connect .card-label{font-size:7px}.section-heading h2{font-size:39px}.section-heading h2>span{font-size:22px}.section-heading>p{max-width:310px;font-size:12px}.career-panel{grid-template-columns:140px 1fr}.career-index{padding:25px 19px}.career-index>strong{font-size:43px}.career-content{padding:24px}.career-work{grid-template-columns:1.2fr 1fr}.career-work>div{padding:16px}.case-card-copy{padding:22px}.case-card-copy h3{font-size:23px}.contact-layout{gap:38px}.contact-card{padding:27px}.contact-number{font-size:30px}}
@media(max-width:900px) and (min-width:761px){.hero-board{grid-template-columns:1fr 1fr;gap:14px}.intro-card{grid-column:1/-1;min-height:0;display:grid;grid-template-columns:1fr 1fr;gap:12px 24px}.intro-card .card-label{grid-column:1}.intro-card h2{grid-column:1;grid-row:2/4;margin:0;font-size:29px}.intro-card>p{grid-column:2;grid-row:1/4;margin:0;max-width:none;align-self:center}.intro-card .tags{margin:0}.intro-card .intro-identity{grid-column:1;grid-row:2;margin:0;justify-self:start}.intro-card .card-link{grid-column:2;grid-row:4;margin:0;padding-top:10px}.hero-photo,.hero-connect{min-height:315px}.hero-photo>img{object-position:50% 30%}.hero-connect h2{font-size:31px}.hero-connect>.button{margin-top:22px}.connect-role{margin-top:22px}.career-work{grid-template-columns:1fr}.case-card-copy h3{font-size:21px}.education-note{gap:12px}.education-symbol{display:none}.contact-layout{gap:24px}.contact-layout h2{font-size:38px}.contact-number{font-size:27px}}
@media(max-width:760px){.case-top{padding-top:18px}.case-title-row{flex-wrap:wrap;gap:10px 12px}.case-title{flex-basis:100%;order:2}.case-title h1{font-size:19px}.case-title-row .demo-note{white-space:normal;order:3}.about-grid{grid-template-columns:1fr}.about-grid>article{padding:18px}.case-about{padding-top:34px}
 html{scroll-padding-top:80px}.site-shell{width:calc(100% - 20px);margin:10px auto;border-radius:20px}.wrap{width:calc(100% - 36px)}.site-header{border-radius:20px 20px 0 0}.header-inner{height:68px}.brand{gap:9px}
 .hero{padding-top:25px}.hero-heading{padding-bottom:24px}.hero-kicker{font-size:9px;padding:4px 10px}.hello{font-size:11px;margin-top:17px}.hero h1{font-size:51px;line-height:1.25;gap:0;display:block;margin-top:5px}.hero h1>span{display:block;font-size:31px;margin-top:5px;letter-spacing:-.04em}.hero-description{font-size:13px;margin-top:15px;line-height:1.7}.hero-description em{display:block;font-size:19px}
 .hero-board{grid-template-columns:1fr 1fr;gap:11px}.intro-card{grid-column:1/-1;min-height:0;padding:20px;display:grid;grid-template-columns:1fr auto;gap:0 13px}.intro-card .card-label{grid-column:1/-1;font-size:8px}.intro-card .small-icon{width:22px;height:22px;font-size:15px}.intro-card h2{font-size:24px;margin-top:13px;grid-column:1/-1;line-height:1.45}.intro-card h2 br{display:none}.intro-card>p{font-size:12px;margin-top:11px;grid-column:1/-1;max-width:none;line-height:1.85}.intro-card .tags{margin:16px 0 0;gap:5px}.intro-card .tags span{font-size:9px;padding:2px 8px}.intro-card .card-link{font-size:10px;gap:12px;padding:0;border:0;margin-top:16px}.intro-card .card-link>span{width:21px;height:21px;font-size:17px}
 .hero-photo,.hero-connect{min-height:285px;border-radius:15px}.hero-photo{grid-column:1/-1;min-height:430px}.hero-connect{grid-column:1/-1}.intro-card .intro-identity{grid-column:1/-1;justify-self:start;font-size:12px;margin-top:16px}.intro-card>p{margin:11px 0 0}.hero-photo figcaption>p{font-size:12px}.contact-closing{font-size:12px}.hero-photo>img{object-position:80% 36%}.photo-label{top:12px;left:12px;right:auto;font-size:6px;letter-spacing:.06em;padding:4px 7px}.hero-photo figcaption{left:15px;right:14px;bottom:17px;font-size:14px;line-height:1.6}.photo-cross{font-size:23px;display:none}.hero-connect{padding:17px}.hero-connect .card-label{font-size:6px;letter-spacing:.02em;display:block;line-height:1.7}.hero-connect .small-icon{width:25px;height:25px;margin-bottom:9px;font-size:19px}.connect-role{font-size:14px;margin-top:15px}.hero-connect h2{font-size:23px;line-height:1.4;margin-top:4px}.hero-connect>p{font-size:10px;line-height:1.85;margin-top:11px}.hero-connect>.button{font-size:10px;padding:9px 13px;min-height:39px;gap:10px;margin-top:19px}.hero-connect>.button span{font-size:18px}.connect-orbit{width:130px;height:130px;right:-50px;top:91px}.hero-foot{font-size:9px;padding-block:20px}.hero-foot>a{gap:9px}.hero-foot>a>span{font-size:16px}
 .section{padding-block:36px}.section-label{font-size:8px;gap:10px;margin-bottom:22px;letter-spacing:.1em}.section-label>span:first-child{width:25px;height:25px;font-size:11px}.section-label:after{margin-left:4px}.section-heading{display:block;margin-bottom:23px}.section-heading h2{font-size:36px}.section-heading h2>span{font-size:21px;margin-top:6px}.section-heading>p{font-size:12px;line-height:1.9;margin-top:16px;max-width:none}
 .timeline-tools{font-size:10px;margin-top:17px}.timeline-tools .icon-button{width:34px;height:34px;font-size:18px}.timeline-instruction{font-size:10px;margin:4px 0 13px;line-height:1.8}.journey-track{grid-auto-columns:194px;gap:10px;padding:5px 0 14px}.timeline-card{padding:18px 17px 15px;min-height:204px;border-radius:13px}.timeline-period{font-size:9px}.timeline-year{font-size:34px;margin-top:14px}.timeline-card strong{font-size:16px;margin-top:10px}.timeline-position{font-size:10px}.timeline-phase{font-size:9px;margin-top:14px;padding-top:11px}.timeline-node{right:13px;top:12px;font-size:15px}.career-panels{margin-top:6px}.career-panel{display:block;border-radius:15px}.career-index{border-right:0;border-bottom:1px solid #c3c3c3;padding:20px 22px;display:grid;grid-template-columns:1fr auto;gap:6px 16px}.career-index>span{font-size:9px}.career-index>strong{margin:0;font-size:42px;grid-column:2;grid-row:1/3}.career-index>small{margin:0;font-size:10px}.career-index>.career-mark{font-size:110px;right:80px;bottom:-26px}.career-content{padding:22px 19px}.career-heading{gap:7px 10px}.career-heading .eyebrow{font-size:9px}.career-heading h3{font-size:25px}.career-position{font-size:10px;padding:3px 8px}.career-content>h4{font-size:15px;line-height:1.8;margin-top:16px}.career-content>p{font-size:12px;line-height:1.95;margin-top:11px}.career-work{grid-template-columns:1fr;gap:12px;margin-top:18px}.career-work>div{padding:17px 15px}.career-work .small-label{font-size:11px}.career-work li,.career-work p{font-size:12px}.career-work .tags span{font-size:9px}.career-resume{padding:16px 15px;margin-top:16px}.career-resume p{font-size:13px}.education-note{display:grid;grid-template-columns:65px 1fr;gap:7px 11px;padding:18px;margin-top:12px;border-radius:12px}.education-symbol{display:none}.education-note .small-label{font-size:10px;padding-top:2px}.education-note>div{display:block}.education-note strong{font-size:13px}.education-note>div>span{font-size:10px;display:block;margin-top:3px}.education-note time{grid-column:2;font-size:10px}
 .case-context{display:block;padding:18px;margin-bottom:22px}.case-context>span{display:flex;align-items:baseline;gap:12px;font-size:23px}.case-context small{display:inline;font-size:8px;margin:0}.case-context>p{border:0;padding:0;margin-top:10px;font-size:11px;line-height:1.9}.case-grid{grid-template-columns:1fr;gap:20px;padding-bottom:0}.case-card{border-radius:16px}.case-cover-top{top:16px;left:18px;right:16px;gap:10px}.case-index{font-size:19px}.case-kicker{visibility:hidden}.case-live{font-size:9px;padding:4px 8px}.case-open{width:28px;height:28px;font-size:21px}.cover-shot{top:56px;left:18px;width:118%}.case-card:hover{transform:none}.case-card-copy{padding:20px}.case-card-copy h3{font-size:23px;gap:10px}.case-card-copy h3>span{font-size:19px}.case-card-copy>p{font-size:12px;line-height:1.95;margin-top:10px}.case-role{font-size:9px;line-height:1.7;padding:5px 8px;margin-top:14px;border-radius:7px}.case-card-bottom{font-size:10px;margin-top:17px;padding-top:11px}
 .knowledge-section{padding-block:2px 42px}.knowledge-layout{display:grid;grid-template-columns:54px 1fr;gap:14px;padding:22px 18px;border-radius:16px}.notebook-art{width:54px;height:65px;grid-row:1/3;transform:scale(.8);transform-origin:left center}.notebook-art>i{left:7px}.notebook-art>span{left:21px}.knowledge-layout h2{font-size:27px}.knowledge-layout p{font-size:11px;line-height:1.8;margin-top:5px}.coming-soon{grid-column:2;width:max-content;font-size:9px;padding:4px 9px}.coming-soon>i{width:4px;height:4px}
 .contact-section{padding-block:32px}.contact-layout{display:block;padding-top:0}.contact-stamp{width:64px;height:64px;margin-bottom:20px}.contact-stamp>i{font-size:27px}.contact-stamp>span{font-size:5px}.contact-layout h2{font-size:43px;line-height:1.35}.contact-copy>p{font-size:12px;line-height:1.9;margin-top:19px}.contact-copy>.tags{margin-top:20px;gap:6px}.contact-copy .tags span{font-size:9px;padding:4px 9px}.contact-card{margin-top:29px;padding:25px;border-radius:18px}.contact-card-top{margin-bottom:23px;padding-bottom:22px}.contact-spark{font-size:33px}.contact-card-top>span:last-child{font-size:8px}.contact-number{font-size:36px;margin-top:10px}.contact-card>.muted{font-size:11px}.contact-card>.primary{min-height:47px;font-size:12px;margin-top:23px}.contact-card>.text-link{font-size:11px}.contact-card .eyebrow{font-size:9px}
 .site-footer{grid-template-columns:1fr;gap:12px;padding-bottom:18px}.footer-identity,.footer-explore{padding:23px;border-radius:14px}.footer-brand{font-size:23px}.footer-identity>p{font-size:12px;line-height:1.85;margin-top:17px}.footer-watermark{font-size:155px;bottom:-15px;right:18px}.footer-explore>nav{gap:6px;margin-top:14px}.footer-explore>nav a{font-size:10px;padding:4px 9px}.back-top{padding-top:16px;font-size:10px}.back-top>span{font-size:20px}.footer-bottom{font-size:8px;padding-top:5px;gap:7px;flex-wrap:wrap}.back-link{font-size:10px;min-height:34px;padding:4px 12px}.demo-note{font-size:9px;display:inline-block;margin-top:12px;padding:5px 10px}.demo-window{border-radius:12px}.demo-window-bar{gap:7px;padding:8px 10px;font-size:8px;min-height:43px}.window-traffic{gap:3px}.window-traffic i{height:5px;width:5px}.demo-action{font-size:9px;padding:3px 8px;min-height:26px}.demo-window iframe{height:650px}.demo-caption{font-size:10px;line-height:1.9;margin-top:13px}.delivery-list{font-size:12px;margin-top:18px}.case-next{display:block;padding-block:38px}.case-next h2{font-size:27px;margin-top:7px}.case-next .eyebrow{font-size:9px}.case-next .button{font-size:11px;margin-top:23px;min-height:44px;padding:11px 18px}.missing-page h1,.redirect-page h1{font-size:30px}.toast{font-size:11px;padding:11px 18px}
}
@media(max-width:360px){.wrap{width:calc(100% - 28px)}.hero h1{font-size:47px}.hero-description em{font-size:17px}.intro-card{padding:17px;gap:0 6px}.intro-card h2{font-size:22px}.intro-card .card-link{gap:5px;font-size:9px}.intro-card .tags{gap:4px}.intro-card .tags span{font-size:8px;padding:2px 6px}.hero-board{gap:9px}.hero-connect{padding:14px}.hero-connect h2{font-size:20px}.hero-connect .card-label{font-size:5px}.hero-photo,.hero-connect{min-height:280px}.photo-label{font-size:5px;left:9px;padding:4px 6px}.hero-photo figcaption{font-size:13px;left:12px}.section-heading h2>span{font-size:19px}.career-content{padding:20px 16px}.career-heading h3{font-size:23px}.case-card-copy{padding:18px}.case-card-copy h3{font-size:21px}.case-context>span{gap:10px}.case-context small{font-size:7px}.contact-layout h2{font-size:38px}.contact-card{padding:22px}.contact-number{font-size:31px}.demo-window-bar .window-traffic{display:none}.footer-explore>nav a{font-size:9px;padding-inline:8px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
.demo-window.is-full{position:fixed;inset:0;z-index:80;display:flex;flex-direction:column;border:0;border-radius:0;box-shadow:0 0 0 100vmax #000000d9;background:#f3f1e9}.demo-window.is-full>iframe{flex:1;height:auto}

.api-demo .demo-window-bar{background:#1b1e23;color:#cbd5e1;border-bottom:1px solid #343a44}.api-demo .demo-action{background:#272c33;color:#e2e8f0;border-color:#404854}

/* AI introduction: restrained type and a single neutral palette. */
.intro-roles{display:flex;flex-direction:column;gap:7px;margin-top:24px;color:#e2e2e2;font-size:14px;font-weight:500;line-height:1.75;letter-spacing:0}
.intro-card>.intro-roles+p{margin-top:20px;color:#ababab;font-size:13px;font-weight:400;line-height:1.95;letter-spacing:0}
@media(max-width:900px) and (min-width:761px){.intro-card .intro-roles{grid-column:1;grid-row:2/4;margin-top:0;align-self:center}.intro-card>.intro-roles+p{grid-column:2;grid-row:1/4;margin-top:0}}
@media(max-width:760px){.intro-card .intro-roles{grid-column:1/-1;grid-row:auto;font-size:14px;gap:5px;margin-top:16px}.intro-card>.intro-roles+p{grid-column:1/-1;grid-row:auto;font-size:12px;margin-top:16px}}

/* Balance the credentials between career details and the next section. */
.past-section .career-panels+.education-note{margin-top:32px}
.past-section{padding-bottom:40px}
#cases.section{padding-top:48px}
@media(max-width:760px){.past-section .career-panels+.education-note{margin-top:24px}.past-section{padding-bottom:28px}#cases.section{padding-top:32px}}

/* Give each real application its actual viewport; retain the shared case frame. */
.case-page .site-shell{width:min(1480px,calc(100% - 32px));margin:16px auto}
.case-page .wrap{width:calc(100% - 48px);max-width:1400px}
.case-page .header-inner{height:68px}
.case-page .case-top{padding-top:18px}
.case-page .case-title-row{gap:14px;margin-bottom:12px}
.case-page .demo-note{max-width:35%;white-space:normal;font-size:11px;line-height:1.6}
.demo-window{display:flex;flex-direction:column;min-width:0}
.demo-window-bar{flex:none;min-height:42px;padding:7px 12px;gap:10px}
.demo-window-bar>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.demo-window iframe{min-width:0;height:clamp(440px,calc(100svh - 230px),880px);flex:none}
.demo-action{min-height:30px;padding:4px 10px}
.demo-window.is-full>iframe{min-height:0;flex:1 1 0;height:0}.demo-stage{position:relative;overflow:hidden;min-width:0;flex:none;height:clamp(440px,calc(100svh - 230px),880px);background:#f3f1e9}.demo-window .demo-stage>iframe{position:absolute;top:0;left:0;max-width:none;transform-origin:0 0}.demo-window.is-full>.demo-stage{flex:1 1 0;height:0;min-height:0}
.case-page .demo-caption{max-width:none;font-size:12px;line-height:1.8;margin-top:12px}
@media(max-width:760px){
 .case-page .site-shell{width:calc(100% - 16px);margin:8px auto;border-radius:16px}
 .case-page .wrap{width:calc(100% - 24px)}
 .case-page .header-inner{height:58px}
 .case-page .case-top{padding-top:12px}
 .case-page .case-title-row{gap:8px 10px}
 .case-page .case-title{flex-basis:auto;order:0}
 .case-page .case-title h1{font-size:18px}
 .case-page .case-title p{font-size:12px}
 .case-page .case-title-row .demo-note{display:none}
 .demo-window{border-radius:12px}
 .demo-window-bar{gap:6px;padding:6px 8px}
 .demo-window-bar .window-traffic{display:none}
 .demo-window-bar>span{text-align:left;font-size:10px}
 .demo-action{font-size:11px;padding:4px 8px}
 .demo-window iframe{height:clamp(460px,calc(100svh - 170px),760px)} .demo-stage{height:clamp(460px,calc(100svh - 170px),760px)}
 .case-page .demo-caption{font-size:11px}
 .case-page .case-next{gap:16px;flex-wrap:wrap}
}
/* 知识库 on the home page: heading row plus the app in a window (see src/knowledge-app.css). */
.knowledge-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:18px}
.knowledge-head h2{font-size:31px;font-weight:450;letter-spacing:-.03em}
.knowledge-head p{font-size:13px;color:#aaa;margin-top:6px}
.knowledge-count{color:#8f8f8f;margin-left:10px}
.knowledge-enter{white-space:nowrap;flex:none}
.knowledge-preview iframe{height:clamp(440px,72svh,620px)}
/* The home preview sits in a dark frame that matches the knowledge app. */
.knowledge-preview{border-color:#2e2e2e;background:#141414}
.knowledge-preview .demo-window-bar{background:#141414;color:#8f8f8f;border-bottom:1px solid #2a2a2a}
.knowledge-preview .window-traffic i,.knowledge-preview .window-traffic i:first-child,.knowledge-preview .window-traffic i:nth-child(2){background:#3a3a3a}
@media(max-width:760px){.knowledge-head{flex-direction:column;align-items:flex-start;gap:12px}.knowledge-head h2{font-size:27px}.knowledge-count{display:block;margin:2px 0 0}.knowledge-preview iframe{height:560px}}
/* 知识库 on a phone: no window inside the page (it scrolls against the page); categories and a
   button open the knowledge app full screen instead. */
.kb-mobile{display:none}
@media(max-width:760px){
 .knowledge-preview,.kb-page .demo-window,.kb-page .demo-caption{display:none}
 .kb-mobile{display:flex;flex-direction:column;gap:10px;margin-top:6px}
 .kb-mobile-item{display:grid;grid-template-columns:1fr auto;gap:4px 10px;padding:14px 16px;border:1px solid #333;border-radius:14px;background:#181818}
 .kb-mobile-item b{font-weight:500;font-size:16px}
 .kb-mobile-item span{color:#8f8f8f;font-size:12px;align-self:center}
 .kb-mobile-item small{grid-column:1/-1;color:#aaa;font-size:12.5px;line-height:1.7}
 .kb-mobile-open{justify-content:center;margin-top:6px}
}
/* Loading in the background: pictures fade in, a demo window shows a spinner until its program is ready. */
img[data-src]{opacity:0}
.cover-shot>img{transition:opacity .35s}
.demo-window{position:relative}
.demo-window.is-loading::after{content:"";position:absolute;left:50%;top:55%;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;border:2px solid #8885;border-top-color:#888;animation:demo-spin .8s linear infinite;pointer-events:none;z-index:2}
@keyframes demo-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.demo-window.is-loading::after{animation-duration:2.4s}}
/* 网页对话: a button on the right, a little below the middle, inside the site's frame. It slides in
   after the page has loaded, breathes until the visitor has opened it once, and a short hint pops
   up beside it once per visit. The chat window opens at the right, centred. */
.chat{position:fixed;right:28px;top:60%;z-index:60;font-size:13px}
.modal-open .chat{display:none}
.chat-open{position:relative;display:inline-flex;align-items:center;gap:9px;padding:13px 19px;border:1px solid #e8e8e8;border-radius:100px;background:#eee;color:#141414;font-size:13px;font-weight:500;box-shadow:0 12px 34px #00000073;transition:transform .25s cubic-bezier(.2,.8,.2,1.2),box-shadow .25s;animation:chat-in .75s cubic-bezier(.2,.9,.25,1.25) .8s both}
.chat-open:hover{transform:translateY(-3px) scale(1.04);box-shadow:0 16px 40px #00000080}
.chat-open .ico{width:1.25em;height:1.25em;transform-origin:70% 80%;animation:chat-wave 5s ease-in-out 2.5s infinite}
.chat-open::before{content:"";position:absolute;inset:-1px;border-radius:inherit;border:2px solid #eeeeee;opacity:0;pointer-events:none;animation:chat-halo 2.6s ease-out 1.8s infinite}
.chat.seen .chat-open::before,.chat.seen .chat-open .ico{animation:none}
.chat.is-open .chat-open{visibility:hidden}
.chat-dot{position:absolute;top:1px;right:3px;width:11px;height:11px;border-radius:50%;background:#ff5b4d;box-shadow:0 0 0 2px #eee;animation:chat-beat 1.4s ease-in-out infinite}
.chat-hint{position:absolute;right:calc(100% + 12px);top:50%;width:max-content;max-width:220px;padding:9px 14px;border-radius:14px;border-bottom-right-radius:4px;background:#1d1d1d;border:1px solid #3a3a3a;color:#eee;font-size:12.5px;line-height:1.5;box-shadow:0 10px 30px #00000066;transform:translate(10px,-50%) scale(.92);opacity:0;pointer-events:none;transition:opacity .35s,transform .35s cubic-bezier(.2,.9,.25,1.2);cursor:pointer}
.chat-hint.show{opacity:1;transform:translate(0,-50%);pointer-events:auto}
.chat-panel{position:fixed;right:24px;bottom:24px;width:min(400px,calc(100vw - 32px));height:min(640px,calc(100svh - 48px));display:flex;flex-direction:column;background:#161616;border:1px solid #363636;border-radius:20px;box-shadow:0 24px 70px #000000b3;overflow:hidden;transform-origin:right bottom;animation:chat-open .32s cubic-bezier(.2,.9,.25,1.1)}
.chat-panel[hidden]{display:none}
@keyframes chat-in{from{opacity:0;transform:translateX(60px) scale(.8)}to{opacity:1;transform:none}}
@keyframes chat-halo{0%{opacity:.75;transform:scale(1)}70%,100%{opacity:0;transform:scale(1.35,1.7)}}
@keyframes chat-wave{0%,80%,100%{transform:none}84%{transform:rotate(-14deg)}88%{transform:rotate(12deg)}92%{transform:rotate(-8deg)}96%{transform:rotate(4deg)}}
@keyframes chat-beat{0%,100%{transform:scale(1)}50%{transform:scale(1.25)}}
@keyframes chat-open{from{opacity:0;transform:translateY(24px) scale(.96)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.chat-open,.chat-open::before,.chat-open .ico,.chat-dot,.chat-panel{animation:none!important}.chat-open::before{display:none}}
.chat-panel header{display:flex;gap:12px;align-items:flex-start;justify-content:space-between;padding:16px 16px 13px 18px;border-bottom:1px solid #2a2a2a}
.chat-panel h2{font-size:15px;font-weight:500;color:#f2f2f2}
.chat-panel header p{margin-top:4px;font-size:11.5px;line-height:1.7;color:#999}
.chat-panel .icon-button{flex:none;width:32px;height:32px;font-size:16px}
.chat-log{flex:1;overflow:auto;list-style:none;margin:0;padding:16px;display:flex;flex-direction:column;gap:9px;overscroll-behavior:contain}
.chat-log li{max-width:82%;padding:9px 13px;border-radius:15px;line-height:1.7;white-space:pre-wrap;overflow-wrap:anywhere}
.chat-log .from-owner{align-self:flex-start;background:#262626;color:#e6e6e6;border-bottom-left-radius:5px}
.chat-log .from-visitor{align-self:flex-end;background:#eee;color:#141414;border-bottom-right-radius:5px}
.chat-log .failed{opacity:.5}
.chat-form{display:flex;gap:8px;align-items:flex-end;padding:11px 12px 6px;border-top:1px solid #2a2a2a}
.chat-form textarea{flex:1;min-height:40px;max-height:120px;resize:none;padding:9px 13px;border:1px solid #3a3a3a;border-radius:14px;background:#1f1f1f;color:#eee;font:inherit;line-height:1.6}
.chat-form textarea:focus{outline:none;border-color:#777}
.chat-send{flex:none;height:40px;padding:0 16px;border-radius:14px;border:0;background:#eee;color:#141414;font-weight:500}
.chat-note{min-height:1.5em;padding:0 16px 10px;font-size:11px;color:#8f8f8f}
@media(max-width:760px){
 /* phones: in the bottom-right corner, out of the way of what is being read */
 .chat{right:14px;top:auto;bottom:calc(16px + env(safe-area-inset-bottom))}
 .chat-hint{top:auto;bottom:calc(100% + 10px);right:0;transform:translateY(6px)}
 .chat-hint.show{transform:none}
 .chat-open{padding:12px 16px}
 .chat-hint{max-width:170px}
 .chat-panel{left:12px;right:12px;top:auto;bottom:12px;width:auto;height:min(600px,calc(100svh - 24px));transform:none;animation-name:chat-up}
 @keyframes chat-up{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}
}
.chat-typing{display:flex;gap:4px;align-items:center;padding:13px 14px!important}
.chat-typing i{width:6px;height:6px;border-radius:50%;background:#9a9a9a;animation:chat-dot 1.2s infinite ease-in-out}
.chat-typing i:nth-child(2){animation-delay:.15s}.chat-typing i:nth-child(3){animation-delay:.3s}
@keyframes chat-dot{0%,60%,100%{opacity:.3;transform:none}30%{opacity:1;transform:translateY(-3px)}}
/* who is writing: phone number and name at the top of the chat window */
.chat-who{padding:10px 14px;border-bottom:1px solid #2a2a2a;background:#141414}
.chat-fields{display:grid;grid-template-columns:1.2fr 1fr;gap:6px 8px}
.chat-fields[hidden],.chat-me[hidden]{display:none}
.chat [data-when][hidden]{display:none!important}
.chat-industry{grid-column:1/-1}
.chat.is-booking .chat-send{background:var(--fde-grad);color:#0f0f0f;font-weight:650}
.chat-send:disabled{opacity:.6}
.chat-fields label{min-width:0;display:flex;flex-direction:column;gap:3px;font-size:11px;color:#8f8f8f}
.chat-fields input{min-width:0;padding:8px 10px;border:1px solid #3a3a3a;border-radius:10px;background:#1f1f1f;color:#eee;font:inherit;font-size:14px}
.chat-fields input:focus{outline:none;border-color:#888}
.chat-fields input.invalid{border-color:#ff5b4d;box-shadow:0 0 0 2px #ff5b4d33}
.chat-fields small{grid-column:1/-1;font-size:10.5px;color:#777}
.chat-me{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12px;color:#bdbdbd}
.chat-me button{border:0;background:none;color:#8f8f8f;font-size:12px;text-decoration:underline;padding:2px 0}
/* Three tabs in the header (企业 AI 化落地 | 相关案例 | 关于 Yaki) and a 「免费预约」 button; nothing else.
   Phones: the logo and the tabs share one row, the tabs split three ways. */
html{scroll-padding-top:110px}
.page-tabs{display:flex;gap:4px;padding:5px;background:#171717;border:1px solid #363636;border-radius:50px}
.page-tabs a{font-size:13px;color:#bcbcbc;border-radius:30px;padding:8px 18px;white-space:nowrap;transition:.2s}
.page-tabs a:hover{color:#fff;background:#303030}
.page-tabs a[aria-current]{background:#e8e8e8;color:#161616;font-weight:500;box-shadow:0 2px 7px #00000022}
.footer-explore>nav a[data-tab]{font-weight:500;color:#e6e6e6}
@media(max-width:760px){
 html{scroll-padding-top:80px}
 .brand{padding:6px 2px;border:0;background:none}
 .brand:hover{background:none;box-shadow:none}
 .brand-tag{display:none}
 .brand-name{font-size:17px}
 .header-inner{gap:8px}
 .page-tabs{flex:1;min-width:0;padding:3px;gap:2px}
 .page-tabs a{flex:1 1 auto;text-align:center;font-size:12px;padding:7px 5px}
}
@media(max-width:380px){
 .page-tabs a{font-size:11px;padding:6px 4px}
}

.chat.trigger-visible:not(.is-open) .chat-open,.chat.trigger-visible:not(.is-open) .chat-hint{opacity:0!important;visibility:hidden;pointer-events:none;transition:opacity .25s,visibility 0s .25s}
.chat-open{transition:transform .25s cubic-bezier(.2,.8,.2,1.2),box-shadow .25s,opacity .25s}

/* 相关案例 (/cases/): the cases section is the page, so its heading is the page's h1; a way into the
   free diagnosis closes it */
.cases-page #cases.section{padding-top:40px;padding-bottom:32px}
.cases-page .section-label>span:first-child{display:none}
.section-heading h1{font-size:43px;font-weight:450;line-height:1.35;letter-spacing:-.04em}
.section-heading h1>span{display:block;font-family:var(--serif);font-size:24px;font-weight:400;letter-spacing:0;color:#bdbdbd;margin-top:6px}
.cases-cta{display:flex;align-items:center;justify-content:space-between;gap:32px;margin-block:0 48px;padding:32px 40px;border-radius:24px;border:1px solid #2f2f2f;background:radial-gradient(ellipse 60% 120% at 100% 50%,#7f8cff1c,transparent 70%),#141414}
.cases-cta h2{font-size:28px;font-weight:600;letter-spacing:-.02em;color:#f4f4f4}
.cases-cta p{margin-top:8px;font-size:15px;line-height:1.8;color:#a8a8a8}
.cases-cta .button{flex:none}
@media(max-width:760px){
 .cases-page #cases.section{padding-top:24px;padding-bottom:24px}
 .section-heading h1{font-size:36px}.section-heading h1>span{font-size:20px}
 .cases-cta{display:block;padding:24px 20px;margin-bottom:32px}.cases-cta h2{font-size:22px}.cases-cta .button{margin-top:18px;width:100%;justify-content:center}
}

/* ===== Common screen sizes, each fixed on purpose =====
   Computers (width of the browser window):
     2560 (≥2400): the 1920 design, scaled up as a whole (this page's own sizes are with its styles above)
     1920 / 2048 (1880–2399): wider frame (1720) and content (1440), larger headlines
     1600 / 1680 (1580–1879): frame 1520, content 1300
     1440 / 1536 (1400–1579): the base design (frame 1360, content 1168)
     1280 / 1366 (1151–1399) and iPad landscape 1024: the 1150 rules above
   Short laptop screens (≤ 720 tall, e.g. 1366×768 and 1280×720 minus the browser bars): a shorter first
   screen, so the booking button is visible without scrolling.
   Tablets in portrait (768 / 820 / 834, 761–1023 wide): the phone's bottom bar (book / chat / call), centred.
   Phones (360 / 375 / 390 / 414 / 430): the 760 rules above. */
@media(min-width:1580px){
 .site-shell{width:min(1520px,calc(100% - 64px))}
 .wrap{max-width:1300px}
}
@media(min-width:1880px){
 .site-shell{width:min(1720px,calc(100% - 96px))}
 .wrap{max-width:1440px}
 .section-heading h1,.section-heading h2{font-size:48px}
}
@media(min-width:2400px){html{zoom:1.33}}
@media(min-width:901px) and (max-height:820px){
 .header-inner{height:72px}
 html{scroll-padding-top:90px}
}
@media(min-width:901px) and (max-height:700px){
 .site-shell{margin-block:12px}
}

/* ===== 企业 AI 化落地 (FDE) page — a lead-generation landing page =====
   One system for the whole page, so it reads as one piece:
   · Structure: the first screen, then six numbered chapters. Neighbouring chapters alternate between
     two tones (.is-a plain, .is-b a shade lighter), so the reader always sees where one part ends.
   · Booking: chapter 05 and one band at the end (the first screen's button goes to 05); the header
     button and (phones, tablets) the bottom bar are always there.
   · Type: headline 54, chapter heading 40, card heading 22, text 16 (never under 14).
   · One card: #161616, 1px #262626, radius 20, padding 28. One accent: the cool gradient.
   · Spacing: 88 around a chapter, 40 between its heading and its content, 16 between cards.
   · Motion: a block comes in over .6s; items in a group follow .1–.4s apart; counting, growing bars and
     lighting steps take 1s at most; every block's whole animation is over within 2.5s. */
:root{--fde-a:#8fb3ff;--fde-b:#b79cff;--fde-c:#7ee3d0;--fde-grad:linear-gradient(100deg,var(--fde-a),var(--fde-b) 55%,var(--fde-c));--fde-line:#262626;--fde-card:#161616}
.fde-page main,.home-page main,.cases-page main{overflow:hidden}
.news-page main{overflow:clip}  /* clip, not hidden: the day headings and side panels stay pinned while scrolling */
.fde-grad{background:var(--fde-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.header-cta{display:inline-flex;align-items:center;padding:9px 18px;border-radius:30px;background:#f2f2f2;color:#111;font-size:13px;font-weight:600;white-space:nowrap;box-shadow:0 6px 24px #8fb3ff2e}
.header-cta:hover{box-shadow:0 8px 30px #b79cff55}

/* chapters */
.fde-part{padding-block:88px}
.fde-part.is-b{background:#161616;border-block:1px solid #222}.is-b .fde-compare,.is-b .fde-faq-more{background:#1c1c1c;border-color:#2c2c2c}
.is-b .fde-qa{border-color:#2c2c2c}
.fde-page .site-footer,.home-page .site-footer,.cases-page .site-footer,.news-page .site-footer{margin-top:32px}
.fde-head{max-width:720px;margin-bottom:40px}
.fde-kicker{display:inline-flex;align-items:center;gap:12px;font-size:13px;font-weight:600;letter-spacing:.14em;color:#cfcfcf}
.fde-kicker b{display:grid;place-items:center;min-width:34px;height:34px;padding:0 8px;border-radius:10px;background:var(--fde-grad);color:#0f0f0f;font-family:Georgia,serif;font-size:14px;letter-spacing:0}
.fde-head h2{margin-top:18px;font-size:40px;font-weight:650;line-height:1.3;letter-spacing:-.03em;color:#f5f5f5}
.fde-head p{margin-top:14px;font-size:17px;line-height:1.85;color:#a8a8a8}
.fde-fine{margin-top:16px;font-size:14px;color:#7d7d7d}

/* buttons */
.fde-btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:15px 26px;border:0;border-radius:14px;background:#f3f3f3;color:#0f0f0f;font-size:16px;font-weight:650;cursor:pointer;box-shadow:0 12px 40px #8fb3ff33;transition:transform .2s,box-shadow .2s}
.fde-btn:hover{transform:translateY(-2px);box-shadow:0 16px 50px #b79cff55}
.fde-btn:disabled{opacity:.6;transform:none}
.fde-btn .ico{width:1.05em;height:1.05em}
.fde-ghost{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 20px;border-radius:14px;border:1px solid #3a3a3a;background:transparent;color:#e0e0e0;font-size:15px;cursor:pointer;white-space:nowrap}
.fde-ghost:hover{border-color:#777;color:#fff}

/* first screen */
.fde-hero{position:relative;padding:32px 0 24px}
.fde-hero-bg{position:absolute;inset:0;pointer-events:none;background:
  radial-gradient(ellipse 560px 420px at 80% 38%,#7f8cff2b,transparent 70%),
  radial-gradient(ellipse 400px 300px at 95% 85%,#5fe1c81f,transparent 70%),
  linear-gradient(#ffffff07 1px,transparent 1px) 0 0/48px 48px,
  linear-gradient(90deg,#ffffff07 1px,transparent 1px) 0 0/48px 48px;
  -webkit-mask-image:radial-gradient(ellipse 90% 80% at 55% 35%,#000 35%,transparent 85%);mask-image:radial-gradient(ellipse 90% 80% at 55% 35%,#000 35%,transparent 85%)}
.fde-hero-grid{position:relative;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:64px;align-items:center}
.fde-pill{display:inline-flex;align-items:center;gap:9px;padding:6px 14px;border:1px solid #333;border-radius:30px;background:#131313cc;font-size:13px;letter-spacing:.04em;color:#d6d6d6}
.fde-pill i{width:7px;height:7px;border-radius:50%;background:var(--fde-c);animation:fde-ping 2.2s infinite}
.fde-hero h1{margin-top:0;font-size:54px;font-weight:700;line-height:1.18;letter-spacing:-.04em;color:#f7f7f7}
.fde-lead{margin-top:20px;max-width:560px;font-size:17px;line-height:1.85;color:#b5b5b5}

/* the full form */
.fde-form{position:relative;scroll-margin-top:96px;padding:28px;border-radius:22px;background:linear-gradient(#151515,#151515) padding-box,linear-gradient(160deg,#8fb3ff88,#2a2a2a 40%,#2a2a2a 70%,#7ee3d066) border-box;border:1px solid transparent;box-shadow:0 40px 100px #000000b0}
.fde-form h2{font-size:22px;font-weight:650;line-height:1.35;color:#f5f5f5;letter-spacing:-.01em}
.fde-form-sub{margin-top:6px;font-size:14px;line-height:1.7;color:#9a9a9a}
.fde-fields{margin-top:18px;display:grid;grid-template-columns:1fr 1fr;gap:12px}
main form[data-lead-form] label{display:flex;flex-direction:column;gap:6px;min-width:0}
main form[data-lead-form] label span{font-size:13px;color:#a3a3a3}
main form[data-lead-form] input{width:100%;padding:12px 14px;border-radius:12px;border:1px solid #303030;background:#0e0e0e;color:#f2f2f2;font:inherit;font-size:15px;transition:border-color .2s,box-shadow .2s}
main form[data-lead-form] input::placeholder{color:#5c5c5c}
main form[data-lead-form] input:focus{outline:none;border-color:#8fb3ff;box-shadow:0 0 0 3px #8fb3ff26}
main form[data-lead-form] input.invalid{border-color:#ff6b6b;box-shadow:0 0 0 3px #ff6b6b22}
.fde-form .fde-btn{width:100%;margin-top:16px}
.fde-form-error:empty{display:none}
.fde-form-error{margin-top:8px;font-size:14px;color:#ff8a80}
.fde-form-note{margin-top:12px;display:flex;align-items:center;gap:7px;font-size:13px;color:#7f7f7f}
.fde-form-note .ico{color:var(--fde-c);flex:none}
.fde-form-done{padding:28px 4px;text-align:center}
.fde-form-done[hidden],.fde-form-body[hidden]{display:none}
.fde-done-icon{display:inline-grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--fde-grad);color:#0f0f0f;font-size:24px}
.fde-form-done h2{margin-top:16px;font-size:22px;color:#f5f5f5}
.fde-form-done p{margin:8px 0 20px;font-size:15px;color:#b0b0b0}

/* booking bands: full width, a short form in one row */
.fde-band{padding-block:48px;background:radial-gradient(ellipse 60% 140% at 100% 50%,#7f8cff1f,transparent 70%),radial-gradient(ellipse 50% 140% at 0 50%,#5fe1c814,transparent 70%),#111;border-block:1px solid #262626}
.fde-inline{scroll-margin-top:96px}
.fde-inline .fde-form-body{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:12px 40px;align-items:center}
.fde-inline-copy h2{font-size:28px;font-weight:650;line-height:1.35;letter-spacing:-.02em;color:#f5f5f5}
.fde-inline-copy p{margin-top:8px;font-size:15px;line-height:1.75;color:#a6a6a6}
.fde-inline-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;gap:10px;align-items:end}
.fde-inline .fde-btn{white-space:nowrap}
.fde-inline .fde-form-error{grid-column:2;margin:0}
.fde-inline .fde-form-done{display:flex;align-items:center;gap:18px;padding:0;text-align:left}
.fde-inline .fde-form-done>div{flex:1}
.fde-inline .fde-form-done h2{margin:0}
.fde-inline .fde-form-done p{margin:4px 0 0}

/* 首页's first screen: the owner and the event photos (the 相关案例 pieces, .cases-hero / .cases-more);
   on tablets and phones the photos come first */
.home-hero{padding-top:clamp(40px,4vw,72px)}
.home-hero .about-actions{margin-top:30px}
@media(max-width:1023px){.home-hero .cases-stage{order:-1}}
.cases-me.home-me{display:inline-flex;align-items:center;max-width:100%;padding-right:clamp(20px,1.6vw,30px)}
.cases-me.home-me img{margin-top:0}
.home-me b i{font-style:normal}
@media(max-width:560px){.home-me b i{display:none}.home-me b span{display:block;margin-top:2px;font-size:14px}}

/* 01 what AI changes: four figures from public research in one row, then before/after bars */
.fde-group{display:flex;align-items:center;gap:10px;margin-bottom:14px;font-size:13px;letter-spacing:.06em;color:#9a9a9a}
.fde-group:before{content:"";width:18px;height:2px;border-radius:2px;background:var(--fde-grad)}
.fde-figs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:48px;border-block:1px solid #262626}
.fde-figs>div{min-width:0;padding:26px 22px 24px;border-left:1px solid #262626}
.fde-figs>div:first-child{border-left:0;padding-left:4px}
.fde-figs b{display:flex;align-items:baseline;gap:6px;white-space:nowrap;font-size:clamp(34px,2.9vw,52px);line-height:1;font-weight:760;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.fde-figs b>span{background:var(--fde-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.fde-figs b i{font-style:normal;font-size:17px;font-weight:650;letter-spacing:0;color:#dcdcdc}
.fde-figs>div>span{display:block;margin-top:16px;font-size:16px;font-weight:650;color:#f0f0f0}
.fde-figs small{display:block;margin-top:6px;font-size:13.5px;line-height:1.6;color:#9c9c9c}
@media(max-width:1023px){.fde-figs{grid-template-columns:repeat(2,minmax(0,1fr))}.fde-figs>div:nth-child(odd){border-left:0;padding-left:4px}.fde-figs>div:nth-child(n+3){border-top:1px solid #262626}}
@media(max-width:760px){.fde-figs{margin-bottom:36px}.fde-figs>div{padding:20px 12px 18px}.fde-figs b{font-size:30px}.fde-figs b i{font-size:14px}.fde-figs>div>span{font-size:15px}}
/* 01 (continued) before/after bars */
.fde-wins{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.fde-win{padding:26px 28px;border:1px solid var(--fde-line);border-radius:20px;background:var(--fde-card)}
.is-b .fde-win{background:#1c1c1c;border-color:#2c2c2c}
.fde-win-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:20px}
.fde-win h3{font-size:19px;font-weight:650;color:#f2f2f2}
.fde-win small{display:block;margin-top:4px;font-size:13px;color:#7c7c7c}
.fde-win em{flex:none;font-style:normal;font-size:14px;font-weight:650;padding:6px 12px;border-radius:30px;color:#0f0f0f;background:var(--fde-grad)}
.fde-bar-row{display:grid;grid-template-columns:76px 1fr 84px;align-items:center;gap:12px}
.fde-bar-row+.fde-bar-row{margin-top:12px}
.fde-bar-row span{font-size:13px;color:#8a8a8a}
.fde-bar-row i{display:block;height:14px;width:var(--w);border-radius:8px;background:#3a3a3a}
.fde-bar-row.now i{background:var(--fde-grad);box-shadow:0 0 24px #b79cff44}
.fde-bar-row b{font-size:15px;font-weight:600;color:#9a9a9a;text-align:right;font-variant-numeric:tabular-nums}
.fde-bar-row.now b{color:#f2f2f2}
.reveal-on .fde-bar-row i{width:0;transition:width .9s cubic-bezier(.2,.8,.2,1)}
.reveal-on .is-in .fde-bar-row i{width:var(--w)}
.reveal-on .is-in .fde-bar-row.now i{transition-delay:.2s}

/* 02 stuck → what an FDE is → how it goes */
.fde-need{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}
.fde-stuck,.fde-define{padding:28px;border-radius:20px}
.fde-stuck{border:1px solid var(--fde-line);background:var(--fde-card)}
.fde-stuck ul{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.fde-stuck li{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:14px;background:#1c1616;border:1px solid #2e2222;font-size:16px;color:#ecd6d6}
.fde-stuck li>span{display:grid;place-items:center;flex:none;width:24px;height:24px;border-radius:50%;background:#ff6b6b1f;color:#ff7b72;font-size:12px}
.fde-stuck>p{margin-top:22px;font-size:20px;font-weight:650;line-height:1.55;color:#f2f2f2}
.fde-define{position:relative;border:1px solid transparent;background:linear-gradient(#161616,#161616) padding-box,var(--fde-grad) border-box;overflow:hidden}
.fde-mark{position:absolute;right:-8px;bottom:-26px;font-size:140px;font-weight:800;letter-spacing:-.06em;line-height:1;background:var(--fde-grad);-webkit-background-clip:text;background-clip:text;color:transparent;opacity:.1;pointer-events:none}
.fde-full{display:block;font-size:12px;letter-spacing:.16em;color:#8a8a8a;text-transform:uppercase}
.fde-define h3{position:relative;margin-top:12px;font-size:26px;font-weight:650;line-height:1.4;color:#f5f5f5}
.fde-define p{position:relative;margin-top:14px;font-size:16px;line-height:1.85;color:#b3b3b3}
.fde-tags{position:relative;list-style:none;padding:0;margin:20px 0 0;display:flex;flex-wrap:wrap;gap:8px}
.fde-tags li{padding:8px 15px;border-radius:30px;border:1px solid #363636;background:#1b1b1b;font-size:14px;color:#e5e5e5}
.fde-flow{position:relative;list-style:none;padding:0;margin:48px 0 0;display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.fde-flow:before{content:"";position:absolute;left:24px;right:24px;top:24px;height:2px;background:linear-gradient(90deg,#333,var(--fde-b),#333)}
.fde-flow li{position:relative;display:flex;flex-direction:column;gap:4px}
.fde-flow:before{transform-origin:left}
.reveal-on .fde-flow:before{transform:scaleX(0);transition:transform 1s ease .1s}
.reveal-on .fde-flow.is-in:before{transform:none}
.reveal-on .fde-flow li{opacity:.2;transition:opacity .4s ease calc(var(--i) * .25s + .15s)}
.reveal-on .fde-flow.is-in li{opacity:1}
.fde-node{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:#1b1b1b;border:1px solid #333;font-size:20px;color:#dedede;margin-bottom:12px}
.fde-flow li.is-key .fde-node{background:var(--fde-grad);border:0;color:#0f0f0f;box-shadow:0 0 0 6px #b79cff22}
.fde-flow b{font-size:18px;font-weight:650;color:#f2f2f2}
.fde-flow small{font-size:15px;color:#9a9a9a}

/* 03 before and after, role by role */
.fde-compare{border:1px solid var(--fde-line);border-radius:20px;overflow:hidden;background:var(--fde-card)}
.fde-compare-row{display:grid;grid-template-columns:180px 1fr 1fr;gap:24px;align-items:center;padding:18px 28px;border-top:1px solid #222}
.fde-compare-row.is-head{border-top:0;padding-block:14px;background:#1b1b1b;font-size:13px;letter-spacing:.12em;color:#8a8a8a}
.fde-compare-row.is-head span:last-child{color:transparent;background:var(--fde-grad);-webkit-background-clip:text;background-clip:text;font-weight:650}
.fde-compare-row>b{font-weight:600;font-size:16px;color:#efefef}
.fde-compare-row .was{font-size:15px;line-height:1.65;color:#7f7f7f}
.fde-compare-row .now{display:flex;align-items:flex-start;gap:10px;font-size:16px;line-height:1.65;color:#f2f2f2;font-weight:500}
.reveal-on .fde-compare-row:not(.is-head) .now{opacity:0;transform:translateX(-18px);transition:opacity .4s ease calc(var(--i) * .1s + .25s),transform .4s ease calc(var(--i) * .1s + .25s)}
.reveal-on .fde-compare.is-in .fde-compare-row .now{opacity:1;transform:none}
.fde-compare-row .now .ico{flex:none;margin-top:.3em;color:var(--fde-c)}

/* 04 the systems made: one card per business scene, the picture in an app window */
.fde-scenes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.fde-scene{display:flex;flex-direction:column;border:1px solid var(--fde-line);border-radius:20px;background:var(--fde-card);overflow:hidden;color:inherit;text-decoration:none;transition:border-color .2s,transform .2s}
.fde-scene:hover{border-color:#3d3a55;transform:translateY(-3px)}
.fde-window{margin:16px 16px 0;border:1px solid #2e2e2e;border-radius:12px;overflow:hidden;background:#0d0d0d}
.fde-window-bar{display:flex;align-items:center;gap:6px;height:26px;padding:0 12px;background:#1b1b1d;border-bottom:1px solid #262626;font-size:11px;color:#8c8c8c;white-space:nowrap;overflow:hidden}
.fde-window-bar i{flex:none;width:8px;height:8px;border-radius:50%;background:#ff5f57}.fde-window-bar i:nth-child(2){background:#febc2e}.fde-window-bar i:nth-child(3){background:#28c840}
.fde-window-bar span{margin-left:8px;overflow:hidden;text-overflow:ellipsis}
.fde-window img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:top}
.fde-window:not(:has(.fde-window-bar)) img{object-position:center}
.fde-scene-copy{display:flex;flex-direction:column;flex:1;padding:18px 20px 22px}
.fde-scene-copy>span{font-size:12.5px;color:#bdb3ff}
.fde-scene-copy h3{margin-top:6px;font-size:18px;font-weight:650;color:#f2f2f2}
.fde-scene-copy p{margin-top:6px;font-size:13.5px;line-height:1.65;color:#a8a8a8}
.fde-scene-copy em{display:inline-flex;align-items:center;gap:6px;margin-top:auto;padding-top:14px;font-style:normal;font-size:13.5px;color:#f0f0f0}
.fde-head-row{display:flex;align-items:flex-end;justify-content:space-between;gap:16px 32px;flex-wrap:wrap;margin-bottom:40px}
.fde-head-row .fde-head{margin-bottom:0}
.fde-head-row>.fde-ghost{flex:none}
@media(max-width:760px){.fde-head-row{margin-bottom:28px}}
@media(max-width:1150px){.fde-scenes{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.fde-scenes{grid-template-columns:1fr}}

/* 05 开启加速: what the first conversation settles, beside the full form */
.fde-offer{background:radial-gradient(ellipse 50% 70% at 85% 40%,#7f8cff17,transparent 70%)}
.fde-offer-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,2.6vw,48px);align-items:stretch}
.fde-offer-copy{display:flex;flex-direction:column}
.fde-offer-copy .fde-answers{flex:1;grid-auto-rows:1fr}
.fde-offer-copy .fde-answers li{align-items:center}
.fde-offer .fde-form{display:flex;flex-direction:column;justify-content:center}
.fde-offer .fde-fields{grid-template-columns:1fr 1fr}
.fde-offer .fde-fields label:nth-child(n+3){grid-column:1/-1}
.fde-answers{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.fde-answers li{display:flex;gap:18px;padding:22px 24px;border:1px solid var(--fde-line);border-radius:20px;background:var(--fde-card)}
.fde-answers li>span{flex:none;font-family:Georgia,serif;font-size:24px;line-height:1.15;color:transparent;background:var(--fde-grad);-webkit-background-clip:text;background-clip:text}
.fde-answers b{font-size:18px;font-weight:650;color:#f2f2f2}
.fde-answers p{margin-top:4px;font-size:15px;line-height:1.7;color:#9f9f9f}
.fde-trust{list-style:none;padding:0;margin:24px 0 0;display:grid;gap:10px}
.fde-trust li{display:flex;align-items:center;gap:8px;font-size:15px;color:#9a9a9a}
.fde-trust .ico{flex:none;color:var(--fde-c)}
.fde-trust b{color:#e2e2e2;font-weight:600;margin-right:4px}


/* 06 questions: all open, two columns, lines between them (no cards) */
.fde-faq{display:grid;grid-template-columns:1fr 1fr;column-gap:56px}
.fde-qa{padding:22px 0;border-top:1px solid #262626}
.fde-qa h3{display:flex;gap:12px;align-items:flex-start;font-size:17px;font-weight:650;line-height:1.55;color:#f2f2f2}
.fde-qa h3 span{flex:none;display:grid;place-items:center;width:24px;height:24px;margin-top:1px;border-radius:7px;background:var(--fde-grad);color:#0f0f0f;font-family:Georgia,serif;font-size:13px}
.fde-qa p{margin:8px 0 0 36px;font-size:15px;line-height:1.8;color:#a6a6a6}
.fde-faq-more{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:24px;padding:18px 24px;border-radius:20px;border:1px solid var(--fde-line);background:var(--fde-card)}
.fde-faq-more p{font-size:16px;color:#d6d6d6}
.fde-faq-more .fde-ghost .ico{width:1.1em;height:1.1em}

/* phones and tablets: the bottom bar */
.fde-bar{display:none}

/* gentle reveal on scroll (site.js adds .reveal-on to <html>, then .is-in as parts come into view) */
.reveal-on [data-reveal]{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease}
.reveal-on [data-reveal].is-in{opacity:1;transform:none}
@keyframes fde-ping{0%{box-shadow:0 0 0 0 #7ee3d0aa}80%,100%{box-shadow:0 0 0 9px #7ee3d000}}
@media(prefers-reduced-motion:reduce){.fde-pill i{animation:none}.reveal-on [data-reveal]{opacity:1;transform:none;transition:none}}

/* ---- the same page at each common size ---- */
@media(min-width:1580px){.fde-hero h1{font-size:58px}}
@media(min-width:1880px){
 .fde-hero{padding:32px 0 28px}
 .fde-hero h1{font-size:64px}
 .fde-lead{font-size:18px;max-width:600px}
 .fde-hero-grid{gap:88px}
 .fde-form{padding:34px}
 .fde-part{padding-block:104px}
 .fde-head{max-width:800px}
 .fde-head h2{font-size:46px}
 .fde-head p{font-size:18px}
 }
/* short laptop screens (1366×768, 1280×720, 1536×864 minus the browser bars): the first screen
   shows the form's button and the start of chapter 01 */
@media(min-width:901px) and (max-height:820px){
 .fde-hero{padding:20px 0 28px}
 .fde-hero h1{font-size:46px;margin-top:0}
 .fde-lead{margin-top:12px;font-size:15.5px}
 .fde-form{padding:22px 24px}
 .fde-form h2{font-size:20px}
 .fde-fields{margin-top:14px;gap:10px}
 main form[data-lead-form] input{padding:10px 13px}
 .fde-form .fde-btn{margin-top:12px;padding-block:12px}
 .fde-form-note{margin-top:8px}
}
@media(min-width:901px) and (max-height:700px){
 .fde-lead{font-size:15px}
}
@media(max-width:1150px){
 .fde-hero h1{font-size:46px}
 .fde-hero-grid,.fde-offer-grid{gap:40px}
 .fde-part{padding-block:72px}
 .fde-head h2{font-size:34px}
 .fde-inline .fde-form-body{grid-template-columns:1fr}
 .fde-inline .fde-form-error{grid-column:1}
 }
@media(max-width:900px){
 .fde-hero-grid,.fde-offer-grid,.fde-need{grid-template-columns:1fr}
    .fde-flow{grid-template-columns:1fr 1fr;row-gap:32px}
 .fde-flow:before{display:none}
 .fde-offer .fde-form{position:static}
 .fde-faq{grid-template-columns:1fr}
 .fde-wins{grid-template-columns:1fr}
}
/* tablets in portrait (768 / 820 / 834): the bottom bar, centred */
@media(min-width:761px) and (max-width:1023px){
 .fde-page .chat-open,.fde-page .chat-hint{display:none}
 .fde-bar{position:fixed;left:50%;transform:translateX(-50%);bottom:14px;z-index:55;width:min(560px,calc(100% - 28px));display:grid;grid-template-columns:1fr auto;gap:6px;padding:6px;border-radius:18px;background:#161616f2;border:1px solid #333;box-shadow:0 12px 40px #000000b0;backdrop-filter:blur(10px)}
 .fde-bar a,.fde-bar button{display:flex;align-items:center;justify-content:center;gap:6px;min-height:48px;padding:0 18px;border-radius:13px;border:0;background:#222;color:#eee;font-size:14px;font-weight:500}
 .fde-bar .fde-bar-book{background:#f3f3f3;color:#0f0f0f;font-weight:650;font-size:15.5px}
 .fde-page .site-footer{padding-bottom:90px}
}
/* phones (360 / 375 / 390 / 414 / 430) */
@media(max-width:760px){
 .header-cta{display:none}
 .fde-page .chat-open,.fde-page .chat-hint{display:none}
 .fde-hero{padding:24px 0 40px}
 .fde-hero h1{font-size:30px}
 .fde-lead{font-size:16px}
 .fde-wins{grid-template-columns:1fr}
 .fde-win{padding:20px 18px}
 .fde-win-head{flex-direction:column;gap:10px}
 .fde-bar-row{grid-template-columns:64px 1fr 74px;gap:10px}
 .fde-form{padding:22px 18px;border-radius:20px;scroll-margin-top:84px}
 .fde-form h2{font-size:20px}
 .fde-fields{grid-template-columns:1fr}
 .fde-part{padding-block:52px}
 .fde-head{margin-bottom:28px}
 .fde-kicker b{min-width:30px;height:30px;font-size:13px}
 .fde-head h2{margin-top:14px;font-size:27px}
 .fde-head p{font-size:15.5px}
 .fde-band{padding-block:36px}
 .fde-inline{scroll-margin-top:84px}
 .fde-inline-copy h2{font-size:22px}
 .fde-inline-row{grid-template-columns:1fr}
 .fde-inline .fde-btn{width:100%;margin-top:4px}
 .fde-inline .fde-form-done{flex-wrap:wrap}.fde-stuck,.fde-define{padding:22px 20px}
 .fde-stuck>p{font-size:18px}
 .fde-define h3{font-size:22px}
 .fde-flow{grid-template-columns:1fr;row-gap:20px;margin-top:32px}
 .fde-flow li{display:grid;grid-template-columns:48px 1fr;column-gap:16px;align-items:center}
 .fde-node{grid-row:1/3;margin:0}
 .fde-compare-row{grid-template-columns:1fr;gap:6px;padding:16px 18px}
 .fde-compare-row.is-head{display:none}
 .fde-answers li{padding:18px}
 .fde-qa p{margin-left:0}
 .fde-faq-more{padding:16px 18px}
 .fde-bar{position:fixed;left:10px;right:10px;bottom:10px;z-index:55;display:grid;grid-template-columns:1fr auto;gap:6px;padding:6px;border-radius:18px;background:#161616f2;border:1px solid #333;box-shadow:0 12px 40px #000000b0;backdrop-filter:blur(10px)}
 .fde-bar a,.fde-bar button{display:flex;align-items:center;justify-content:center;gap:6px;min-height:46px;padding:0 14px;border-radius:13px;border:0;background:#222;color:#eee;font-size:13.5px;font-weight:500}
 .fde-bar .fde-bar-book{background:#f3f3f3;color:#0f0f0f;font-weight:650;font-size:15px}
 .fde-page .site-footer{padding-bottom:84px}
}
/* narrow phones (360–400): the headline keeps each line whole */
@media(max-width:400px){.fde-hero h1{font-size:27px}}

/* ===== 相关案例, 关于 Yaki and the case pages in the same system as 企业 AI 化落地 =====
   Same chapter headings (.fde-head), same card (#161616 / #262626 / radius 20), same two buttons
   (.fde-btn white, .fde-ghost outline — the older .button / .button.primary now look the same),
   sans-serif throughout, nothing under 13px. */
.eyebrow,.small-label{font-size:13px;letter-spacing:.04em}
.tags span{font-size:14px;padding:7px 14px;border-color:#363636;background:#1b1b1b;color:#e2e2e2}
.button{justify-content:center;gap:12px;padding:13px 22px;min-height:0;border:1px solid #3a3a3a;border-radius:14px;background:transparent;color:#e0e0e0;font-size:15px}
.button.primary{border:0;background:#f3f3f3;color:#0f0f0f;font-weight:650;box-shadow:0 12px 40px #8fb3ff33}
.button span[aria-hidden]{font-size:1.05em}
.fde-head h1{margin-top:18px;font-size:40px;font-weight:650;line-height:1.3;letter-spacing:-.03em;color:#f5f5f5}

/* 关于 Yaki — the first screen: who, what, two buttons; the photo beside */
.about-hero{padding-bottom:64px}
.about-hero h1{margin-top:22px}
.about-hero .fde-hero-grid{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr)}
.about-roles{list-style:none;padding:0;margin:22px 0 0;display:grid;gap:10px}
.about-roles li{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:550;color:#ececec}
.about-roles .ico{flex:none;color:var(--fde-c)}
.about-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.about-photo{position:relative;margin:0;justify-self:end;width:min(100%,420px);aspect-ratio:4/5;border-radius:22px;overflow:hidden;border:1px solid #2a2a2a;box-shadow:0 40px 100px #000000a0}
.about-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 22%}
.about-photo figcaption{position:absolute;inset:auto 0 0;padding:72px 22px 20px;background:linear-gradient(transparent,#000000e0)}
.about-photo b{display:block;font-size:17px;font-weight:600;color:#fff}
.about-photo p{margin-top:6px;font-size:14px;line-height:1.7;color:#cfcfcf;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* 01 过往经历 — the timeline and the panel in the dark card style */
.timeline-tools{margin-top:0;font-size:14px;color:#8a8a8a}
.timeline-instruction{font-size:14px;color:#8a8a8a;margin:4px 0 16px}
.journey-track{grid-auto-columns:220px}
.timeline-card{border-radius:18px;border:1px solid #2c2c2c;background:#1c1c1c}
.timeline-card:hover{background:#232323;border-color:#3a3a3a}
.timeline-period{font-size:13px;color:#8a8a8a}
.timeline-year{font-family:var(--sans);font-style:normal;font-weight:700;font-size:32px;letter-spacing:-.02em;color:#cfcfcf}
.timeline-card strong{font-size:18px;font-weight:600;color:#f0f0f0}
.timeline-position{font-size:14px;color:#a0a0a0}
.timeline-phase{font-size:13px;color:#8a8a8a;border-color:#2e2e2e}
.timeline-card.selected{border-color:transparent;background:linear-gradient(#1f1f1f,#1f1f1f) padding-box,var(--fde-grad) border-box;box-shadow:0 0 40px #8fb3ff1f}
.timeline-card.selected .timeline-year{color:transparent;background:var(--fde-grad);-webkit-background-clip:text;background-clip:text}
.timeline-card.selected strong{color:#fff}
.timeline-card.selected .timeline-period,.timeline-card.selected .timeline-position,.timeline-card.selected .timeline-phase{color:#b0b0b0;border-color:#333}
.timeline-card.selected .timeline-node{color:#e6e6e6}
.career-panel{grid-template-columns:200px 1fr;border:1px solid #2c2c2c;border-radius:20px;background:#1c1c1c;color:#e6e6e6}
.career-index{background:#191919;border-right:1px solid #2a2a2a}
.career-index>.career-mark{color:#ffffff08}
.career-index>span,.career-index>small{font-size:13px;color:#8a8a8a;letter-spacing:.02em}
.career-index>strong{font-family:var(--sans);font-style:normal;font-weight:700;font-size:40px;letter-spacing:-.02em;color:transparent;background:var(--fde-grad);-webkit-background-clip:text;background-clip:text}
.career-heading h3{font-size:26px;font-weight:650;color:#f5f5f5}
.career-position{font-size:13px;color:#cfcfcf;border-color:#3a3a3a}
.career-resume{border-color:#2a2a2a;background:#151515}
.resume-block+.resume-block{border-top-color:#2e2e2e}
.career-resume p{font-size:15px;line-height:1.9;color:#b5b5b5}
.career-resume .heading{color:#f0f0f0}
.career-resume .bullet:before{color:var(--fde-c)}
.education-note{border-radius:18px;border-color:#2c2c2c;background:#1c1c1c}
.education-note strong{font-size:15px;color:#eee}
.education-note>div>span,.education-note time{font-size:14px}

/* 02 知识库 */
.knowledge-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:28px}
.knowledge-head .fde-head{margin-bottom:0}
.knowledge-count{display:inline-block;margin-left:10px;font-size:14px;color:#8a8a8a}
.knowledge-enter{flex:none}

/* 03 联系我 */
.contact-section .contact-copy .tags span{font-size:14px;padding:7px 14px}
.contact-section .contact-copy>p.contact-closing{margin-top:20px;font-size:16px;line-height:1.85;color:#a8a8a8}
.contact-section{border-top:0}
.contact-layout{grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:48px;align-items:start;padding-top:0}
.contact-closing{margin-top:20px;font-size:16px;line-height:1.85;color:#a8a8a8}
.contact-card{padding:28px;border:1px solid var(--fde-line);border-radius:20px;background:var(--fde-card)}
.contact-card-top{padding-bottom:18px;margin-bottom:18px;border-bottom:1px solid #262626}
.contact-spark{font-size:28px}
.contact-card-top>span:last-child,.contact-card .eyebrow{font-size:13px;color:#9a9a9a}
.contact-number{display:block;margin-top:6px;font-size:40px;font-weight:700;letter-spacing:-.02em;color:transparent;background:var(--fde-grad);-webkit-background-clip:text;background-clip:text}
.contact-card>.muted{font-size:14px;color:#8a8a8a}
.contact-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}

/* 相关案例 — the four cards */
.cases-main .case-grid{gap:16px}
.case-card{border-radius:20px;border-color:#2a2a2a;background:var(--fde-card)}
.case-index{display:grid;place-items:center;min-width:34px;height:34px;padding:0 8px;border-radius:10px;background:var(--fde-grad);color:#0f0f0f;font-family:Georgia,serif;font-style:normal;font-size:14px}
.case-live{font-size:13px;padding:6px 12px}
.case-card-copy{padding:24px 26px}
.case-card-copy h3{font-size:24px;font-weight:650;line-height:1.4}
.case-card-copy>p{font-size:15.5px;line-height:1.8;color:#a6a6a6}
.case-role{font-size:13.5px;color:#8a8a8a}
.case-card-bottom{font-size:14px;color:#e0e0e0}

/* AI 资讯 (/news/…) — AIHOT's views (精选 / 热点榜 / AI 日报 / item / story) in this site's look */
.news-main{padding-top:56px}
.news-main .back-link{gap:8px;margin-bottom:22px}
.news-head{margin-bottom:24px}
.news-head h1{margin-top:18px}
.news-updated{display:block;margin-top:6px;font-size:13px;color:#7c7c7c}
.news-nav{display:inline-flex;gap:4px;padding:5px;margin-bottom:24px;background:#171717;border:1px solid #363636;border-radius:50px}
.news-nav a{font-size:14px;color:#bcbcbc;border-radius:30px;padding:8px 20px;transition:.2s}
.news-nav a:hover{color:#fff;background:#303030}
.news-nav a[aria-current]{background:var(--fde-grad);color:#0f0f0f;font-weight:600}
.news-filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.news-filters a{padding:6px 14px;border:1px solid #2e2e2e;border-radius:30px;font-size:13px;color:#b0b0b0;transition:.2s}
.news-filters a:hover{border-color:#4a4a4a;color:#fff}
.news-filters a[aria-current]{border-color:transparent;background:#e8e8e8;color:#151515;font-weight:600}
.news-label{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;letter-spacing:.14em;color:var(--fde-c)}
.news-label:before{content:"";width:18px;height:1px;background:currentColor}
.news-pill{display:inline-flex;align-items:center;padding:2px 9px;border-radius:20px;background:#1f1f1f;border:1px solid #2e2e2e;font-size:12.5px;color:#d0d0d0;white-space:nowrap}
.news-pill.first{border-color:#7ee3d055;color:var(--fde-c)}
.news-pill.hot{border-color:#ff8a6655;color:#ffab8f}
.news-empty{display:flex;align-items:center;gap:10px;margin-top:8px;padding:18px 20px;border:1px dashed #2e2e2e;border-radius:16px;font-size:15px;color:#9a9a9a}
.news-empty i{width:8px;height:8px;border-radius:50%;background:var(--fde-c);box-shadow:0 0 0 4px #7ee3d022;animation:news-pulse 1.6s ease-in-out infinite}
@keyframes news-pulse{50%{opacity:.35}}
.news-note{margin-top:28px;font-size:13px;color:#6f6f6f}
.news-faces{display:inline-flex;align-items:center;flex:none}
.news-face{display:inline-grid;place-items:center;flex:none;width:24px;height:24px;border-radius:50%;object-fit:cover;background:#262626;border:2px solid var(--fde-card);font-size:11px;font-style:normal;color:#bdbdbd}
.news-faces .news-face+.news-face{margin-left:-7px}
.news-faces em{margin-left:6px;font-size:12.5px;font-style:normal;color:#8a8a8a}
.news-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;font-size:13px;color:#8a8a8a}
.news-meta .news-face{border:0}
.news-src{color:#cfcfcf;font-weight:500}
.news-handle{color:#6f6f6f}
/* 当前热点 */
.news-strip{margin-bottom:28px;padding:18px 22px 10px;border:1px solid var(--fde-line);border-radius:20px;background:var(--fde-card);position:relative;overflow:hidden}
.news-strip:before{content:"";position:absolute;inset:0 0 auto;height:2px;background:var(--fde-grad);opacity:.8}
.news-strip header{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.news-strip header a{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:#9a9a9a}
.news-strip header a:hover{color:#fff}
.news-live{display:inline-flex;align-items:center;gap:8px;font-size:15px;font-weight:650;color:#f2f2f2}
.news-live i{width:8px;height:8px;border-radius:50%;background:#ff6b4a;box-shadow:0 0 0 4px #ff6b4a22;animation:news-pulse 1.6s ease-in-out infinite}
.news-strip ol{list-style:none;padding:0}
.news-strip li{display:grid;grid-template-columns:28px minmax(0,1fr) auto 92px 24px;align-items:center;gap:14px;padding:10px 0;border-top:1px solid #222}
.news-strip li:first-child{border-top:0}
.news-strip li>a{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:15.5px;font-weight:500;color:#e8e8e8}
.news-strip li>a:hover{color:#fff}
.news-rank{font-family:Georgia,serif;font-size:18px;color:#5c5c5c;text-align:center}
.news-rank.r1,.news-rank.r2,.news-rank.r3{color:transparent;background:var(--fde-grad);-webkit-background-clip:text;background-clip:text}
.news-heat{font-size:13px;color:#8a8a8a;text-align:right;white-space:nowrap}
.news-heat b{font-size:15px;color:#e8e8e8;font-weight:600}
.news-tick{text-align:center;color:#6f6f6f}
.news-tick.up{color:#ff8a66}.news-tick.down{color:#7ee3d0}.news-tick.new{color:#b79cff;font-size:10px}
/* 精选: on wide screens the timeline keeps a reading width and 当前热点 sits beside it, pinned */
.news-feed{display:grid;grid-template-columns:minmax(0,1fr);gap:28px}
.news-feed-side{order:-1}
.news-feed-side .news-note{margin-top:0}
@media(min-width:1180px){
 .news-feed{grid-template-columns:minmax(0,860px) minmax(320px,400px);justify-content:space-between;gap:56px;align-items:start}
 .news-feed-side{order:0;position:sticky;top:100px}
 .news-feed-side .news-strip{margin-bottom:14px;padding:18px 18px 8px}
 .news-feed-side .news-strip li{grid-template-columns:22px minmax(0,1fr) auto;gap:10px;align-items:start}
 .news-feed-side .news-strip li>a{white-space:normal;font-size:14.5px;line-height:1.55;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
 .news-feed-side .news-faces,.news-feed-side .news-tick{display:none}
 .news-feed-side .news-heat{padding-top:2px}
 .news-feed-side .news-note{margin-top:4px;padding-inline:4px}
}
/* timeline */
.news-day+.news-day{margin-top:34px}
.news-dayhead{position:sticky;top:80px;z-index:1;display:flex;align-items:baseline;gap:12px;padding:14px 0 12px;margin-bottom:6px;background:linear-gradient(var(--bg) 75%,transparent);font-size:14px;font-weight:500;color:#9a9a9a}
.news-dayhead b{font-size:20px;font-weight:650;color:#f2f2f2}
.news-dayhead em{margin-left:auto;font-style:normal;font-size:13px;color:#6f6f6f}
.news-card{display:grid;grid-template-columns:64px minmax(0,1fr);gap:0 18px;position:relative}
.news-card:before{content:"";position:absolute;left:31px;top:0;bottom:0;width:1px;background:#242424}
.news-clock{position:relative;padding-top:22px;font-size:13px;color:#7c7c7c;font-variant-numeric:tabular-nums}
.news-clock:after{content:"";position:absolute;left:28px;top:44px;width:7px;height:7px;border-radius:50%;background:var(--fde-a);box-shadow:0 0 0 4px #8fb3ff22}
.news-card-body{margin-bottom:12px;padding:20px 22px;border:1px solid var(--fde-line);border-radius:18px;background:var(--fde-card);transition:border-color .2s}
.news-card-body:hover{border-color:#3a3a3a}
.news-score{display:inline-flex;align-items:center;gap:6px;margin-left:auto;padding:2px 10px;border-radius:20px;border:1px solid #7ee3d044;color:var(--fde-c);font-weight:600;font-variant-numeric:tabular-nums}
.news-score small{font-size:11.5px;font-weight:400;color:#7aa69d}
.news-card h3{margin-top:10px;font-size:18px;font-weight:650;line-height:1.55;color:#f2f2f2}
.news-card h3 a:hover{color:#fff;text-decoration:underline;text-underline-offset:4px;text-decoration-color:#555}
.news-sum{margin-top:8px;font-size:15px;line-height:1.8;color:#a6a6a6}
.news-why{margin-top:8px;font-size:14px;line-height:1.75;color:#8fc9bd}
.news-why b{font-weight:600}
.news-also{display:flex;align-items:center;justify-content:space-between;margin-top:14px;padding:10px 14px;border-radius:12px;background:#1c1c1c;font-size:13.5px;color:#a6a6a6;transition:.2s}
.news-also:hover{background:#232323;color:#fff}
.news-more{margin:18px 0 0 82px}
/* 热点榜 */
.news-podium{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:16px;margin-bottom:28px}
.news-podium-side{display:grid;gap:16px}
.news-top{display:flex;flex-direction:column;gap:14px;padding:22px 24px;border:1px solid var(--fde-line);border-radius:20px;background:var(--fde-card);position:relative;overflow:hidden}
.news-top.is-first:before{content:"";position:absolute;inset:0 0 auto;height:2px;background:var(--fde-grad)}
.news-top-tags{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.news-no{font-family:Georgia,serif;font-size:14px;letter-spacing:.06em;color:transparent;background:var(--fde-grad);-webkit-background-clip:text;background-clip:text}
.news-trend{font-size:12.5px;color:#8a8a8a}
.news-trend.up{color:#ff8a66}.news-trend.down{color:#7ee3d0}.news-trend.new{color:#b79cff}
.news-top-main{display:grid;gap:18px}
.news-top.is-first .news-top-main{grid-template-columns:minmax(0,1fr) auto}
.news-top h2{font-size:19px;font-weight:650;line-height:1.5;color:#f2f2f2}
.news-top.is-first h2{font-size:27px;line-height:1.35;letter-spacing:-.01em}
.news-top h2 a:hover{color:#fff}
.news-top-sum{margin-top:10px;font-size:14.5px;line-height:1.8;color:#a6a6a6;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.news-top:not(.is-first) .news-top-sum{-webkit-line-clamp:2}
.news-latest{margin-top:12px;padding:10px 14px;border-radius:12px;background:#1c1c1c;font-size:14px;color:#cfcfcf}
.news-latest b{margin-right:10px;color:var(--fde-c);font-weight:600}
/* AIHOT's pictures are shown whole, at their own proportions (charts and screenshots must not be cut) */
.news-cover{display:block;width:260px;height:auto;max-height:220px;object-fit:contain;object-position:left top;border-radius:14px}
.news-top footer{display:flex;align-items:center;gap:12px;margin-top:auto;padding-top:12px;border-top:1px solid #222}
.news-top footer small{font-size:13px;color:#7c7c7c}
.news-spark{width:96px;height:30px;flex:none;color:var(--fde-c);margin-left:auto}
.news-spark polyline{fill:none;stroke:currentColor;stroke-width:2;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.news-spark .area{fill:currentColor;opacity:.12}
.news-spark.big{display:block;width:100%;height:110px;margin-top:12px}
.news-heatbig{display:flex;flex-direction:column;align-items:flex-end;line-height:1}
.news-heatbig b{font-size:26px;font-weight:700;color:#f2f2f2;font-variant-numeric:tabular-nums}
.news-top.is-first .news-heatbig b{font-size:40px;color:transparent;background:var(--fde-grad);-webkit-background-clip:text;background-clip:text}
.news-heatbig small{margin-top:6px;font-size:12px;color:#7c7c7c}
.news-board{border:1px solid var(--fde-line);border-radius:20px;background:var(--fde-card);padding:8px 24px}
.news-board-title{padding:14px 0 6px;font-size:15px;font-weight:600;color:#cfcfcf}
.news-board ol{list-style:none;padding:0}
.news-board li{display:grid;grid-template-columns:36px minmax(0,1fr) auto 96px 70px;align-items:center;gap:16px;padding:16px 0;border-top:1px solid #222}
.news-board-main a{font-size:16px;font-weight:600;color:#ececec}
.news-board-main a:hover{color:#fff}
.news-board-main p{margin-top:4px;font-size:13.5px;color:#8a8a8a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.news-heatcol{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.news-heatcol b{font-size:20px;font-weight:700;color:#ececec;font-variant-numeric:tabular-nums}
/* AI 日报 */
.news-daily{display:grid;grid-template-columns:260px minmax(0,820px);gap:40px;align-items:start}
.news-toc{display:none}
@media(min-width:1680px){
 .news-daily{grid-template-columns:260px minmax(0,820px) 240px;justify-content:space-between;gap:44px}
 .news-toc{display:block;position:sticky;top:100px}
 .news-toc .news-contents{grid-template-columns:1fr;gap:8px}
 .news-contents-block{display:none}
}
.news-archive{position:sticky;top:100px;max-height:calc(100vh - 124px);overflow:auto;padding:18px;border:1px solid var(--fde-line);border-radius:20px;background:var(--fde-card);scrollbar-width:thin}
.news-archive h2{font-size:13px;letter-spacing:.14em;color:#8a8a8a;font-weight:600;margin-bottom:8px}
.news-archive summary{display:flex;align-items:center;justify-content:space-between;padding:8px 4px;font-size:14px;font-weight:600;color:#e0e0e0;cursor:pointer}
.news-archive summary em{font-style:normal;font-size:12.5px;color:#6f6f6f;font-weight:400}
.news-archive ol{list-style:none;padding:0;margin-bottom:8px}
.news-archive li a{display:grid;grid-template-columns:30px minmax(0,1fr);grid-template-rows:auto auto;column-gap:10px;padding:8px;border-radius:12px;transition:background .2s}
.news-archive li a:hover{background:#1f1f1f}
.news-archive li a[aria-current]{background:#1c2422;box-shadow:inset 0 0 0 1px #7ee3d033}
.news-archive li b{grid-row:span 2;font-family:Georgia,serif;font-size:19px;color:#e8e8e8}
.news-archive li a[aria-current] b{color:var(--fde-c)}
.news-archive li small{font-size:11.5px;color:#6f6f6f}
.news-archive li span{grid-column:2;font-size:13px;line-height:1.5;color:#a6a6a6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.news-issue{min-width:0}
.news-issue-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}
.news-issue-date{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:14px;color:#8a8a8a}
.news-issue-date span{color:#6f6f6f}
.news-issue-head h1{margin-top:12px;font-size:52px;font-weight:700;letter-spacing:-.03em;color:#f5f5f5}
.news-issue-no{display:grid;justify-items:center;min-width:110px;padding:12px 16px;border:1px solid var(--fde-line);border-radius:18px;background:var(--fde-card);font-size:12px;color:#8a8a8a}
.news-issue-no b{font-family:Georgia,serif;font-size:40px;line-height:1.1;color:transparent;background:var(--fde-grad);-webkit-background-clip:text;background-clip:text}
.news-metrics{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px 28px;margin:26px 0 30px;padding:16px 0;border-block:1px solid #262626;font-size:14px;color:#9a9a9a}
.news-metrics b{margin-right:6px;font-size:24px;font-weight:700;color:#f2f2f2}
.news-metrics small{margin-left:auto;font-size:13px;color:#6f6f6f}
.news-lead h2{margin:12px 0 16px;font-size:30px;font-weight:700;line-height:1.35;letter-spacing:-.02em;color:#f5f5f5}
.news-lead .news-cover{width:100%;height:auto;max-height:none;margin-bottom:16px}
.news-lead>p{font-size:16px;line-height:1.85;color:#b0b0b0}
.news-lead .news-cite{margin-top:14px;padding:14px 16px}
.news-block{margin-top:34px}
.news-points{list-style:none;padding:0;margin-top:12px;display:grid;gap:10px}
.news-points li{display:flex;gap:14px;padding:14px 16px;border:1px solid var(--fde-line);border-radius:14px;background:var(--fde-card)}
.news-points b{font-family:Georgia,serif;font-size:20px;color:transparent;background:var(--fde-grad);-webkit-background-clip:text;background-clip:text;line-height:1.3}
.news-points a,.news-flashes a,.news-related a{font-size:15.5px;font-weight:500;color:#e8e8e8;line-height:1.6}
.news-points a:hover,.news-flashes a:hover,.news-related a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.news-points small,.news-flashes small,.news-related small{display:block;margin-top:2px;font-size:13px;color:#7c7c7c}
.news-contents{list-style:none;padding:0;margin-top:12px;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.news-contents a{display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px solid var(--fde-line);border-radius:14px;font-size:14px;color:#d6d6d6;transition:border-color .2s}
.news-contents a:hover{border-color:#3e3e3e}
.news-contents b{font-family:Georgia,serif;color:var(--fde-c)}
.news-contents em{margin-left:auto;font-style:normal;font-size:12.5px;color:#6f6f6f}
.news-part{margin-top:42px;scroll-margin-top:100px}
.news-part>h2{display:flex;align-items:center;gap:12px;margin-bottom:14px;font-size:22px;font-weight:650;color:#f2f2f2}
.news-part>h2 b{display:grid;place-items:center;min-width:34px;height:34px;border-radius:10px;background:var(--fde-grad);color:#0f0f0f;font-family:Georgia,serif;font-size:14px}
.news-part-sum{margin-bottom:12px;font-size:15px;color:#a6a6a6}
.news-cite{position:relative;padding:18px 20px;border:1px solid var(--fde-line);border-radius:16px;background:var(--fde-card)}
.news-cite+.news-cite{margin-top:12px}
.news-cite h4{margin-top:10px;font-size:17px;font-weight:650;line-height:1.55;color:#f2f2f2}
.news-cite h4 a:hover{color:#fff}
.news-cite>p{margin-top:6px;font-size:14.5px;line-height:1.8;color:#a6a6a6}
.news-more-src{color:#7c7c7c}
.news-related{list-style:none;padding:10px 0 0;margin-top:10px;border-top:1px dashed #2a2a2a;display:grid;gap:8px}
.news-related a{font-size:14px}
.news-orig{display:inline-flex;align-items:center;gap:4px;margin-top:10px;font-size:13px;color:#9a9a9a}
.news-orig:hover{color:#fff}
.news-flashes{list-style:none;padding:0;border:1px solid var(--fde-line);border-radius:16px;background:var(--fde-card)}
.news-flashes li{padding:14px 18px;border-top:1px solid #222}
.news-flashes li:first-child{border-top:0}
.news-pager{display:flex;justify-content:space-between;gap:12px;margin-top:40px}
/* item and story */
.news-detail{display:grid;grid-template-columns:minmax(0,880px) minmax(300px,380px);justify-content:space-between;gap:56px;align-items:start}
.news-article h1{margin:14px 0 8px;font-size:34px;font-weight:700;line-height:1.35;letter-spacing:-.02em;color:#f5f5f5}
.news-orig-title{margin-bottom:22px;font-size:14.5px;color:#7c7c7c}
.news-article>.news-label{margin-top:8px}
.news-guide{margin-top:10px}
.news-guide p{font-size:17.5px;line-height:1.9;color:#d0d0d0}
.news-guide p+p{margin-top:12px}
.news-group{margin-top:20px;border:1px solid var(--fde-line);border-radius:14px;background:var(--fde-card)}
.news-group summary{padding:12px 16px;font-size:14px;color:#b0b0b0;cursor:pointer}
.news-group ul{list-style:none;padding:0 16px 12px;display:grid;gap:10px}
.news-group a{font-size:14.5px;color:#e0e0e0}
.news-group small{display:block;font-size:12.5px;color:#7c7c7c}
.news-src-line{margin-top:20px;font-size:13.5px;color:#7c7c7c}
.news-src-line a{color:#a6a6a6;text-decoration:underline;text-underline-offset:3px}
.news-follow{margin-top:36px;padding-top:24px;border-top:1px solid #262626}
.news-follow header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.news-follow h2,.news-devs h2,.news-box h2{display:flex;align-items:center;gap:8px;font-size:17px;font-weight:650;color:#f2f2f2}
.news-follow h2 em,.news-devs h2 em,.news-box h2 em{font-style:normal;font-size:13px;font-weight:400;color:#7c7c7c}
.news-follow header a{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;color:var(--fde-c)}
.news-follow ul{list-style:none;padding:0;display:grid;gap:4px}
.news-follow li{padding:10px 0;border-top:1px solid #1f1f1f}
.news-follow a{font-size:15px;color:#e0e0e0}
.news-follow a:hover{color:#fff}
.news-follow small{display:block;margin-top:2px;font-size:12.5px;color:#7c7c7c}
.news-aside{position:sticky;top:100px;display:grid;gap:14px}
.news-open{width:100%}
.news-box{padding:20px;border:1px solid var(--fde-line);border-radius:18px;background:var(--fde-card)}
.news-box>p{margin-top:10px;font-size:14.5px;line-height:1.8;color:#a6a6a6}
.news-box>p b{color:#f2f2f2}
.news-box>small{display:block;margin-top:10px;font-size:13px;color:#7c7c7c}
.news-box-sub{margin-top:4px!important;font-size:13px!important;color:#7c7c7c!important}
.news-pills{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.news-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.news-chips span{padding:4px 10px;border-radius:20px;border:1px solid #2e2e2e;font-size:13px;color:#b0b0b0}
.news-side-list{list-style:none;padding:0;margin-top:12px;display:grid;gap:12px}
.news-side-list small{display:block;font-size:12.5px;color:#7c7c7c}
.news-side-list a{font-size:14.5px;font-weight:500;line-height:1.55;color:#e0e0e0}
.news-side-list a:hover{color:#fff}
.news-story-head{margin-bottom:28px}
.news-story-head h1{margin:14px 0 12px;font-size:36px;font-weight:700;line-height:1.3;letter-spacing:-.02em;color:#f5f5f5}
.news-facts{display:flex;flex-wrap:wrap;gap:8px 22px;font-size:14px;color:#8a8a8a}
.news-facts b{color:#f2f2f2;font-size:16px}
.news-article .news-box+.news-box{margin-top:14px}
.news-digest p{font-size:15.5px;line-height:1.9;color:#c6c6c6}
.news-digest p+p{margin-top:10px}
.news-devs{margin-top:30px}
.news-devs ol{list-style:none;padding:0;margin-top:14px;border-left:1px solid #2a2a2a}
.news-devs li{position:relative;padding:0 0 22px 22px}
.news-devs li:before{content:"";position:absolute;left:-4px;top:6px;width:7px;height:7px;border-radius:50%;background:var(--fde-b)}
.news-devs time{font-size:13px;color:#7c7c7c}
.news-devs h3{margin-top:4px;font-size:16px;font-weight:600;color:#ececec}
.news-devs a{display:block;margin-top:4px;font-size:14px;color:#9a9a9a}
.news-devs a:hover{color:#fff}
.news-sample+.news-sample{margin-top:60px;padding-top:40px;border-top:2px dashed #333}
@media(prefers-reduced-motion:reduce){.news-empty i,.news-live i{animation:none}}
@media(max-width:1000px){
 .news-podium,.news-daily,.news-detail{grid-template-columns:1fr}
 .news-archive{position:static;max-height:260px}
 .news-aside{position:static}
 .news-top.is-first .news-top-main{grid-template-columns:1fr}
 .news-cover{width:100%;max-height:340px}
}
@media(max-width:760px){
 .news-main{padding-top:36px}
 .news-nav{display:flex;width:100%}.news-nav a{flex:1;text-align:center;padding:8px 6px}
 .news-filters{flex-wrap:nowrap;overflow-x:auto;margin-inline:-16px;padding-inline:16px;scrollbar-width:none}
 .news-filters a{flex:none}
 .news-strip{padding:14px 16px 6px}
 .news-strip li{grid-template-columns:22px minmax(0,1fr) auto;gap:10px}
 .news-strip .news-faces,.news-strip .news-tick{display:none}
 .news-dayhead{top:68px}
 .news-card{grid-template-columns:1fr}
 .news-card:before,.news-clock:after{display:none}
 .news-clock{padding:0 0 6px}
 .news-card-body{padding:16px}
 .news-card h3{font-size:16.5px}
 .news-sum{font-size:14px}
 .news-more{margin-left:0}
 .news-top{padding:18px}
 .news-top.is-first h2{font-size:22px}
 .news-top footer{flex-wrap:wrap}
 .news-board{padding:4px 16px}
 .news-board li{grid-template-columns:28px minmax(0,1fr) auto;gap:12px}
 .news-board .news-faces,.news-board .news-spark{display:none}
 .news-issue-head h1{font-size:38px}
 .news-issue-no{min-width:86px;padding:10px}
 .news-issue-no b{font-size:30px}
 .news-metrics{gap:8px 18px}.news-metrics b{font-size:20px}.news-metrics small{margin-left:0;width:100%}
 .news-lead h2{font-size:23px}
 .news-article h1,.news-story-head h1{font-size:25px}
 .news-guide p{font-size:16px}
}

/* case pages */
.back-link{font-size:14px;min-height:40px}
.case-title h1{font-size:28px;font-weight:650}
.case-title p{font-size:15px;color:#a8a8a8}
.demo-note{font-size:13px}
.demo-window-bar{font-size:13px}
.demo-action{font-size:13px;min-height:32px;padding:5px 12px}
.demo-caption{font-size:14px}
.case-about>h2{font-size:34px;font-weight:650;letter-spacing:-.02em;margin-bottom:24px}
.about-grid>article,.about-features>article{border-radius:20px;border-color:#2a2a2a;background:var(--fde-card)}
.about-grid>article{padding:26px}
.about-grid p{font-size:15.5px;line-height:1.85;color:#b0b0b0}
.about-grid .about-lead{font-size:18px;font-weight:600;color:#f2f2f2}
.about-features h3{font-size:17px;font-weight:600}
.about-features p{font-size:14.5px}
.delivery-list{font-size:15px;color:#b0b0b0}
.case-next .eyebrow{font-size:13px}
.case-next h2,.case-page .case-next h2{font-size:28px;font-weight:650}
.case-next .button{font-size:15px}

@media(max-width:900px){
 .about-hero .fde-hero-grid,.contact-layout{grid-template-columns:1fr}
 .about-photo{justify-self:start;width:min(100%,360px)}
 .knowledge-head{flex-direction:column;align-items:flex-start}
}
@media(max-width:760px){
 .eyebrow,.small-label{font-size:13px}
 .tags span{font-size:13px}
 .fde-head h1{margin-top:14px;font-size:27px}
 .about-roles li{font-size:16px}
 .about-actions{flex-direction:column}
 .about-actions .fde-btn,.about-actions .fde-ghost{width:100%}
 .timeline-tools,.timeline-instruction{font-size:13px}
 .timeline-period,.timeline-position,.timeline-phase{font-size:13px}
 .timeline-year{font-size:28px}
 .career-panel{grid-template-columns:1fr}
 .career-index{border-right:0;border-bottom:1px solid #2a2a2a}
 .career-index>span,.career-index>small{font-size:13px}
 .career-index>strong{font-size:32px}
 .career-heading h3{font-size:22px}
 .career-resume p{font-size:14.5px}
 .education-note strong{font-size:14px}
 .education-note>div>span,.education-note time{font-size:13px}
 .contact-number{font-size:32px}
 .contact-section .contact-copy .tags span{font-size:13px}
 .contact-section .contact-copy>p.contact-closing{font-size:15px}
 .contact-actions{flex-direction:column}
 .contact-actions .fde-btn,.contact-actions .fde-ghost{width:100%}
 .contact-card-top>span:last-child,.contact-card .eyebrow{font-size:13px}
 .case-live,.case-role,.case-card-bottom{font-size:13px}
 .case-card-copy h3{font-size:21px}
 .case-card-copy>p{font-size:15px}
 .case-title h1{font-size:22px}
 .case-about>h2{font-size:26px}
 .about-grid p,.about-features p{font-size:14.5px}
 .demo-window-bar,.demo-action,.demo-caption{font-size:13px}
}

/* Every screen size (checked from 360px phones to 2560px monitors): no text under 12px, and reading
   columns kept to a comfortable width. Last in the file so it wins over the older rules above. */
.footer-explore>nav a{font-size:13px;padding:6px 13px}
.back-top{font-size:13px}
.footer-bottom{font-size:12px;letter-spacing:.06em;color:#8a8a8a}
.news-score small,.news-archive li small{font-size:12px}
.career-work .small-label{font-size:12px}
.case-page .demo-note{font-size:13px}
.case-page .demo-caption{font-size:14px}
@media(max-width:760px){
 .footer-explore>nav a{font-size:13px}
 .case-page .demo-caption{font-size:13px}
 .eyebrow,.small-label{font-size:12px}
}
.news-issue-no small{white-space:nowrap}
@media(max-width:760px){.news-issue-head{gap:14px}.news-issue-no{min-width:96px;padding:10px 8px}}
/* long paragraphs on big screens: about 50 characters a line */
.career-resume p{max-width:52em}
@media(min-width:1600px){.career-resume p{font-size:15px}}
.case-page .demo-caption{max-width:48em}

/* Phones: one calm row — FDE 前沿部署工程师 and a menu button; the tabs and 免费预约 are in a full-screen
   menu (src/site.js). Wider screens keep the tabs in the header and never show the menu. */
.menu-open,.site-menu{display:none}
@media(max-width:760px){
 .site-header .header-inner,.case-page .site-header .header-inner{height:64px;gap:12px}
 .site-header .page-tabs,.site-header .header-cta{display:none}
 .site-header .brand{padding:0 2px;border:0;background:none;box-shadow:none;transform:none}
 .site-header .brand-name{font-size:20px}
 .site-header .brand-tag{display:inline-block;padding-left:10px;font-size:12.5px;letter-spacing:.1em}
 .menu-open{display:grid;place-content:center;gap:4px;flex:none;width:42px;height:42px;border:1px solid #2e2e2e;border-radius:13px;background:#161616;cursor:pointer}
 .menu-open i{display:block;width:17px;height:1.6px;border-radius:2px;background:#e6e6e6}
 .menu-open:active{background:#222}
 .site-menu:not([hidden]){display:flex;flex-direction:column;position:fixed;inset:0;z-index:90;padding:calc(10px + env(safe-area-inset-top)) 20px calc(22px + env(safe-area-inset-bottom));background:#0d0d0df5;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);animation:menu-in .28s cubic-bezier(.2,.8,.2,1)}
 .site-menu-top{display:flex;align-items:center;justify-content:space-between;height:64px;border-bottom:1px solid #1f1f1f}
 .menu-close{display:grid;place-items:center;width:42px;height:42px;border:1px solid #2e2e2e;border-radius:13px;background:#161616;color:#e6e6e6;font-size:18px}
 .site-menu-links{display:flex;flex-direction:column;margin-top:8px}
 .site-menu-links a{display:flex;align-items:center;justify-content:space-between;padding:21px 4px;border-bottom:1px solid #1c1c1c;font-size:23px;font-weight:650;letter-spacing:.01em;color:#ececec;animation:menu-item .4s cubic-bezier(.2,.8,.2,1) both}
 .site-menu-links a:nth-child(2){animation-delay:.04s}.site-menu-links a:nth-child(3){animation-delay:.08s}.site-menu-links a:nth-child(4){animation-delay:.12s}
 .site-menu-links a>span:last-child{font-size:20px;color:#555}
 .site-menu-links a[aria-current] span:first-child{background:var(--fde-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
 .site-menu-links a[aria-current] span:last-child{color:var(--fde-c)}
 .site-menu-book{margin-top:auto;width:100%;min-height:56px}
 .menu-shown .fde-bar{display:none}
 html{scroll-padding-top:76px}
 .news-dayhead{top:64px}
}
@media(max-width:380px){.site-header .brand-tag{font-size:12px;padding-left:8px}}
@keyframes menu-in{from{opacity:0}}
@keyframes menu-item{from{opacity:0;transform:translateY(10px)}}
@media(prefers-reduced-motion:reduce){.site-menu,.site-menu-links a{animation:none!important}}
/* AI 资讯: when the news was last fetched */
.news-fresh{display:flex;align-items:center;gap:8px;margin:-8px 0 20px;font-size:13px;color:#7c7c7c}
.news-fresh i{width:7px;height:7px;border-radius:50%;background:var(--fde-c);box-shadow:0 0 0 3px #7ee3d022}
/* the AI 助理's answers (sent automatically before the owner has written, scripts/chat.mjs): a small
   gradient name on top, the words typed in with a caret */
.chat-log .is-auto{border:1px solid #2f2f3a;background:linear-gradient(160deg,#20202a,#1c1c1c)}
.chat-log .is-auto::before{content:"✦ " attr(data-label);display:block;margin-bottom:4px;font-size:12px;font-weight:600;letter-spacing:.04em;background:var(--fde-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.chat-log .is-auto.chat-typing::before{display:none}
.chat-caret{display:inline-block;width:2px;height:1em;margin-left:2px;vertical-align:-.15em;background:var(--fde-c);animation:chat-caret .9s steps(2) infinite}
@keyframes chat-caret{50%{opacity:0}}

/* 相关案例 (/cases/) — on top, the words and the owner's card on the left, three photos of him at work laid
   over each other on the right; then two rows of every event photo sliding sideways within the page's
   margins (shown whole, at their own proportions), then the systems. */
.cases-main{padding-top:44px}
.cases-hero{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(40px,4vw,72px);align-items:center;padding-bottom:clamp(36px,3vw,52px)}
.cases-intro h1{margin-top:16px;font-size:clamp(32px,2.6vw,62px);font-weight:750;line-height:1.25;letter-spacing:-.02em;color:#f5f5f5}
.cases-intro .fde-lead{margin-top:14px;font-size:clamp(15px,1.05vw,20px);line-height:1.8;color:#a8a8a8}
.cases-me{display:flex;align-items:center;gap:12px;margin-top:22px;padding:12px 14px;border:1px solid var(--fde-line);border-radius:18px;background:var(--fde-card)}
.cases-me img{flex:none;width:46px;height:46px;border-radius:50%;object-fit:cover;object-position:50% 18%;border:2px solid #2e2e2e}
.cases-me b{font-size:15px;font-weight:650;color:#f2f2f2}
.cases-me{align-items:flex-start}
.cases-me img{margin-top:2px}
.cases-roles{list-style:none;margin-top:6px;padding:0;display:grid;gap:2px}
.cases-roles li{position:relative;padding-left:14px;font-size:13px;line-height:1.6;color:#a6a6a6}
.cases-roles li:before{content:"·";position:absolute;left:2px;color:var(--fde-c);font-weight:700}
.cases-formats{display:flex;flex-wrap:wrap;gap:7px;margin-top:16px}
.cases-formats span{padding:5px 12px;border-radius:30px;border:1px solid #333;background:#161616;font-size:12.5px;color:#d0d0d0}
.cases-stage{position:relative;width:100%;aspect-ratio:1.42}
.cases-glow{position:absolute;inset:10% 12%;background:radial-gradient(closest-side,#8fb3ff38,transparent);filter:blur(30px)}
.scene{position:absolute;margin:0;overflow:hidden;border-radius:18px;border:1px solid #2e2e2e;background:#151515;box-shadow:0 30px 80px #000000c0}
.scene img{display:block;width:100%;height:100%;object-fit:cover}
.scene.s1{left:0;top:0;width:100%;aspect-ratio:2.71;z-index:1}
.scene.s2{--r:-3deg;left:2%;top:34.8%;width:47%;aspect-ratio:1;z-index:3;transform:rotate(var(--r));animation:scene-float 7s ease-in-out infinite}
.scene.s3{--r:2.5deg;right:-2%;top:49.7%;width:58%;aspect-ratio:16/9;z-index:4;transform:rotate(var(--r));animation:scene-float 8s ease-in-out 1s infinite}
@keyframes scene-float{50%{transform:translateY(-7px) rotate(var(--r))}}
.cases-more{margin-top:4px}
.strip{overflow-x:auto;overflow-y:hidden;scrollbar-width:none;cursor:grab;border-radius:16px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}
.strip::-webkit-scrollbar{display:none}
.strip+.strip{margin-top:clamp(10px,.8vw,16px)}
.strip.is-dragging{cursor:grabbing}
.strip-track{display:flex;gap:clamp(10px,.8vw,16px);width:max-content}
.strip-track img{display:block;height:clamp(140px,12.4vw,270px);width:auto;border-radius:14px;border:1px solid #262626;background:#161616;opacity:0;transition:opacity .6s ease;-webkit-user-drag:none;user-select:none}
.strip-track img.is-in{opacity:1}
.strip.is-low .strip-track img{height:clamp(124px,11.2vw,244px)}
.cases-hint{display:flex;align-items:center;gap:10px;margin-top:12px;font-size:13px;color:#8a8a8a}
.cases-hint:before{content:"";width:28px;height:1px;background:linear-gradient(90deg,var(--fde-a),var(--fde-c))}
.cases-systems{margin-top:52px;padding-top:48px;border-top:1px solid #1f1f1f}
/* 相关案例 starts with the systems: their heading is the page's title (h1) */
.cases-main .cases-systems{margin-top:0;padding-top:0;border-top:0}
.cases-systems .fde-head h1{font-size:clamp(28px,2.4vw,44px)}

/* 相关案例 is denser than the home page: smaller system cards and photo rows, so more fits on a screen */
.cases-page .cases-main{padding-top:clamp(28px,3vw,52px);padding-bottom:clamp(48px,5vw,72px)}
.cases-page .cases-systems .case-cover{aspect-ratio:1.6}  /* the covers' own shape: nothing cut */
/* the covers are already pictures of several windows: shown whole, edge to edge (no window of their own) */
.case-cover .cover-shot.is-full{inset:0;width:auto;border-radius:0;box-shadow:none;background:none}
.case-cover .cover-shot.is-full img{width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.case-card:hover .cover-shot.is-full{transform:scale(1.02)}
.cases-page .cases-systems .case-card-copy{padding:clamp(14px,1.1vw,20px) clamp(16px,1.3vw,24px)}
.cases-page .cases-systems .case-card-copy h3{font-size:clamp(17px,1.25vw,22px)}
.cases-page .cases-systems .case-card-copy>p{font-size:clamp(13px,.9vw,15px);line-height:1.7}
.cases-page #events.fde-part{padding-block:clamp(48px,5vw,72px)}

/* the events: one card each, three in a row */
.ev-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.2vw,18px);align-items:start}
.ev-col{display:flex;flex-direction:column;gap:clamp(12px,1.2vw,18px);min-width:0}  /* site.js deals the cards into these columns, so they close up like bricks */
.ev{display:flex;flex-direction:column;border:1px solid var(--fde-line);border-radius:18px;background:var(--fde-card);overflow:hidden}
.ev-pics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:4px}
.ev-pics img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:6px;background:#111}  /* the photos are cut to these shapes beforehand, around faces and people */
.ev-pics > img:first-of-type, .ev-pics > noscript:first-of-type img{grid-column:1/-1;aspect-ratio:3/2;border-radius:14px 14px 6px 6px}
.ev-pics > img:only-of-type, .ev-pics > noscript:only-of-type img{border-radius:14px}
.ev-pics.r1 > img:nth-of-type(2), .ev-pics.r1 > noscript:nth-of-type(2) img{grid-column:1/-1;aspect-ratio:3.2}
.ev-pics.r2{grid-template-columns:repeat(2,minmax(0,1fr))}
.ev-pics.r2 > img:nth-of-type(n+2), .ev-pics.r2 > noscript:nth-of-type(n+2) img{aspect-ratio:1.8}
.ev-pics.tail1 > img:last-of-type, .ev-pics.tail1 > noscript:last-of-type img{grid-column:1/-1;aspect-ratio:3.2}  /* one left over on the last row: across it */
.ev-pics.is-tall > img:first-of-type, .ev-pics.is-tall > noscript:first-of-type img{aspect-ratio:4/5}
.ev-body{padding:14px 18px 18px}
.ev h3{font-size:16.5px;font-weight:650;line-height:1.45;color:#f2f2f2}
.ev-meta{margin-top:4px;font-size:12.5px;color:#8a8a8a}
.ev-meta i{font-style:normal;margin:0 .45em}
.ev-theme{margin-top:10px;padding-left:10px;border-left:2px solid var(--fde-b);font-size:13.5px;line-height:1.6;color:#e2ddff}
.ev-text{margin-top:8px;font-size:13.5px;line-height:1.75;color:#a9a9a9}
@media(max-width:1150px){.ev-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.ev-grid{grid-template-columns:1fr}}
@media(max-width:1023px){
 .cases-hero{grid-template-columns:1fr;gap:36px}
 .cases-stage{max-width:620px}
}
@media(max-width:760px){
 .cases-main{padding-top:36px}
 .cases-intro h1{font-size:30px}
 .cases-intro .fde-lead{font-size:15px}
 .scene{border-radius:12px}
 .strip-track{gap:8px}.strip+.strip{margin-top:8px}
 .strip-track img{height:120px;border-radius:12px}
 .strip.is-low .strip-track img{height:108px}
 .cases-systems{margin-top:44px;padding-top:40px}
}
@media(prefers-reduced-motion:reduce){.scene.s2,.scene.s3{animation:none}}
/* the owner's card and tags grow with the title on large screens */
@media(min-width:1600px){
 .cases-me{gap:clamp(12px,.8vw,18px);padding:clamp(12px,.85vw,18px) clamp(14px,1vw,20px)}
 .cases-me img{width:clamp(46px,3vw,64px);height:clamp(46px,3vw,64px)}
 .cases-me b{font-size:clamp(15px,.95vw,19px)}
 .cases-roles li{font-size:clamp(13px,.82vw,16px)}
 .cases-formats span{font-size:clamp(12.5px,.78vw,15px);padding:clamp(5px,.35vw,7px) clamp(12px,.75vw,15px)}
}
/* 相关案例 — the four systems in one row on a computer (two by two on a tablet, one column on a phone);
   a lower picture (16:9) and words that scale with the screen like the photos above them. */

.cases-systems .fde-head h2{font-size:clamp(26px,2.2vw,40px)}
.cases-systems .fde-head p{font-size:clamp(14.5px,1vw,17px)}
.cases-systems .case-grid{gap:clamp(12px,1.2vw,18px)}
@media(min-width:1101px){.cases-systems .case-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.cases-systems .case-cover{aspect-ratio:16/9}
.cases-systems .case-cover-top{top:clamp(12px,1.1vw,20px);left:clamp(14px,1.3vw,24px);right:clamp(12px,1.1vw,20px)}
.cases-systems .case-index{min-width:clamp(28px,2.1vw,36px);height:clamp(28px,2.1vw,36px);font-size:clamp(12.5px,.9vw,15px)}
.cases-systems .case-live{font-size:clamp(12px,.85vw,13.5px)}
.cases-systems .cover-shot{top:clamp(48px,4vw,70px);left:clamp(14px,1.3vw,24px)}
.cases-systems .case-card-copy{padding:clamp(18px,1.5vw,28px) clamp(18px,1.6vw,30px)}
.cases-systems .case-card-copy h3{font-size:clamp(19px,1.55vw,28px);line-height:1.4}
.cases-systems .case-card-copy>p{font-size:clamp(14px,1vw,16.5px);line-height:1.8}
.cases-systems .case-role{font-size:clamp(12.5px,.85vw,14px)}
.cases-systems .case-card-bottom{font-size:clamp(13px,.92vw,15px)}

/* readable lines and labels in 关于 Yaki */
.resume-block p{max-width:44em}
.education-note .small-label{font-size:12px}
.case-cover .case-cover-top{z-index:2}  /* the badges stay above a full-size cover */

/* ===== FDE 服务说明 (/services/) and the scene pages (/solutions/…) — in 首页's system =====
   Same chapters (.fde-part a/b + .fde-head), same card (#161616 / #262626 / radius 20), one accent (the
   cool gradient). The service page opens on what the service includes (four stages that light up one by
   one, the page's heading), then which industries and which kinds of work it covers, how the effect is measured
   and what is promised, and questions. */
.service-page main{overflow:hidden}
.svc-hero{position:relative;padding-top:clamp(40px,4vw,72px)}
.svc-hero:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 560px 420px at 80% 38%,#7f8cff24,transparent 70%),radial-gradient(ellipse 400px 300px at 95% 85%,#5fe1c81a,transparent 70%),linear-gradient(#ffffff06 1px,transparent 1px) 0 0/48px 48px,linear-gradient(90deg,#ffffff06 1px,transparent 1px) 0 0/48px 48px;-webkit-mask-image:radial-gradient(ellipse 90% 80% at 60% 40%,#000 30%,transparent 85%);mask-image:radial-gradient(ellipse 90% 80% at 60% 40%,#000 30%,transparent 85%)}
.svc-hero>.wrap{position:relative}
.svc-hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:56px;align-items:center}
.svc-intro h1{margin-top:20px;font-size:48px;font-weight:700;line-height:1.22;letter-spacing:-.04em;color:#f7f7f7}
.svc-intro .fde-lead{max-width:560px}
.svc-icon{display:inline-grid;place-items:center;flex:none;width:44px;height:44px;border-radius:13px;background:#1e1d26;border:1px solid #34304d;color:#c9bcff;font-size:20px;transition:background .25s,color .25s,border-color .25s}
@keyframes svc-in{from{opacity:0;transform:translateY(12px)}}
/* the page opens on the four stages (the page's heading); the line draws and the steps light up on load */
.svc-top .fde-head{max-width:760px}
.svc-top .fde-head h1{margin-top:18px;font-size:48px;font-weight:700;line-height:1.25;letter-spacing:-.04em;color:#f7f7f7}
.svc-top .svc-flow{margin-top:8px}
.svc-top-actions{margin-top:44px}
.svc-top-actions .about-actions{margin-top:0}
.svc-top .svc-flow:before{animation:svc-line 1s ease .2s both}
.svc-top .svc-flow li{animation:svc-in .5s ease both;animation-delay:calc(var(--i) * .3s + .3s)}
.svc-top .svc-flow .fde-node{animation:svc-light .4s ease both;animation-delay:calc(var(--i) * .3s + .55s)}
@keyframes svc-line{from{transform:scaleX(0)}}
@keyframes svc-light{from{background:#1b1b1b;color:#dedede;box-shadow:none}}
/* four stages: the line draws, then each step lights up */
.svc-flow li{gap:2px}
.svc-flow .fde-node{background:var(--fde-grad);border-color:transparent;color:#0f0f0f;box-shadow:0 0 0 6px #b79cff1a}
.reveal-on .svc-flow .fde-node{transition:background .4s,color .4s,box-shadow .4s;transition-delay:calc(var(--i) * .3s + .3s)}
.reveal-on .svc-flow:not(.is-in) .fde-node{background:#1b1b1b;border:1px solid #333;color:#dedede;box-shadow:none}
.svc-flow.is-three{grid-template-columns:repeat(3,1fr)}
.svc-num{font-family:Georgia,serif;font-size:20px;font-weight:700}
.svc-step{font-size:12.5px;letter-spacing:.12em;color:#8a8a8a}
.svc-flow p{margin-top:4px;font-size:15px;line-height:1.75;color:#a3a3a3}
.svc-out{display:flex;align-items:baseline;gap:12px;margin-top:16px;padding-top:12px;border-top:1px solid #2a2a2a}
.svc-out small{flex:none;font-size:12px;letter-spacing:.14em;color:#7a7a7a}
.svc-out span{font-size:14.5px;font-weight:600;color:transparent;background:var(--fde-grad);-webkit-background-clip:text;background-clip:text}
/* before → after strip (scene pages) */
.svc-ba{display:grid;gap:8px;margin-top:16px}
.svc-ba p{display:flex;align-items:flex-start;gap:10px;margin:0;padding:10px 12px;border-radius:12px;font-size:14px;line-height:1.6}
.svc-ba i{flex:none;margin-top:2px;padding:1px 7px;border-radius:6px;font-style:normal;font-size:11.5px;font-weight:650}
.svc-ba .was{border:1px solid #262626;background:#141414;color:#8d8d8d}
.svc-ba .was i{background:#262626;color:#9a9a9a}
.svc-ba .now{border:1px solid #7ee3d02e;background:#7ee3d00d;color:#effffb}
.svc-ba .now i{background:var(--fde-grad);color:#0f0f0f}
.svc-more{display:inline-flex;align-items:center;gap:6px;margin-top:auto;padding-top:16px;font-size:13.5px;font-weight:500;color:#e8e8e8}
/* icon tiles (industries and kinds of work): dark glass with a light top edge and a soft glow;
   the icon itself is a thin line in the page's gradient (#svc-ico in .svc-defs) */
.svc-defs{position:absolute;width:0;height:0;overflow:hidden}
.svc-ind-icon,.svc-kind-icon{display:grid;place-items:center;flex:none;width:52px;height:52px;border-radius:16px;border:1px solid #ffffff17;background:radial-gradient(circle at 28% 16%,#8fb3ff30,transparent 62%),linear-gradient(150deg,#25252f,#17171c 72%);box-shadow:inset 0 1px 0 #ffffff1c,0 10px 26px #00000059;font-size:26px;transition:border-color .25s,box-shadow .25s,transform .25s}
.svc-ind-icon .ico,.svc-kind-icon .ico{filter:drop-shadow(0 0 6px #b79cff38)}
.svc-ind:hover .svc-ind-icon,.svc-kind:hover .svc-kind-icon{border-color:#8fb3ff4d;box-shadow:inset 0 1px 0 #ffffff24,0 12px 32px #8fb3ff24;transform:translateY(-2px)}
/* industries: icon tile and name, then the work as a dotted list */
.svc-inds{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.svc-ind{padding:24px;border:1px solid #2c2c2c;border-radius:20px;background:#1c1c1c}
.reveal-on .svc-ind[data-reveal]{transition:opacity .6s ease calc(var(--i) * .08s),transform .6s ease calc(var(--i) * .08s),border-color .2s}
.svc-ind:hover{border-color:#3d3a55}
.svc-ind-top{display:flex;align-items:center;gap:14px}
.svc-ind-top h3{font-size:19px;font-weight:650;color:#f4f4f4}
.svc-jobs{list-style:none;margin:18px 0 0;padding:16px 0 0;border-top:1px solid #2a2a2a;display:grid;gap:11px}
.svc-jobs li{display:flex;align-items:center;gap:10px;font-size:15px;color:#e2e2e2}
.svc-jobs li:before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--fde-grad)}
.svc-jobs li.is-more{padding-left:16px;letter-spacing:.2em;color:#7d7d7d}
.svc-jobs li.is-more:before{display:none}
.reveal-on .svc-ind .svc-jobs li{opacity:0;transform:translateX(-8px);transition:opacity .35s ease calc(var(--i) * .08s + var(--k) * .07s + .25s),transform .35s ease calc(var(--i) * .08s + var(--k) * .07s + .25s)}
.reveal-on .svc-ind.is-in .svc-jobs li{opacity:1;transform:none}
.svc-ind-more{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:16px;padding:18px 24px;border-radius:20px;border:1px dashed #3a3a3a}
.svc-ind-more p{font-size:15.5px;line-height:1.7;color:#bdbdbd}
.svc-ind-more b{margin-right:6px;color:#f2f2f2}
/* kinds of work by function: icon tile, name, one line (not links) */
.svc-kinds{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.svc-kind{padding:24px;border:1px solid var(--fde-line);border-radius:20px;background:var(--fde-card)}
.reveal-on .svc-kind[data-reveal]{transition:opacity .6s ease calc(var(--i) * .08s),transform .6s ease calc(var(--i) * .08s),border-color .2s}
.svc-kind:hover{border-color:#3d3a55}
.svc-kind h3{margin-top:18px;font-size:18px;font-weight:650;color:#f2f2f2}
.svc-kind p{margin-top:8px;font-size:14.5px;line-height:1.75;color:#a6a6a6}
/* effect and promises */
.svc-pair{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.svc-panel{padding:28px;border-radius:20px;border:1px solid #2c2c2c;background:#1c1c1c}
.svc-panel h3{display:flex;align-items:center;gap:12px;font-size:20px;font-weight:650;color:#f2f2f2}
.svc-panel h3 .svc-icon{width:38px;height:38px;font-size:17px;border-radius:11px}
.svc-list{list-style:none;padding:0;margin:22px 0 0;display:grid;gap:18px}
.svc-list li{display:flex;gap:14px}
.svc-list li>span{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--fde-grad);color:#0f0f0f;font-size:13px;font-weight:700}
.svc-list.is-check li>span{background:#7ee3d01a;color:var(--fde-c);font-size:14px}
.svc-list b{font-size:16.5px;font-weight:650;color:#f2f2f2}
.svc-list p{margin-top:2px;font-size:14.5px;line-height:1.7;color:#a3a3a3}
.reveal-on .svc-panel .svc-list li{opacity:0;transform:translateX(-10px);transition:opacity .45s ease,transform .45s ease}
.reveal-on .svc-panel .svc-list li:nth-child(2){transition-delay:.2s}.reveal-on .svc-panel .svc-list li:nth-child(3){transition-delay:.4s}
.reveal-on .svc-panel.is-in .svc-list li{opacity:1;transform:none}
/* a scene page */
.svc-intro .back-link{gap:6px}
.svc-label{display:flex;align-items:center;gap:12px;margin-top:24px;font-size:13px;font-weight:600;letter-spacing:.1em;color:#cfcfcf}
.svc-label .svc-icon{width:36px;height:36px;font-size:17px;border-radius:11px;background:var(--fde-grad);border:0;color:#0f0f0f}
.svc-label+h1{margin-top:14px;font-size:42px}
.svc-intro>.svc-ba{max-width:560px;margin-top:20px}
.svc-intro>.svc-ba p{font-size:15.5px;padding:12px 14px}
.svc-audience{margin-top:20px}
.svc-audience small{font-size:12.5px;letter-spacing:.06em;color:#8a8a8a}
.svc-audience .cases-formats{margin-top:8px}
.svc-get{padding:26px 28px;border-radius:22px;border:1px solid transparent;background:linear-gradient(#141414,#141414) padding-box,linear-gradient(160deg,#8fb3ff88,#2a2a2a 40%,#2a2a2a 70%,#7ee3d066) border-box}
.svc-get ul{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:10px}
.svc-get li{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:14px;border:1px solid #2a2a2a;background:#191919;font-size:16px;font-weight:600;color:#f0f0f0}
.svc-get li .ico{color:var(--fde-c)}
.reveal-on .svc-get li{opacity:0;transform:translateY(8px);transition:opacity .4s ease calc(var(--i) * .15s + .2s),transform .4s ease calc(var(--i) * .15s + .2s)}
.reveal-on .svc-get.is-in li{opacity:1;transform:none}
.svc-next-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
@media(prefers-reduced-motion:reduce){.svc-top .svc-flow:before,.svc-top .svc-flow li,.svc-top .svc-flow .fde-node{animation:none}}
@media(max-width:1150px){.svc-inds,.svc-kinds{grid-template-columns:repeat(2,minmax(0,1fr))}.svc-intro h1,.svc-top .fde-head h1{font-size:40px}.svc-label+h1{font-size:36px}}
@media(max-width:900px){.svc-hero-grid,.svc-pair{grid-template-columns:1fr}.svc-hero-grid{gap:36px}.svc-flow.is-three{grid-template-columns:1fr 1fr}}
@media(max-width:760px){
 .svc-intro h1,.svc-label+h1,.svc-top .fde-head h1{font-size:29px}
 .svc-top-actions{margin-top:32px}
 .svc-inds,.svc-kinds{grid-template-columns:1fr}
 .svc-ind{padding:20px}
 .svc-ind-more{flex-direction:column;align-items:flex-start;padding:18px 20px}
 .svc-get{padding:20px}
 .svc-flow li{align-items:start}
 .svc-flow .fde-node{grid-row:1/5;align-self:start}
 .svc-flow.is-three{grid-template-columns:1fr}
 .svc-flow.is-three .fde-node{grid-row:1/3}
 .svc-kind,.svc-panel{padding:20px}
}

.language-switch{font-size:12px;white-space:nowrap;color:var(--muted);padding:8px;border:1px solid var(--line);border-radius:8px}

/* Header identity only; retain the existing dark site and navigation. */
.brand .zhilian-logo{display:block;flex:none;width:26px;height:31px;object-fit:contain}
.brand .brand-name.zhilian-name{background:none;-webkit-text-fill-color:#FAFAFA;color:#FAFAFA;font-size:20px;font-weight:600;letter-spacing:1px;line-height:1.25}
@media(max-width:760px){.brand .zhilian-logo{width:24px;height:29px}.site-header .brand-name.zhilian-name,.site-menu .brand-name.zhilian-name{font-size:20px;letter-spacing:.5px}}

/* Zhilian Mofang: shared typography, based on the v1.0 type scale.
   Keep the existing dark surfaces, grids, content and illustrations. */
:root{--sans:"PingFang SC","Microsoft YaHei",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--serif:var(--sans);--type-body:16px;--type-control:14px;--type-caption:12px;--type-card:20px;--type-section:24px;--type-page:32px;--type-mono:ui-monospace,SFMono-Regular,Consolas,monospace}
body{font-family:var(--sans);font-size:var(--type-body);font-weight:400;line-height:1.5}
.site-shell *,.site-menu *,.chat-widget *{font-family:var(--sans)}
.site-shell :is(code,pre,kbd,samp){font-family:var(--type-mono)}
button,input,textarea,select{font-family:var(--sans)}
/* A larger, open mark and a quieter wordmark; no button frame or colored glow. */
.site-header .brand,.site-menu .brand{gap:12px;padding:4px 0;min-height:52px;border:0;border-radius:0;background:none;box-shadow:none;transform:none;flex:none}
.site-header .brand:hover,.site-menu .brand:hover{background:none;box-shadow:none;transform:none}
.site-header .brand .zhilian-logo,.site-menu .brand .zhilian-logo{width:42px;height:50px;object-fit:contain}
.site-header .brand .zhilian-name,.site-menu .brand .zhilian-name{font-size:20px;line-height:28px;font-weight:500;letter-spacing:.04em;color:#FAFAFA;-webkit-text-fill-color:#FAFAFA;background:none}
.site-header .page-tabs a,.site-header .language-switch,.site-header .header-cta{font-size:var(--type-control);line-height:20px;font-weight:500;letter-spacing:0}
.site-menu .site-menu-links a{font-size:24px;line-height:32px;font-weight:500;letter-spacing:0}
/* Semantic headings share one scale across home, services, cases and articles. */
.site-shell #main h1{font-size:var(--type-page);line-height:1.25;font-weight:600;letter-spacing:-.015em}
.site-shell #main :is(.home-hero,.svc-top,.svc-hero) h1{font-size:clamp(32px,3.35vw,48px);line-height:1.25;font-weight:500;letter-spacing:-.02em}
.site-shell #main h2{font-size:var(--type-section);line-height:1.3334;font-weight:600;letter-spacing:0}
.site-shell #main h3,.site-shell #main h4{font-size:var(--type-card);line-height:1.4;font-weight:600;letter-spacing:0}
.site-shell #main :is(.news-top,.news-card,.news-box,.news-follow,.news-devs) h2{font-size:var(--type-card);line-height:1.4}
.site-shell #main p{font-size:var(--type-body);line-height:1.5;font-weight:400;letter-spacing:0}
.site-shell #main :is(.guide-section,.industry-section,.news-guide,.news-digest,.career-resume) p{line-height:1.75}
.site-shell #main :is(.fde-lead,.industry-deck){font-size:var(--type-body)!important;line-height:1.75!important}
.site-shell #main :is(.fde-qa,.about-features,.svc-kind,.svc-ind-top) h3{font-size:var(--type-card);line-height:1.4}
.site-shell #main :is(.fde-btn,.fde-ghost,.button,.text-link,.demo-action,.back-link,.industry-primary){font-size:var(--type-control);line-height:20px;font-weight:500;letter-spacing:0}
.site-shell #main :is(input,textarea,select){font-size:var(--type-body);line-height:24px;font-weight:400}
.site-shell #main :is(.tags span,.cases-formats span,.case-live,.case-role,.case-card-bottom,.fde-kicker,.eyebrow,.small-label,.timeline-tools,.timeline-instruction,.timeline-period,.timeline-position,.timeline-phase,.svc-step,.svc-more,.news-filters a,.news-nav a,.news-facts,.news-meta,.news-orig,.news-src-line,.news-sum,.demo-note,.demo-caption,.demo-window-bar,.fde-fine){font-size:var(--type-control);line-height:20px;font-weight:400;letter-spacing:0}
.site-shell #main :is(.fde-compare-row,.delivery-list,.svc-jobs li,.svc-list b,.fde-flow b,.about-roles li,.career-work li,.guide-section li,.industry-section li){font-size:var(--type-body);line-height:24px}
.site-shell #main :is(.fde-flow small,.svc-list p,.svc-out span,.education-note strong,.education-note time,.education-note>div>span){font-size:var(--type-control);line-height:20px}
.site-shell #main :is(.guide-meta,.guide-disclosure){font-size:var(--type-control)!important;line-height:20px}
.site-shell #main :is(small,time,.news-label,.news-clock,.news-category){font-size:var(--type-caption);line-height:18px;letter-spacing:0}
.site-shell #main :is(.fde-kicker b,.timeline-year,.case-index,.svc-num,.news-issue-no b,.news-score b,.news-metrics b){font-family:var(--type-mono);font-variant-numeric:tabular-nums;font-style:normal}
.site-shell #main :is(.timeline-year,.career-index>strong,.case-context>span){font-style:normal;font-weight:500}
.site-shell #main :is(b,strong){font-weight:600}
.site-footer :is(a,p){font-family:var(--sans)}
.site-footer .footer-explore>nav a,.site-footer .back-top{font-size:var(--type-control);line-height:20px;font-weight:400;letter-spacing:0}
.site-footer .footer-bottom{font-size:var(--type-caption);line-height:18px;letter-spacing:0}
@media(min-width:761px) and (max-width:1150px){.site-header .header-inner{gap:12px}.site-header .page-tabs{gap:0}.site-header .page-tabs a{padding-inline:9px}.site-header .brand{gap:10px}.site-header .brand .zhilian-logo{width:34px;height:40px}.site-header .brand .zhilian-name{font-size:18px}}
@media(max-width:760px){
 .site-header .brand,.site-menu .brand{gap:10px;min-height:44px}
 .site-header .brand .zhilian-logo,.site-menu .brand .zhilian-logo{width:32px;height:38px}
 .site-header .brand .zhilian-name,.site-menu .brand .zhilian-name{font-size:18px;line-height:26px;letter-spacing:.03em}
 .site-shell #main h1{font-size:24px;line-height:32px}
 .site-shell #main :is(.home-hero,.svc-top,.svc-hero) h1{font-size:32px;line-height:40px}
 .site-shell #main :is(.fde-btn,.fde-ghost,.button){font-size:16px;line-height:24px}
 .site-shell #main :is(small,time,.news-label,.news-clock,.news-category){font-size:14px;line-height:20px}
 .site-footer .footer-bottom{font-size:14px;line-height:20px}
}

/* Use the existing menu when the full navigation no longer fits. */
@media(min-width:761px) and (max-width:1100px){
 .site-header .header-inner,.case-page .site-header .header-inner{height:64px;gap:12px}
 .site-header .page-tabs,.site-header .header-cta{display:none}
 .site-header .brand{padding:0 2px;border:0;background:none;box-shadow:none;transform:none}
 .site-header .brand-name{font-size:20px}
 .site-header .brand-tag{display:inline-block;padding-left:10px;font-size:12.5px;letter-spacing:.1em}
 .menu-open{display:grid;place-content:center;gap:4px;flex:none;width:42px;height:42px;border:1px solid #2e2e2e;border-radius:13px;background:#161616;cursor:pointer}
 .menu-open i{display:block;width:17px;height:1.6px;border-radius:2px;background:#e6e6e6}
 .menu-open:active{background:#222}
 .site-menu:not([hidden]){display:flex;flex-direction:column;position:fixed;inset:0;z-index:90;padding:calc(10px + env(safe-area-inset-top)) 20px calc(22px + env(safe-area-inset-bottom));background:#0d0d0df5;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);animation:menu-in .28s cubic-bezier(.2,.8,.2,1)}
 .site-menu-top{display:flex;align-items:center;justify-content:space-between;height:64px;border-bottom:1px solid #1f1f1f}
 .menu-close{display:grid;place-items:center;width:42px;height:42px;border:1px solid #2e2e2e;border-radius:13px;background:#161616;color:#e6e6e6;font-size:18px}
 .site-menu-links{display:flex;flex-direction:column;margin-top:8px}
 .site-menu-links a{display:flex;align-items:center;justify-content:space-between;padding:21px 4px;border-bottom:1px solid #1c1c1c;font-size:23px;font-weight:650;letter-spacing:.01em;color:#ececec;animation:menu-item .4s cubic-bezier(.2,.8,.2,1) both}
 .site-menu-links a:nth-child(2){animation-delay:.04s}.site-menu-links a:nth-child(3){animation-delay:.08s}.site-menu-links a:nth-child(4){animation-delay:.12s}
 .site-menu-links a>span:last-child{font-size:20px;color:#555}
 .site-menu-links a[aria-current] span:first-child{background:var(--fde-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
 .site-menu-links a[aria-current] span:last-child{color:var(--fde-c)}
 .site-menu-book{margin-top:auto;width:100%;min-height:56px}
 .menu-shown .fde-bar{display:none}
 html{scroll-padding-top:76px}
 .news-dayhead{top:64px}
}

@media(min-width:761px) and (max-width:1100px){.site-header .language-switch{margin-left:auto}.site-header .brand .zhilian-logo{width:34px;height:40px}}

/* Cross-page typography and small-screen reading refinements. */
.site-shell #main :is(.fde-pill,.industry-eyebrow,.industry-disclosure,.svc-label,.career-position,.cases-hint,.cases-roles li,.case-index,.fde-kicker b,.fde-bar-row span,.fde-scene-copy>span,.career-index>span,.contact-card-top>span:last-child,.kb-mobile-item>span,.news-pill,.news-also,.news-heat,.news-dayhead em,.news-fresh,.news-strip header a){font-size:var(--type-control);line-height:20px;letter-spacing:0}
.site-shell #main form[data-lead-form] label>span{font-size:var(--type-control);line-height:20px}
.site-shell #main :is(.svc-ba i,.svc-list li>span,.fde-qa h3>span){font-size:var(--type-control);line-height:20px}
.site-shell #main :is(.guide-card,.news-top) h2{font-size:var(--type-card);line-height:28px}
.site-shell #main :is(.guide-section,.industry-section) :is(p,li){line-height:28px}
.site-shell #main :is(.guide-card,.industry-steps,.case-card-copy,.news-card-body) p{line-height:26px}
.site-shell #main :is(h1,h2,h3,h4,p,li,.career-position,.industry-crumb,.industry-eyebrow){overflow-wrap:anywhere}
.site-shell #main :is(.fde-fine,.news-fresh,.news-note,.news-orig-title,.news-src-line){color:#ACACB5}
.site-shell #main .demo-window-bar>span{font-size:var(--type-control);line-height:20px}
.site-shell #main :is(.guide-cards,.industry-steps,.case-grid)>*{min-width:0}
.site-shell #main :is(.case-title,.career-heading,.education-note>div){min-width:0}
.site-shell #main .industry-crumb{flex-wrap:wrap;gap:6px 12px;line-height:20px}
@media(max-width:760px){
 .site-shell #main :is(.guide-card,.case-card-copy,.news-card-body){padding:20px}
 .site-shell #main :is(.guide-cards,.case-grid,.industry-steps){gap:16px}
 .site-shell #main :is(.guide-heading,.industry-hero) h1{line-height:34px}
 .site-shell #main :is(.guide-card,.industry-steps,.case-card-copy) :is(h2,h3){margin-bottom:12px}
 .site-shell #main :is(.guide-section,.industry-section){scroll-margin-top:88px}
 .site-shell #main .guide-section{padding-top:32px}
 .site-shell #main .industry-section{margin-block:40px}
 .site-shell #main .industry-next{padding:20px}
 .site-shell #main .industry-section-head{gap:12px;align-items:baseline}
 .site-shell #main .industry-section-head>span{flex:none}
 .site-shell #main :is(.industry-actions,.svc-next-actions){gap:12px}
 .site-shell #main :is(.industry-primary,.industry-related a){font-size:16px;line-height:24px;min-height:44px}
 .site-shell #main .industry-related a{padding:12px 16px}
 .site-shell #main .industry-table td::before{font-size:14px;line-height:20px}
 .site-shell #main .education-note{grid-template-columns:minmax(0,1fr);gap:8px;padding:20px}
 .site-shell #main .education-note>div{display:flex;flex-direction:column;align-items:flex-start;gap:4px}
 .site-shell #main .education-note time{grid-column:1;white-space:normal}
 .site-shell #main .education-note :is(strong,.small-label){font-size:14px;line-height:20px}
 .site-shell #main .career-resume{padding:16px 12px}
 .site-shell #main .career-resume p{overflow-wrap:anywhere;line-height:28px}
 .site-shell #main .career-position{white-space:normal}
 .site-shell #main .demo-window-bar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:12px}
 .site-shell #main .demo-window-bar>span{grid-column:1/-1;overflow:visible;white-space:normal;text-align:left;overflow-wrap:anywhere}
 .site-shell #main .demo-window-bar .demo-action{display:flex;align-items:center;justify-content:center;min-width:0;min-height:44px;padding:8px;white-space:normal;text-align:center;line-height:20px}
 .site-shell #main .case-title-row{align-items:flex-start;gap:14px}
 .site-shell #main .case-title{flex:1 1 100%}
 .site-shell #main .case-title p{margin-top:8px;line-height:26px}
 .site-shell #main .demo-caption{line-height:22px}
 .site-shell #main .news-strip li{align-items:start;grid-template-columns:22px minmax(0,1fr) auto}
 .site-shell #main .news-strip li>a{white-space:normal;text-overflow:clip;font-size:16px;line-height:24px;overflow-wrap:anywhere}
 .site-shell #main .news-strip .news-heat{padding-top:2px}
 .site-shell #main .news-card h3{font-size:20px;line-height:28px}
 .site-shell #main .news-card-body{margin-bottom:16px}
 .site-shell #main .news-meta{gap:8px}
 .site-shell #main .news-fresh{flex-wrap:wrap;align-items:baseline}
 .site-shell #main .news-dayhead{flex-wrap:wrap;gap:6px 12px}
 .site-shell #main .news-dayhead h2{min-width:0}
 .site-shell #main .kb-mobile-item{padding:16px;gap:8px 12px;grid-template-columns:minmax(0,1fr) auto}
 .site-shell #main .kb-mobile-item small{line-height:22px}
 .site-footer .footer-identity>p{font-size:16px;line-height:26px}
 .site-footer .footer-explore>.small-label{font-size:14px;line-height:20px}
}
/* Directory pages use the same title, card and reading rhythm. */
.site-shell #main .catalog-directory>h1{margin:16px 0 12px}
.site-shell #main .catalog-directory>p{line-height:28px}
.site-shell #main .catalog-directory>nav{margin-top:24px;gap:12px 24px}
.site-shell #main .catalog-directory>nav a{font-size:14px;line-height:20px;min-height:32px;display:inline-flex;align-items:center}
.site-shell #main .catalog-directory li>a{display:inline-block;font-size:20px;line-height:28px;font-weight:600}
.site-shell #main .catalog-directory li>p{font-size:14px;line-height:20px;margin-top:12px}
.site-shell #main :is(.core-content,.catalog-related) li{font-size:16px;line-height:28px}
@media(max-width:760px){.site-shell #main .catalog-directory{padding:32px 20px 48px}.site-shell #main .catalog-directory h2{margin:32px 0 16px}.site-shell #main .catalog-directory ul{margin:0;gap:16px}.site-shell #main .catalog-directory li{padding:20px}.site-shell #main .catalog-directory>nav a{min-height:44px}}
.site-shell #main :is(.fde-discovery-links a,.fde-discovery-label,.fde-scene-copy em){font-size:14px;line-height:22px}
.site-shell #main .fde-discovery-links{gap:12px 20px;padding-top:24px}
.site-shell #main :is(.fde-discovery-label,.fde-discovery-links a){color:#ACACB5}
.fde-bar a>span{font-size:14px;line-height:20px}
@media(min-width:761px) and (max-width:1100px){
 .site-shell #main .demo-window-bar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:12px}
 .site-shell #main .demo-window-bar .window-traffic{display:none}
 .site-shell #main .demo-window-bar>span{grid-column:1/-1;overflow:visible;white-space:normal;text-align:left;overflow-wrap:anywhere}
 .site-shell #main .demo-window-bar .demo-action{display:flex;align-items:center;justify-content:center;min-width:0;min-height:44px;padding:8px;white-space:normal;line-height:20px}
}

/* Transparent brand lockup with a balanced mark-to-wordmark ratio. */
.site-header .brand,.site-menu .brand{gap:10px;background:transparent;border:0;box-shadow:none;align-items:center}
.site-header .brand .zhilian-logo,.site-menu .brand .zhilian-logo{width:32px;height:38px;object-fit:contain;background:transparent}
.site-header .brand .zhilian-name,.site-menu .brand .zhilian-name{font-size:20px;line-height:28px;font-weight:600;letter-spacing:.04em}
@media(max-width:760px){.site-header .brand .zhilian-logo,.site-menu .brand .zhilian-logo{width:29px;height:34px}.site-header .brand .zhilian-name,.site-menu .brand .zhilian-name{font-size:18px;line-height:26px}}

/* Shared bilingual wordmark, matching v8io. */
.site-header .brand .zhilian-logo,.site-menu .brand .zhilian-logo{width:34px;height:40px}
.site-header .brand .zhilian-name,.site-menu .brand .zhilian-name{display:flex;flex-direction:column;gap:5px;font-size:18px;font-weight:600;line-height:18px;letter-spacing:.04em}
.site-header .brand .zhilian-name small,.site-menu .brand .zhilian-name small{display:block;font-family:Inter,"PingFang SC",system-ui,sans-serif;font-size:10px;line-height:10px;font-weight:400;letter-spacing:.12em;color:#b8b8b8;-webkit-text-fill-color:#b8b8b8}

/* Keep navigation anchored while page content and language controls change. */
@media(min-width:1101px){
 .site-header .header-inner{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}
 .site-header .header-inner>.brand{grid-column:1;justify-self:start}
 .site-header .header-inner>.page-tabs{grid-column:2;justify-self:center;flex:none}
 .site-header .header-inner>.header-end{grid-column:3;justify-self:end}
}

/* The language control belongs beside the collapsed navigation button. */
@media(max-width:1100px){
 .site-header .header-inner{display:flex;justify-content:flex-start}
 .site-header .header-inner>.header-end{margin-left:auto}
 .site-header .header-inner>.menu-open{margin-left:0}
}