/* Full-screen, atmospheric editorial treatment for the Zhiduoxing case. */
.case-modal-overlay.has-full-case.has-zdx-case .case-modal-sheet { padding:0; width:100%; max-width:none; height:100%; max-height:none; border:0; border-radius:0; }
.case-modal-overlay.has-zdx-case #case-study-content { padding:0; }
.case-modal-overlay.has-zdx-case .modal-close { position:fixed; z-index:50; top:24px; right:28px; color:#fff; background:rgba(20,18,30,.75); border:1px solid rgba(255,255,255,.18); }
.case-modal-detail.zhiduoxing-page { padding:0; background:#060609; color:#fff; }
.zdx-new { overflow:hidden; background:#060609; color:#f7f6fc; font-family:Inter,"PingFang SC","Microsoft YaHei",sans-serif; }
.zdx-new * { box-sizing:border-box; }
.zdx-hero { min-height:100vh; position:relative; overflow:hidden; padding:145px 6vw 0; background:#050508; text-align:center; }
.zdx-glow { position:absolute; pointer-events:none; filter:blur(55px); opacity:.8; }
.zdx-glow--warm { width:55vw; height:420px; left:-28vw; top:170px; transform:rotate(24deg); background:linear-gradient(20deg,transparent 25%,#f78b38 45%,#b530aa 62%,transparent 80%); }
.zdx-glow--cool { width:55vw; height:440px; right:-27vw; top:60px; transform:rotate(-25deg); background:radial-gradient(ellipse,#20d7eb 0%,#4445bf 38%,transparent 72%); }
.zdx-hero-inner { position:relative; z-index:2; }
.zdx-eyebrow,.zdx-heading>span,.zdx-ending>span { color:#b7a3f4; font-size:11px; letter-spacing:.22em; font-weight:700; }
.zdx-eyebrow i { display:inline-block; width:4px; height:4px; margin:0 10px 3px; border-radius:50%; background:#b7a3f4; }
.case-modal-detail .zdx-new h1 { margin:32px 0 0; font-size:clamp(38px,6vw,88px); line-height:1.08; letter-spacing:-.06em; font-weight:700; }
.zdx-new h1 span { display:block; color:#fff; }
.zdx-hero-inner>p { margin:28px auto; color:#b8b6c6; font-size:clamp(15px,1.35vw,19px); line-height:1.8; }
.zdx-hero-tags { display:flex; justify-content:center; flex-wrap:wrap; gap:10px; }
.zdx-hero-tags span { padding:8px 15px; border:1px solid #ffffff20; border-radius:99px; color:#c8c3d4; font-size:11px; }
.zdx-button { display:inline-flex; align-items:center; gap:24px; margin-top:32px; padding:7px 7px 7px 21px; border:1px solid #aa85ec80; border-radius:50px; color:#fff; text-decoration:none; font-size:13px; box-shadow:0 0 30px #9251d441; }
.zdx-button b { display:grid; place-items:center; width:32px; height:32px; background:#ffffff19; border-radius:50%; }
.zdx-hero-image { position:relative; z-index:2; max-width:1050px; margin:90px auto 0; padding:9px; border:1px solid #ffffff2b; border-radius:24px 24px 0 0; background:#171421; box-shadow:0 -15px 90px #7951ba35; }
.zdx-hero-image img { display:block; width:100%; border-radius:16px 16px 0 0; }
.zdx-block { max-width:1440px; margin:auto; padding:170px 7vw; }
.zdx-heading { max-width:900px; margin:0 auto 74px; text-align:center; }
.zdx-heading h2,.zdx-ending h2 { margin:26px 0; color:#f6f5fa; font-size:clamp(35px,4vw,62px); line-height:1.25; letter-spacing:-.04em; font-weight:650; }
.zdx-heading em,.zdx-ending em { font-style:normal; background:linear-gradient(90deg,#e59df4,#a98aff,#69c9ef); -webkit-background-clip:text; background-clip:text; color:transparent; }
.zdx-heading p { max-width:650px; margin:auto; color:#9996a8; font-size:16px; line-height:1.9; }
.zdx-grid { display:grid; gap:16px; }
.zdx-grid--two { grid-template-columns:repeat(2,minmax(0,1fr)); }
.zdx-grid--three { grid-template-columns:repeat(3,minmax(0,1fr)); }
.zdx-grid--four { grid-template-columns:repeat(4,minmax(0,1fr)); }
.zdx-card { min-height:250px; padding:38px; border:1px solid #ffffff12; border-radius:18px; background:#0e0e14; }
.zdx-card--glow { background:radial-gradient(ellipse at 50% 110%,#532478 0%,#191126 50%,#0e0e14 100%); border-color:#b376eb35; }
.zdx-card>span,.zdx-card>b { color:#b899f2; font-size:11px; letter-spacing:.14em; }
.zdx-card h3 { margin:30px 0 15px; color:#f7f6fc; font-size:23px; line-height:1.4; }
.zdx-card p { margin:0; color:#a7a4b3; font-size:14px; line-height:1.9; }
.zdx-card strong { display:block; margin-top:38px; color:#cfb4ff; font-size:17px; }
.zdx-stages .zdx-card { min-height:310px; padding:45px; }
.zdx-stages .zdx-card h3 { font-size:31px; }
.zdx-figure { margin:80px 0 0; }
.zdx-figure img { display:block; width:100%; height:auto; border:1px solid #ffffff18; border-radius:16px; }
.zdx-figure figcaption { margin-top:15px; color:#858291; font-size:12px; }
.zdx-figure-pair { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.zdx-agent-gallery { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:20px; align-items:stretch; margin-top:26px; }
.zdx-agent-gallery-left { display:flex; flex-direction:column; gap:20px; min-width:0; }
.zdx-agent-gallery .zdx-figure { min-width:0; margin:0; }
.zdx-agent-gallery-right { display:flex; flex-direction:column; min-height:0; }
.zdx-agent-gallery-right a { display:flex; flex:1; min-height:0; align-items:center; justify-content:center; }
.zdx-agent-gallery-right img { width:100%; height:100%; object-fit:contain; }

.zdx-ending { position:relative; padding:180px 7vw; text-align:center; background:radial-gradient(ellipse at 50% 100%,#322053 0%,#09080e 55%,#060609 80%); }
.zdx-ending p { color:#9996a8; }
@media(max-width:800px) { .zdx-agent-gallery { grid-template-columns:1fr; } .zdx-agent-gallery-right a { display:block; flex:none; } .zdx-agent-gallery-right img { height:auto; } .zdx-hero { min-height:auto; padding:135px 20px 0; } .zdx-hero-image { margin-top:70px; } .zdx-block { padding:100px 24px; } .zdx-heading { margin-bottom:45px; } .zdx-grid--four,.zdx-grid--three { grid-template-columns:repeat(2,minmax(0,1fr)); } .zdx-card { padding:28px; } .zdx-figure-pair { grid-template-columns:1fr; gap:0; } .zdx-ending { padding:120px 24px; } }
@media(max-width:520px) { .zdx-grid--two,.zdx-grid--three,.zdx-grid--four { grid-template-columns:1fr; } .zdx-card { min-height:0; } .zdx-stages .zdx-card { min-height:0; padding:30px; } .zdx-heading p { font-size:14px; } .zdx-figure { margin-top:50px; } }
.zdx-detail-band { display:grid; grid-template-columns:1fr 1fr; gap:1px; margin-top:70px; border:1px solid #ffffff16; border-radius:18px; overflow:hidden; background:#ffffff16; }
.zdx-detail-band>div { padding:38px; background:#0c0c12; }
.zdx-detail-band span,.zdx-eval-steps span { display:block; color:#b899f2; font-size:11px; letter-spacing:.14em; }
.zdx-detail-band strong { display:block; margin-top:18px; color:#f7f6fc; font-size:26px; }
.zdx-detail-band p,.zdx-eval-steps p { color:#a7a4b3; font-size:14px; line-height:1.8; }
.zdx-eval-steps { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:75px; }
.zdx-eval-steps>div { padding-top:22px; border-top:1px solid #aa85ec70; }
.zdx-eval-steps b { display:block; margin-top:18px; color:#fff; font-size:19px; }
.zdx-result-grid { display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid #ffffff20; border-bottom:1px solid #ffffff20; }
.zdx-result-grid>div { padding:40px 25px; text-align:center; }
.zdx-result-grid>div+div { border-left:1px solid #ffffff16; }
.zdx-result-grid strong { display:block; font-size:clamp(38px,4vw,60px); background:linear-gradient(90deg,#e59df4,#82b4ff); -webkit-background-clip:text; background-clip:text; color:transparent; }
.zdx-result-grid span,.zdx-result-grid small { display:block; margin-top:10px; color:#c3c0cc; font-size:14px; }
.zdx-result-grid small { color:#858291; font-size:11px; }
@media(max-width:700px) { .zdx-eval-steps,.zdx-result-grid { grid-template-columns:repeat(2,1fr); } .zdx-result-grid>div:nth-child(3) { border-left:0; } .zdx-detail-band { grid-template-columns:1fr; } }

.zdx-heading h2, .zdx-ending h2 { text-wrap: balance; }
@media(max-width:520px) { .zdx-heading h2, .zdx-ending h2 { font-size:clamp(28px,7vw,35px); } }

.zdx-new .zdx-training-monochrome { filter: grayscale(100%); }

/* Shared case navigation structure: return action at left, section links at right. */
.case-modal-overlay.has-zdx-case .modal-close { display:none; }
.zdx-nav { position:fixed; z-index:60; top:0; left:0; right:0; min-height:64px; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:12px 40px; background:rgba(6,6,9,.92); border-bottom:1px solid rgba(255,255,255,.1); backdrop-filter:blur(12px); }
.zdx-nav-back { flex:0 0 auto; padding:9px 14px; border:1px solid #9672d9; background:#9672d9; color:#fff; font:700 13px/1.4 inherit; font-family:inherit; cursor:pointer; white-space:nowrap; }
.zdx-nav-back:hover { background:#aa84ee; border-color:#aa84ee; }
.zdx-nav-links { display:flex; align-items:center; justify-content:flex-end; gap:24px; overflow-x:auto; scrollbar-width:none; }
.zdx-nav-links::-webkit-scrollbar { display:none; }
.zdx-nav-links a { flex:0 0 auto; color:#aaa7b7; text-decoration:none; font-size:13px; white-space:nowrap; }
.zdx-nav-links a:hover,.zdx-nav-links a:focus-visible { color:#fff; }
@media(max-width:800px) { .zdx-nav { padding:12px 16px; gap:12px; } .zdx-nav-back { padding:7px 10px; font-size:11px; } .zdx-nav-links { gap:16px; justify-content:flex-start; } .zdx-nav-links a { font-size:11px; } }

/* User feedback: a spacious conversation wall. */
.zdx-voices { position:relative; margin-top:150px; padding:70px clamp(24px,5vw,70px) 56px; overflow:hidden; border:1px solid #ffffff15; border-radius:28px; background:radial-gradient(ellipse at 12% 0%,#302043 0%,transparent 48%),radial-gradient(ellipse at 90% 100%,#182839 0%,transparent 48%),#101017; }
.zdx-voices-heading { display:flex; justify-content:space-between; align-items:end; gap:30px; margin-bottom:65px; }
.zdx-voices-heading span { color:#b7a3f4; font-size:11px; font-weight:700; letter-spacing:.2em; }
.zdx-voices-heading h3 { margin:20px 0 0; color:#f7f6fc; font-size:clamp(32px,4vw,52px); line-height:1.3; letter-spacing:-.04em; }
.zdx-voices-heading h3 em { font-style:normal; color:#c7a9f4; }
.zdx-voices-heading>p { margin:0; color:#a7a4b3; font-size:14px; line-height:1.9; }
.zdx-voices-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:18px; align-items:stretch; }
.zdx-voice { position:relative; grid-column:span 2; display:flex; flex-direction:column; align-items:flex-start; min-width:0; min-height:218px; margin:0; padding:28px; border:1px solid #ffffff18; border-radius:22px 22px 22px 5px; background:linear-gradient(145deg,#ffffff0e,#ffffff05); animation:zdx-voice-float 7s ease-in-out infinite; }
.zdx-voice:nth-child(4) { grid-column:2 / span 2; }
.zdx-voice:nth-child(2n) { animation-delay:-3.5s; }
.zdx-voice:nth-child(3n) { animation-delay:-1.8s; }
.zdx-voice-avatar { display:block; flex:none; width:48px; height:48px; border:2px solid #ffffff35; border-radius:50%; background-image:url('zhiduoxing/feedback-avatars-v1.lossless.webp'); background-size:300% 200%; }
.zdx-avatar-1 { background-position:0 0; } .zdx-avatar-2 { background-position:50% 0; } .zdx-avatar-3 { background-position:100% 0; } .zdx-avatar-4 { background-position:0 100%; } .zdx-avatar-5 { background-position:50% 100%; }
.zdx-voice p { margin:23px 0 0; color:#efedf5; font-size:clamp(15px,1.35vw,18px); line-height:1.8; font-weight:500; }
@keyframes zdx-voice-float { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-7px); } }
@media(max-width:800px) { .zdx-voices { margin-top:90px; } .zdx-voices-heading { align-items:start; flex-direction:column; margin-bottom:40px; } .zdx-voice { grid-column:span 3; } .zdx-voice:nth-child(4) { grid-column:span 3; } .zdx-voice:last-child { grid-column:2 / span 4; } }
@media(max-width:520px) { .zdx-voices { margin-top:70px; padding:35px 20px; border-radius:20px; } .zdx-voices-grid { grid-template-columns:1fr; gap:12px; } .zdx-voice,.zdx-voice:nth-child(4),.zdx-voice:last-child { grid-column:auto; min-height:0; padding:22px; } .zdx-voice p { margin-top:16px; } }
@media(prefers-reduced-motion:reduce) { .zdx-voice { animation:none; } }

/* Service case shares the fullscreen card transition while retaining its own page. */
.case-modal-overlay.has-full-case.has-service-fullscreen .case-modal-sheet { width:100%; max-width:none; height:100%; max-height:none; padding:0; border:0; border-radius:0; }
.case-modal-overlay.has-service-fullscreen .modal-close { display:none; }
.case-modal-overlay.has-service-fullscreen #case-study-content { padding:0; overflow:hidden; }
.service-case-frame { display:block; width:100%; height:100%; border:0; background:#f9f9f8; }
.service-frame-title { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
/* Match the portfolio header's spacing, quiet text links and blurred surface. */
.zdx-nav { min-height:80px; padding:16px 44px; gap:28px; background:rgba(6,6,9,.86); border-bottom:1px solid #ffffff1a; -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); }
.zdx-nav-back { padding:0; border:0; background:transparent; color:#f7f6fc; font-family:inherit; font-size:14px; font-weight:600; line-height:1.4; letter-spacing:.04em; }
.zdx-nav-back:hover { background:transparent; color:#c8a9f5; }
.zdx-nav-links { gap:30px; }
.zdx-nav-links a { position:relative; font-size:14px; letter-spacing:.08em; }
.zdx-nav-links a:hover::after,.zdx-nav-links a:focus-visible::after { content:""; position:absolute; left:0; right:0; bottom:-5px; height:1px; background:currentColor; }
@media(max-width:800px) { .zdx-nav { min-height:64px; padding:14px 16px; gap:20px; } .zdx-nav-back { padding:0; font-size:12px; } .zdx-nav-links { gap:20px; } .zdx-nav-links a { font-size:12px; } }
@media(min-width:1000px) { .zdx-nav { display:grid; grid-template-columns:1fr auto 1fr; } .zdx-nav-back { justify-self:start; } .zdx-nav-links { grid-column:2; } }

/* The two tracks end with a typographic keyword, not a call to action. */
.zdx-stages .zdx-card { display:flex; flex-direction:column; overflow:hidden; }
.zdx-stage-keyword { position:relative; margin-top:auto; padding-top:52px; }
.zdx-stage-keyword::before { content:""; display:block; width:38px; height:2px; margin-bottom:17px; background:#b899f2; opacity:.7; }
.zdx-stage-keyword span { display:block; color:#d8c5ff; font-size:clamp(26px,3.2vw,46px); font-weight:700; line-height:1.1; letter-spacing:-.04em; }
.zdx-stage-keyword small { display:block; margin-top:10px; color:#9687aa; font-size:9px; font-weight:600; letter-spacing:.18em; }
@media(max-width:520px) { .zdx-stage-keyword { padding-top:35px; } }