:root{--ink:#120a1f;--deep:#1d1033;--plum:#2a1648;--violet:#6d3fc0;--biz:#d0569b;--biz-soft:#f3c6dd;--paper:#f6f1ec;--paper2:#efe7e0;--text:#2a1c38;--muted:#6f6278;--line:rgba(255,255,255,.14);--serif:"Noto Serif SC","Source Han Serif SC","Songti SC",serif;--sans:"PingFang SC","HarmonyOS Sans SC","Microsoft YaHei",system-ui,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:#fff;font-family:var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.wrap{width:min(1240px,100% - 64px);margin:0 auto}
.serif{font-family:var(--serif)}
.eyebrow{font-size:13px;letter-spacing:.24em;color:var(--biz-soft);display:flex;align-items:center;gap:12px}
.eyebrow::before{content:"";width:28px;height:1px;background:var(--biz)}
.rv{opacity:0;transform:translateY(28px);transition:opacity 1s cubic-bezier(.2,.7,.2,1),transform 1s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;transform:none}
.rv.d1{transition-delay:.12s}.rv.d2{transition-delay:.24s}.rv.d3{transition-delay:.36s}

/* header */
.hd{position:fixed;inset:0 0 auto;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:18px 32px;transition:background .4s,backdrop-filter .4s}
.hd.solid{background:rgba(18,10,31,.72);backdrop-filter:blur(14px)}
.hd img{height:28px;filter:brightness(0) invert(1)}
.hd nav{display:flex;gap:26px;font-size:14px;color:rgba(255,255,255,.78)}
.hd nav a.on{color:#fff;border-bottom:1px solid var(--biz);padding-bottom:4px}
.btn{display:inline-flex;align-items:center;gap:10px;height:48px;padding:0 26px;border-radius:999px;font-size:15px;font-weight:600;letter-spacing:.04em;transition:transform .3s,background .3s}
.btn.pri{background:#fff;color:var(--ink)}.btn.pri:hover{transform:translateY(-2px)}
.btn.ghost{border:1px solid rgba(255,255,255,.4);color:#fff}.btn.ghost:hover{background:rgba(255,255,255,.08)}

/* 1 hero */
.hero{position:relative;height:100svh;min-height:640px;overflow:hidden;display:flex;align-items:flex-end}
.hero .bg{position:absolute;inset:0;background:var(--img) center/cover;animation:kb 22s ease-out both}
@keyframes kb{from{transform:scale(1.12)}to{transform:scale(1)}}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(14,7,26,.86) 0%,rgba(14,7,26,.45) 45%,rgba(14,7,26,0) 75%),linear-gradient(0deg,rgba(14,7,26,.9) 0%,rgba(14,7,26,0) 40%)}
.hero .wrap{position:relative;z-index:2;padding-bottom:clamp(64px,12vh,120px)}
.hero h1{font-family:var(--serif);font-weight:600;font-size:clamp(46px,7.2vw,112px);line-height:1.08;margin:22px 0 26px;letter-spacing:.02em}
.hero h1 em{font-style:normal;color:var(--biz-soft)}
.hero p{max-width:560px;font-size:clamp(16px,1.3vw,19px);line-height:1.85;color:rgba(255,255,255,.82);margin:0 0 36px}
.hero .acts{display:flex;gap:14px;flex-wrap:wrap}
.scrollhint{position:absolute;right:32px;bottom:40px;z-index:2;writing-mode:vertical-rl;font-size:11px;letter-spacing:.4em;color:rgba(255,255,255,.55)}

/* 2 pain */
.pain{position:relative;display:grid;grid-template-columns:1.05fr 1fr;min-height:100vh;background:var(--ink)}
.pain .pic{position:sticky;top:0;height:100vh;background:var(--img) center/cover}
.pain .pic::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(18,10,31,0) 55%,var(--ink))}
.pain .big{position:absolute;left:clamp(28px,4vw,64px);bottom:clamp(40px,8vh,90px);z-index:2}
.pain .big b{display:block;font-family:var(--serif);font-weight:600;font-size:clamp(110px,15vw,230px);line-height:.9;color:#fff;letter-spacing:-.02em}
.pain .big b small{font-size:.32em;margin-left:.1em;color:var(--biz-soft)}
.pain .big span{display:block;max-width:360px;margin-top:14px;font-size:14px;line-height:1.8;color:rgba(255,255,255,.75)}
.pain .txt{padding:clamp(90px,16vh,160px) clamp(28px,5vw,88px)}
.pain h2,.sec h2{font-family:var(--serif);font-weight:600;font-size:clamp(34px,4vw,60px);line-height:1.2;margin:20px 0 56px}
.pain ol{list-style:none;margin:0;padding:0;counter-reset:p}
.pain li{counter-increment:p;padding:30px 0;border-top:1px solid var(--line);display:grid;grid-template-columns:64px 1fr;gap:8px}
.pain li::before{content:"0" counter(p);font-family:var(--serif);font-size:15px;color:var(--biz);padding-top:6px}
.pain li h3{margin:0 0 10px;font-size:22px;font-weight:600}
.pain li p{margin:0;color:rgba(255,255,255,.66);line-height:1.85;font-size:15px}
.pain .src{margin-top:28px;font-size:12px;color:rgba(255,255,255,.4)}

/* light sections */
.sec{padding:clamp(100px,16vh,170px) 0}
.light{background:var(--paper);color:var(--text)}
.light .eyebrow{color:var(--biz)}
.lede{max-width:620px;font-size:17px;line-height:1.9;color:var(--muted);margin:-28px 0 64px}

/* 3 how */
.how .cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.how .card{position:relative;aspect-ratio:3/4.2;border-radius:6px;overflow:hidden;color:#fff;isolation:isolate}
.how .card i{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform 1.4s cubic-bezier(.2,.7,.2,1);z-index:-2}
.how .card:hover i{transform:scale(1.06)}
.how .card::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(14,7,26,.92) 0%,rgba(14,7,26,.2) 55%,rgba(14,7,26,0) 100%)}
.how .card .n{position:absolute;top:26px;left:28px;font-family:var(--serif);font-size:14px;letter-spacing:.2em;color:rgba(255,255,255,.75)}
.how .card .b{position:absolute;left:28px;right:28px;bottom:30px}
.how .card h3{font-family:var(--serif);font-size:clamp(22px,1.8vw,28px);font-weight:600;line-height:1.35;margin:0 0 14px}
.how .card p{margin:0;font-size:14.5px;line-height:1.85;color:rgba(255,255,255,.8)}
.why{margin-top:22px;position:relative;border-radius:6px;overflow:hidden;min-height:340px;display:flex;align-items:center;color:#fff;background:var(--img) center 60%/cover}
.why::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(14,7,26,.9),rgba(14,7,26,.5) 55%,rgba(14,7,26,.1))}
.why div{position:relative;padding:56px clamp(28px,5vw,72px);max-width:760px}
.why small{font-size:13px;letter-spacing:.24em;color:var(--biz-soft)}
.why p{font-family:var(--serif);font-size:clamp(22px,2.2vw,32px);line-height:1.6;margin:16px 0 0}

/* 4 deliver */
.deliver{background:var(--deep)}
.acc{display:flex;gap:10px;height:clamp(420px,62vh,600px)}
.acc .p{position:relative;flex:1;border-radius:6px;overflow:hidden;transition:flex 1s cubic-bezier(.2,.7,.2,1);cursor:pointer;isolation:isolate}
.acc .p.on{flex:3.4}
.acc .p i{position:absolute;inset:0;background-size:cover;background-position:center;z-index:-2;transition:transform 1.2s}
.acc .p::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(14,7,26,.95),rgba(14,7,26,.25) 60%,rgba(14,7,26,.15))}
.acc .p .k{position:absolute;left:24px;bottom:28px;font-family:var(--serif);font-size:26px;font-weight:600;writing-mode:vertical-rl;letter-spacing:.2em;transition:opacity .4s}
.acc .p .d{position:absolute;left:32px;right:32px;bottom:32px;opacity:0;transform:translateY(16px);transition:.6s .2s}
.acc .p.on .k{opacity:0}.acc .p.on .d{opacity:1;transform:none}
.acc .p .d h3{font-family:var(--serif);font-size:34px;margin:0 0 14px;font-weight:600}
.acc .p .d p{margin:0;font-size:15.5px;line-height:1.9;color:rgba(255,255,255,.82);max-width:520px}
.note{margin-top:22px;font-size:12px;color:rgba(255,255,255,.4)}

/* 5 business */
.biz{background:linear-gradient(180deg,var(--plum),var(--ink))}
.tabs{display:flex;gap:6px;padding:6px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid var(--line);width:max-content;max-width:100%;overflow-x:auto;margin-bottom:48px}
.tabs button{all:unset;cursor:pointer;padding:12px 24px;border-radius:999px;font-size:15px;color:rgba(255,255,255,.7);white-space:nowrap;transition:.3s}
.tabs button[aria-selected=true]{background:#fff;color:var(--ink);font-weight:600}
.bp{display:none;grid-template-columns:.9fr 1.5fr;gap:clamp(28px,4vw,64px);align-items:start}
.bp.on{display:grid;animation:fade .7s both}
@keyframes fade{from{opacity:0;transform:translateY(14px)}}
.bp .meta small{font-size:13px;letter-spacing:.2em;color:var(--biz-soft)}
.bp .meta h3{font-family:var(--serif);font-size:clamp(26px,2.4vw,36px);line-height:1.4;margin:14px 0 26px;font-weight:600}
.bp .meta p{color:rgba(255,255,255,.7);line-height:1.9;font-size:15px;margin:0}
.bp .meta p b{color:#fff;font-weight:600}
.cases{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.case{position:relative;aspect-ratio:4/3;border-radius:6px;overflow:hidden;isolation:isolate}
.case:first-child{grid-column:span 2;aspect-ratio:16/8}
.case img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform 1.2s}
.case:hover img{transform:scale(1.05)}
.case::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(14,7,26,.92),rgba(14,7,26,0) 60%)}
.case .m{position:absolute;left:24px;right:24px;bottom:22px}
.case .m b{display:block;font-family:var(--serif);font-size:clamp(28px,3vw,48px);font-weight:600;line-height:1.1}
.case:not(:first-child) .m b{font-size:clamp(22px,2vw,30px)}
.case .m span{display:block;margin-top:8px;font-size:13.5px;color:rgba(255,255,255,.75)}
.case .tag{position:absolute;top:16px;left:16px;font-size:11px;padding:5px 10px;border-radius:99px;background:rgba(14,7,26,.55);backdrop-filter:blur(6px);color:rgba(255,255,255,.85)}

/* 6 works */
.works{background:var(--ink);padding-bottom:clamp(80px,12vh,130px)}
.strip{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 max(32px,calc((100% - 1240px)/2)) 12px;scrollbar-width:none}
.strip::-webkit-scrollbar{display:none}
.w{flex:0 0 clamp(240px,22vw,320px);aspect-ratio:9/13;border-radius:6px;overflow:hidden;position:relative;scroll-snap-align:start;isolation:isolate}
.w img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform 1.2s}
.w:hover img{transform:scale(1.05)}
.w::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(14,7,26,.9),rgba(14,7,26,0) 55%)}
.w p{position:absolute;left:20px;right:20px;bottom:20px;margin:0;font-family:var(--serif);font-size:19px;line-height:1.45;font-weight:600}
.w .play{position:absolute;top:16px;right:16px;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.18);backdrop-filter:blur(8px);display:grid;place-items:center}
.w .play::before{content:"";border-left:10px solid #fff;border-top:6px solid transparent;border-bottom:6px solid transparent;margin-left:3px}
.more{display:inline-flex;margin-top:36px;font-size:14px;color:rgba(255,255,255,.75);border-bottom:1px solid rgba(255,255,255,.3);padding-bottom:4px}

/* 7 team */
.team{position:relative;min-height:100vh;display:flex;align-items:center;overflow:hidden}
.team .bg{position:absolute;inset:-6% 0;background:var(--img) center/cover}
.team::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(14,7,26,.92) 0%,rgba(14,7,26,.7) 50%,rgba(14,7,26,.2))}
.team .wrap{position:relative;z-index:2}
.people{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4vw,72px);max-width:960px}
.person h3{font-family:var(--serif);font-size:30px;margin:0 0 6px;font-weight:600}
.person small{display:block;font-size:13px;letter-spacing:.16em;color:var(--biz-soft);margin-bottom:20px}
.person p{margin:0;color:rgba(255,255,255,.78);line-height:1.95;font-size:15px}
.team blockquote{margin:64px 0 0;max-width:760px;font-family:var(--serif);font-size:clamp(22px,2.2vw,30px);line-height:1.6;padding-left:24px;border-left:2px solid var(--biz)}
.team .fine{margin-top:22px;font-size:12px;color:rgba(255,255,255,.45)}

/* 8 start */
.start .band{position:relative;border-radius:6px;overflow:hidden;background:var(--img) center 40%/cover;color:#fff;padding:clamp(48px,8vh,90px) clamp(24px,4vw,56px)}
.start .band::before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(14,7,26,.88),rgba(14,7,26,.35))}
.steps{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:clamp(160px,26vh,260px)}
.steps div{border-top:1px solid rgba(255,255,255,.4);padding-top:22px}
.steps b{display:block;font-family:var(--serif);font-size:44px;font-weight:600;line-height:1;color:var(--biz-soft);margin-bottom:16px}
.steps p{margin:0;font-size:15.5px;line-height:1.8;color:rgba(255,255,255,.88)}
.start .after{display:flex;justify-content:space-between;align-items:center;gap:32px;margin-top:40px;flex-wrap:wrap}
.start .after p{max-width:640px;margin:0;font-size:16px;line-height:1.9;color:var(--muted)}
.btn.dark{background:var(--ink);color:#fff}

/* 9 faq */
.faq{background:var(--paper2);color:var(--text)}
.faq .grid{display:grid;grid-template-columns:.8fr 1.6fr;gap:clamp(32px,6vw,96px)}
.faq h2{margin-top:20px}
details{border-top:1px solid rgba(42,28,56,.14);padding:26px 0}
details:last-child{border-bottom:1px solid rgba(42,28,56,.14)}
summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:24px;font-family:var(--serif);font-size:21px;font-weight:600}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-family:var(--sans);font-weight:300;font-size:26px;line-height:1;color:var(--biz);transition:transform .3s}
details[open] summary::after{transform:rotate(45deg)}
details p{margin:16px 0 0;max-width:640px;color:var(--muted);line-height:1.95;font-size:15.5px}

/* 10 end */
.end{position:relative;height:100svh;min-height:560px;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden}
.end .bg{position:absolute;inset:0;background:var(--img) center/cover}
.end::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(14,7,26,.35),rgba(14,7,26,.85))}
.end .c{position:relative;z-index:2}
.end h2{font-family:var(--serif);font-size:clamp(40px,6vw,92px);line-height:1.2;margin:0 0 40px;font-weight:600}
.end h2 em{font-style:normal;color:var(--biz-soft)}
footer{padding:40px 32px;color:rgba(255,255,255,.4);font-size:12px;text-align:center;background:var(--ink)}

/* ===== 明亮版（11-01 用户：不要这么暗沉） ===== */
:root{--ink:#2a1747;--lav:#f4effb;--lav2:#ebe2f7}
body{background:var(--paper)}
.hero .bg,.team .bg,.end .bg,.pain .pic,.how .card i,.why,.start .band{filter:brightness(1.14) saturate(1.12)}
.hero::after{background:linear-gradient(90deg,rgba(38,18,66,.62) 0%,rgba(38,18,66,.22) 42%,rgba(38,18,66,0) 64%),linear-gradient(0deg,rgba(38,18,66,.45) 0%,rgba(38,18,66,0) 32%)}
/* 痛点：浅底 */
.pain{background:var(--paper);color:var(--text)}
.pain .pic::after{background:linear-gradient(90deg,rgba(246,241,236,0) 70%,var(--paper)),linear-gradient(0deg,rgba(38,18,66,.55),rgba(38,18,66,0) 45%)}
.pain .eyebrow{color:var(--biz)}
.pain li{border-top-color:rgba(42,28,56,.12)}
.pain li p{color:var(--muted)}
.pain .src{color:rgba(42,28,56,.45)}
/* 交付：浅薰衣草 */
.deliver{background:var(--lav);color:var(--text)}
.deliver .eyebrow{color:var(--biz)}
.deliver .note{color:rgba(42,28,56,.45)}
.acc .p{color:#fff}
.acc .p::after{background:linear-gradient(0deg,rgba(38,18,66,.82),rgba(38,18,66,.1) 55%,rgba(38,18,66,0))}
/* 按生意：鲜亮渐变做全页重点 */
.biz{background:linear-gradient(125deg,#6a3fc8 0%,#9a46b8 55%,#d0569b 100%)}
.biz .eyebrow{color:#fff}.biz .eyebrow::before{background:#fff}
.biz .meta small{color:#ffe1ef}
.biz .note{color:rgba(255,255,255,.7)}
.tabs{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.3)}
.tabs button{color:rgba(255,255,255,.9)}
.case::after{background:linear-gradient(0deg,rgba(38,18,66,.78),rgba(38,18,66,0) 55%)}
/* 作品：浅底 */
.works{background:var(--paper);color:var(--text)}
.works .eyebrow{color:var(--biz)}
.w{color:#fff;box-shadow:0 18px 40px -22px rgba(60,30,100,.45)}
.w::after{background:linear-gradient(0deg,rgba(38,18,66,.78),rgba(38,18,66,0) 50%)}
.more{color:var(--text);border-bottom-color:rgba(42,28,56,.3)}
/* 团队、结尾：减轻压暗 */
.team::before{background:linear-gradient(90deg,rgba(38,18,66,.78) 0%,rgba(38,18,66,.45) 48%,rgba(38,18,66,0) 80%)}
.end::after{background:radial-gradient(ellipse at center,rgba(38,18,66,.18),rgba(38,18,66,.55))}
.why::before{background:linear-gradient(90deg,rgba(38,18,66,.72),rgba(38,18,66,.25) 60%,rgba(38,18,66,0))}
.start .band::before{background:linear-gradient(0deg,rgba(38,18,66,.72),rgba(38,18,66,.05) 70%)}
.how .card::after{background:linear-gradient(0deg,rgba(38,18,66,.82) 0%,rgba(38,18,66,.1) 50%,rgba(38,18,66,0))}
footer{background:var(--paper);color:var(--muted)}
.hd.solid{background:rgba(42,23,71,.55)}

/* 字体规则：衬线只用于短标题和大数字；整句、长段、问答用黑体 */
.why p,.team blockquote,summary,.person h3,.bp .meta h3{font-family:var(--sans);font-weight:600;letter-spacing:.01em}
.why p{font-size:clamp(19px,1.7vw,24px);line-height:1.75}
.team blockquote{font-size:clamp(18px,1.6vw,22px);line-height:1.8}
summary{font-size:18px}
.person h3{font-size:24px}
.why::before{background:linear-gradient(90deg,rgba(38,18,66,.82),rgba(38,18,66,.5) 60%,rgba(38,18,66,.15))}

/* 导航：任何底图上都看得清 */
.hd::before{content:"";position:absolute;inset:0 0 -40px;z-index:-1;background:linear-gradient(180deg,rgba(30,14,54,.62),rgba(30,14,54,0));pointer-events:none;transition:opacity .4s}
.hd.solid::before{opacity:0}
.hd.solid{background:rgba(36,18,62,.72);backdrop-filter:blur(16px) saturate(1.3)}
.hd nav a{text-shadow:0 1px 8px rgba(20,8,40,.45)}

/* 子页主题色：同明度同饱和，一页一个色 */
/* 11-01 用户定：产品=蓝；流量=紫（比首页品牌紫更亮，核心业务）；出海=地球色（全站统一） */
body[data-theme=social]{--biz:#8a4dff;--biz-soft:#dccbff;--grad:linear-gradient(125deg,#5a2ee8 0%,#8a4dff 50%,#c45cf0 100%)}
body[data-theme=brand]{--biz:#d6509a;--biz-soft:#ffcfe6;--grad:linear-gradient(125deg,#9c3fae 0%,#d6509a 55%,#f07a8a 100%)}
body[data-theme=geo]{--biz:#2f9e72;--biz-soft:#c8eedb;--grad:linear-gradient(125deg,#2a7a62 0%,#2f9e72 55%,#5cbf8a 100%)}
body[data-theme=ai]{--biz:#2f6fe8;--biz-soft:#c8dbff;--grad:linear-gradient(125deg,#2a3fc0 0%,#2f6fe8 55%,#3fa0f0 100%)}
body[data-theme=works]{--biz:#ee6b47;--biz-soft:#ffd6c8;--grad:linear-gradient(125deg,#c8456a 0%,#ee6b47 55%,#f59a4a 100%)}
body[data-theme=cases]{--biz:#d99a2b;--biz-soft:#ffe3b0;--grad:linear-gradient(125deg,#b8642e 0%,#d99a2b 55%,#e8c050 100%)}
body[data-theme=about]{--biz:#6d3fc0;--biz-soft:#e2d4ff;--grad:linear-gradient(125deg,#4a2a96 0%,#6d3fc0 55%,#9a6ad8 100%)}
/* 出海：地球色，任何页面一致 */
:root{--globe:#60a4ac;--globe-grad:linear-gradient(120deg,#3f8a93 0%,#60a4ac 55%,#8cc7cc 100%)}
.globe{color:#fff;background:var(--globe-grad)!important}
.globe-t{background:var(--globe-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.acc .p.globe-p::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(63,138,147,.6),rgba(96,164,172,.15) 60%,transparent);mix-blend-mode:normal}
.acc .p.globe-p .d h3,.acc .p.globe-p .k{color:#d4eef0}
.biz{background:var(--grad)}
.hd nav a.on{border-bottom-color:var(--biz-soft)}

/* 按生意：上下结构，案例铺满整行 */
.bp,.bp.on{grid-template-columns:1fr}
.bp.on{display:grid;gap:36px}
.bp .meta{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap;padding-bottom:28px;border-bottom:1px solid rgba(255,255,255,.28)}
.bp .meta small{flex-basis:100%;margin-bottom:-18px}
.bp .meta h3{font-size:clamp(30px,3.4vw,52px);margin:12px 0 0}
.bp .meta p{display:flex;flex-wrap:wrap;gap:8px;align-items:center;max-width:560px}
.bp .meta p b{margin-right:4px}
.bp .meta p span{padding:7px 14px;border-radius:99px;background:rgba(255,255,255,.16);font-size:14px;color:#fff}
.cases{grid-template-columns:repeat(var(--n,3),1fr)}
.case,.case:first-child{grid-column:auto;aspect-ratio:4/5}
.case .m b,.case:not(:first-child) .m b{font-size:clamp(24px,2.2vw,34px)}

@media (max-width:900px){
 .cases{grid-template-columns:1fr}
 .case,.case:first-child{aspect-ratio:4/3}
 .pain .pic::after{background:linear-gradient(0deg,var(--paper),rgba(246,241,236,0) 40%)}
 .why::before{background:rgba(38,18,66,.6)}
 .wrap{width:calc(100% - 32px)}
 .hd{padding:14px 16px}.hd nav{display:none}
 .hero h1{font-size:clamp(40px,12vw,64px)}
 .scrollhint{display:none}
 .pain{grid-template-columns:1fr}
 .pain .pic{position:relative;height:72vh}
 .pain .txt{padding:56px 16px 90px}
 .how .cards{grid-template-columns:1fr}
 .how .card{aspect-ratio:4/4.4}
 .acc{flex-direction:column;height:auto}
 .acc .p{flex:none;height:84px}.acc .p.on{height:400px}
 .acc .p .k{writing-mode:horizontal-tb;bottom:auto;top:28px;font-size:22px}
 .bp{grid-template-columns:1fr}
 .cases{grid-template-columns:1fr}.case:first-child{grid-column:auto;aspect-ratio:4/3}
 .people{grid-template-columns:1fr}
 .steps{grid-template-columns:1fr 1fr;margin-top:120px}
 .faq .grid{grid-template-columns:1fr}
 .tabs{width:100%}
}
@media (prefers-reduced-motion:reduce){.hero .bg{animation:none}.rv{opacity:1;transform:none;transition:none}}

/* 作品：分类 + 轮播 */
.works .whead{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:36px}
.works .whead h2{margin:20px 0 0!important}
.wctl{display:flex;align-items:center;gap:14px}
.wtabs{display:flex;gap:4px;padding:4px;border-radius:999px;background:rgba(42,28,56,.06)}
.wtabs button{all:unset;cursor:pointer;padding:10px 20px;border-radius:999px;font-size:14.5px;color:var(--muted);transition:.3s}
.wtabs button[aria-selected=true]{background:var(--biz);color:#fff;font-weight:600}
.warr{display:flex;gap:8px}
.warr button{all:unset;cursor:pointer;width:44px;height:44px;border-radius:50%;border:1px solid rgba(42,28,56,.18);display:grid;place-items:center;font-size:18px;color:var(--text);transition:.3s}
.warr button:hover{background:var(--biz);border-color:var(--biz);color:#fff}
.strip[hidden]{display:none}
.strip{scroll-behavior:smooth}
.w.g{aspect-ratio:4/5}
.w .cnt{position:absolute;top:16px;right:16px;font-size:12px;padding:5px 10px;border-radius:99px;background:rgba(255,255,255,.2);backdrop-filter:blur(8px)}
@media (max-width:900px){.works .whead{align-items:flex-start}.warr{display:none}}

/* 海外标签：地球色 */
.tabs button.globe-tab{color:#d4eef0}
.tabs button.globe-tab[aria-selected=true]{background:var(--globe-grad);color:#fff}
/* 四张原则卡 */
.how .cards.c4{grid-template-columns:repeat(4,1fr)}
.how .cards.c4 .card{aspect-ratio:3/4.6}
.how .cards.c4 .card h3{font-size:clamp(20px,1.5vw,24px)}
/* 痛点大字（无数字时） */
.pain .big b.word{font-size:clamp(64px,8vw,128px);line-height:1.05}
/* 三步 */
.steps.s3{grid-template-columns:repeat(3,1fr)}
@media (max-width:900px){.how .cards.c4{grid-template-columns:1fr 1fr}.steps.s3{grid-template-columns:1fr}}
@media (max-width:560px){.how .cards.c4{grid-template-columns:1fr}}
/* 案例少时改横版 */
.cases[style*="--n:2"] .case{aspect-ratio:16/10}
.cases[style*="--n:1"] .case{aspect-ratio:21/9}
@media (max-width:900px){.cases[style*="--n:1"] .case,.cases[style*="--n:2"] .case{aspect-ratio:4/3}}
/* 痛点大字：完整一句结论 */
.pain .big.stmt{right:clamp(28px,4vw,64px)}
.pain .big.stmt i{display:block;font-style:normal;font-size:14px;letter-spacing:.16em;color:rgba(255,255,255,.8);margin-bottom:14px}
.pain .big.stmt b{font-size:clamp(40px,4.4vw,70px);line-height:1.18;letter-spacing:.01em;max-width:620px}
.pain .big.stmt b em{font-style:normal;color:var(--biz-soft)}
.pain .big.stmt span{max-width:520px;font-size:13.5px}
.bp .meta small{letter-spacing:.06em;font-size:14px}
.bp .meta h3{font-family:var(--serif)!important}

/* 11-01 用户：『按你的生意看』配色不对 → 主题色浅底，深色字，主题色只做点缀 */
.biz{background:radial-gradient(ellipse 70% 60% at 85% 10%,color-mix(in srgb,var(--biz) 18%,transparent),transparent 70%),color-mix(in srgb,var(--biz) 7%,#f8f5f2)!important;color:var(--text)}
.biz .eyebrow{color:var(--biz)!important}.biz .eyebrow::before{background:var(--biz)!important}
.biz h2,.biz p{color:var(--text)!important}
.biz .lede-p{color:var(--muted)!important}
.biz .tabs{background:#fff;border-color:color-mix(in srgb,var(--biz) 22%,transparent);box-shadow:0 6px 24px -14px rgba(40,20,70,.35)}
.biz .tabs button{color:var(--muted)}
.biz .tabs button[aria-selected=true]{background:var(--biz);color:#fff}
.biz .tabs button.globe-tab{color:var(--globe)}
.biz .bp .meta{border-bottom-color:color-mix(in srgb,var(--biz) 20%,transparent)}
.biz .bp .meta small{color:var(--biz)!important}
.biz .bp .meta h3{color:var(--text)}
.biz .bp .meta p b{color:var(--text)}
.biz .bp .meta p span{background:#fff;color:var(--text);border:1px solid color-mix(in srgb,var(--biz) 20%,transparent)}
.biz .note{color:var(--muted)!important}
.biz .case{box-shadow:0 20px 44px -26px rgba(40,20,70,.55)}

/* ===== 11-02 案例：轮播 + 亮点 + 详情弹窗 ===== */
.biz .case,.biz .case *{color:#fff}
.cwrap{position:relative}
.cstrip{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;scroll-behavior:smooth;padding-bottom:6px}
.cstrip::-webkit-scrollbar{display:none}
.cstrip .case,.cstrip .case:first-child{all:unset;box-sizing:border-box;position:relative;flex:0 0 calc((100% - 32px)/3);aspect-ratio:4/5;border-radius:8px;overflow:hidden;isolation:isolate;cursor:pointer;scroll-snap-align:start;box-shadow:0 20px 44px -26px rgba(40,20,70,.55)}
.cstrip.few .case{flex-basis:calc((100% - 16px)/2);aspect-ratio:16/10}
.cstrip.one .case{flex-basis:100%;aspect-ratio:21/9}
.cstrip .case img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform 1.2s}
.cstrip .case:hover img{transform:scale(1.05)}
.cstrip .case::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(24,12,44,.92) 0%,rgba(24,12,44,.55) 38%,rgba(24,12,44,0) 68%)}
.cstrip .case .tag{position:absolute;top:16px;left:16px;font-size:12px;padding:6px 12px;border-radius:99px;background:rgba(20,10,36,.5);backdrop-filter:blur(8px)}
.cstrip .case .member{position:absolute;top:16px;right:16px;font-size:11px;padding:5px 10px;border-radius:99px;background:rgba(255,255,255,.18);backdrop-filter:blur(8px)}
.cstrip .case .m{position:absolute;left:24px;right:24px;bottom:24px}
.cstrip .case .m b{display:block;font-family:var(--serif);font-weight:600;font-size:clamp(26px,2.3vw,36px);line-height:1.15}
.cstrip .case .m .hl{display:block;margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.28);font-size:15px;line-height:1.6;color:rgba(255,255,255,.92)}
.cstrip .case .m .go{display:inline-block;margin-top:12px;font-size:13px;color:var(--biz-soft)}
.carr{display:flex;gap:8px;margin-left:auto}
.carr button{all:unset;cursor:pointer;width:42px;height:42px;border-radius:50%;background:#fff;border:1px solid color-mix(in srgb,var(--biz) 25%,transparent);display:grid;place-items:center;font-size:18px;color:var(--text);transition:.3s}
.carr button:hover{background:var(--biz);color:#fff}
.bp .meta{align-items:center}
@media (max-width:900px){.cstrip .case,.cstrip.few .case,.cstrip.one .case{flex-basis:82%;aspect-ratio:4/5}.carr{display:none}}

.cdlg{border:0;padding:0;border-radius:14px;width:min(880px,calc(100% - 32px));max-height:calc(100vh - 48px);overflow:auto;background:var(--paper);color:var(--text);box-shadow:0 40px 90px -30px rgba(20,8,40,.6)}
.cdlg::backdrop{background:rgba(20,10,36,.55);backdrop-filter:blur(4px)}
.cdlg .ci{position:relative;aspect-ratio:16/8;background-size:cover;background-position:center}
.cdlg .ci::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(24,12,44,.85),rgba(24,12,44,0) 60%)}
.cdlg .ci div{position:absolute;left:36px;right:36px;bottom:28px;z-index:1;color:#fff}
.cdlg .ci small{font-size:13px;letter-spacing:.12em;color:var(--biz-soft)}
.cdlg .ci h3{font-family:var(--serif);font-size:clamp(26px,3vw,40px);margin:8px 0 0;font-weight:600}
.cdlg .cb{padding:32px 36px 36px;display:grid;grid-template-columns:120px 1fr;gap:18px 24px}
.cdlg .cb dt{font-size:13px;letter-spacing:.14em;color:var(--biz);padding-top:3px}
.cdlg .cb dd{margin:0;font-size:16px;line-height:1.85}
.cdlg .cb dd.res{font-family:var(--serif);font-size:20px;font-weight:600}
.cdlg .cf{grid-column:1/-1;border-top:1px solid rgba(42,28,56,.12);padding-top:18px;font-size:12.5px;line-height:1.8;color:var(--muted)}
.cdlg .cf a{color:var(--biz);font-weight:600}
.cdlg .x{all:unset;cursor:pointer;position:absolute;top:14px;right:14px;z-index:2;width:40px;height:40px;border-radius:50%;background:rgba(20,10,36,.5);color:#fff;display:grid;place-items:center;font-size:20px}
@media (max-width:640px){.cdlg .cb{grid-template-columns:1fr;gap:6px;padding:24px}.cdlg .cb dd{margin-bottom:12px}}

/* 11-02 『按你的生意看』重排：左栏文字固定，右栏案例轮播 */
.biz h2{font-size:clamp(30px,3.2vw,48px)!important}
.biz .lede-p{margin-bottom:28px!important}
.biz .tabs{margin-bottom:40px}
.biz .bp.on{display:grid;grid-template-columns:minmax(260px,.85fr) 2.15fr;gap:clamp(28px,3.5vw,56px);align-items:start}
.biz .bp .meta{display:block;border:0;padding:0;position:sticky;top:110px}
.biz .bp .meta small{display:block;margin:0 0 16px;line-height:1.7}
.biz .bp .meta h3{font-size:clamp(24px,2.1vw,32px)!important;line-height:1.35;margin:0 0 22px}
.biz .bp .meta p{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 28px}
.biz .bp .meta p b{flex-basis:100%;font-size:13px;color:var(--muted);font-weight:500;margin-bottom:2px}
.biz .carr{margin-left:0}
.biz .cstrip .case{flex-basis:calc((100% - 16px)/2)!important;aspect-ratio:4/5!important}
.biz .cstrip.one .case{flex-basis:100%!important;aspect-ratio:16/10!important}
@media (max-width:900px){.biz .bp.on{grid-template-columns:1fr}.biz .bp .meta{position:static}.biz .cstrip .case{flex-basis:82%!important}}
/* 出海：地球色只做点缀，不给整张图染色 */
.acc .p.globe-p::before{display:none}
.acc .p.globe-p .k,.acc .p.globe-p .d h3{color:#bfe6ea}
.case.nolink{cursor:default}
.w{cursor:default}

/* 上线页脚 + 英文入口 */
.ft{background:#1d1033;color:rgba(255,255,255,.7);padding:56px 0 40px;font-size:13px}
.ft-in{display:grid;grid-template-columns:1.2fr 2fr;gap:28px 48px;align-items:start}
.ft img{filter:brightness(0) invert(1);opacity:.9;margin-bottom:12px}
.ft p{margin:0;color:rgba(255,255,255,.6)}
.ft nav{display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:flex-end}
.ft nav a{color:rgba(255,255,255,.8)}
.ft nav a:hover{color:#fff}
.ft .r46-site-legal{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.12);padding-top:20px;display:flex;flex-wrap:wrap;gap:8px 20px;color:rgba(255,255,255,.5)}
.ft .r46-icp-link{color:rgba(255,255,255,.6);display:inline-flex;gap:6px}
.hd nav a.en{border:1px solid rgba(255,255,255,.4);border-radius:99px;padding:2px 10px;font-size:12px}
@media (max-width:900px){.ft-in{grid-template-columns:1fr}.ft nav{justify-content:flex-start}}

/* 11-02 案例卡：点击原地展开（不再弹窗） */
.cstrip .case{transition:flex-basis .7s cubic-bezier(.2,.7,.2,1),aspect-ratio .7s}
.biz .cstrip .case.open,.cstrip .case.open{flex-basis:100%!important;aspect-ratio:8/5!important;cursor:default}
.case.open img{width:50%!important}
.case.open::after{width:50%;right:auto}
.case.open .m{right:calc(50% + 24px)}
.case .cx{position:absolute;top:0;right:0;bottom:0;width:50%;background:var(--paper);color:var(--text)!important;padding:clamp(24px,3vw,44px);overflow:auto;opacity:0;transform:translateX(24px);transition:opacity .5s .25s,transform .5s .25s;z-index:1}
.case.open .cx{opacity:1;transform:none}
.case .cx *{color:var(--text)!important}
.case .cx dl{display:grid;grid-template-columns:84px 1fr;gap:12px 18px;margin:0}
.case .cx dt{font-size:12.5px;letter-spacing:.14em;color:var(--biz)!important;padding-top:3px}
.case .cx dd{margin:0;font-size:15px;line-height:1.8}
.case .cx dd.res{font-family:var(--serif);font-size:18px;font-weight:600}
.case .cx .cf{margin-top:20px;padding-top:14px;border-top:1px solid rgba(42,28,56,.12);font-size:12px;line-height:1.8;color:var(--muted)!important}
.case .cx .x{all:unset;cursor:pointer;position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:50%;background:rgba(42,28,56,.08);display:grid;place-items:center;font-size:18px}
.case .cx .x:hover{background:var(--biz);color:#fff!important}
.grid-cases .case.open{grid-column:span 2}
@media (max-width:900px){
 .biz .cstrip .case.open,.cstrip .case.open{flex-basis:92%!important;aspect-ratio:auto!important;min-height:auto;display:flex;flex-direction:column}
 .case.open img{position:relative!important;width:100%!important;height:220px!important}
 .case.open::after{display:none}.case.open .m{display:none}
 .case .cx{position:relative;width:auto;transform:none}
}
/* 展开卡不完全挡住旁边那张：占约 78%，旁边露出一截；高度不变 */
.biz .cstrip .case.open,.cstrip .case.open{flex-basis:78%!important;aspect-ratio:auto!important}
.case.open img{width:46%!important}
.case.open::after{width:46%}
.case.open .m{right:calc(54% + 24px)}
.case .cx{width:54%}
.biz .cstrip .case.open,.cstrip .case.open{scroll-snap-align:none}
.cstrip:has(.case.open){scroll-snap-type:none}
.biz .cstrip .case.open,.cstrip .case.open{scroll-snap-align:start}
@media (max-width:900px){
 .biz .cstrip .case.open,.cstrip .case.open{flex-basis:88%!important;height:auto!important;aspect-ratio:auto!important;display:flex!important;flex-direction:column}
 .case.open img{position:relative!important;width:100%!important;height:200px!important;flex:none}
 .case.open::after,.case.open .m{display:none}
 .case .cx,.case.open .cx{position:relative!important;width:auto!important;transform:none!important;padding:22px}
 .case .cx dl{grid-template-columns:1fr;gap:4px}
 .case .cx dd{margin-bottom:10px}
}