/* Two chapters, each with two image-led stories and two editorial notes.
 * Normal document flow, no full-screen blocks. Keep complete square artwork. */
.use-cases { padding-top:24px; padding-bottom:clamp(80px,9vw,144px); }
.use-cases .section-top { padding-bottom:0; }
.use-case-heading { display:grid; grid-template-columns:1.25fr 1fr; align-items:end; gap:10%; margin:52px 0 72px; }
.use-case-heading h2 { max-width:740px; font:550 clamp(38px,4.5vw,70px)/1.1 var(--font-display); letter-spacing:-.055em; text-wrap:balance; }
.use-case-heading h2>span,.use-case-heading h2>em { display:block; }
.use-case-heading h2>em { margin-top:.07em; font:400 1.12em/1.06 var(--font-editorial); font-style:italic; letter-spacing:-.025em; color:var(--type-gold); }
.use-case-heading>p { font-size:16px; line-height:1.8; color:var(--muted); max-width:385px; padding-bottom:5px; }
.use-case-chapter+.use-case-chapter { margin-top:clamp(70px,8vw,120px); }
.use-case-chapter-heading { display:grid; grid-template-columns:auto 1fr auto; gap:20px; align-items:baseline; border-top:1px solid #c7cbd62b; padding-top:24px; margin-bottom:42px; }
.use-case-chapter-number { font:500 12px/1.5 var(--font-display); letter-spacing:.1em; color:var(--type-gold); }
.use-case-chapter-heading h3 { font:500 clamp(26px,2.6vw,38px)/1.3 var(--font-display); letter-spacing:-.025em; }
.use-case-chapter-heading>p { max-width:300px; font-size:14px; line-height:1.6; color:var(--muted); }
.use-case-grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); column-gap:clamp(20px,3vw,48px); row-gap:clamp(52px,5vw,84px); max-width:1200px; margin-inline:auto; }
.use-case { min-width:0; align-self:start; }
.use-case:nth-child(1) { grid-column:1/8; grid-row:1; }
.use-case:nth-child(2) { grid-column:9/13; grid-row:1; margin-top:clamp(72px,9vw,132px); }
.use-case:nth-child(3) { grid-column:1/5; grid-row:2; margin-top:clamp(48px,6vw,88px); }
.use-case:nth-child(4) { grid-column:6/13; grid-row:2; }
.use-case-scene { position:relative; margin:0; aspect-ratio:1; background:#08111d; }
.use-case-scene::after { content:''; position:absolute; inset:0; border:1px solid #c9d4e412; pointer-events:none; }
.use-case-scene img { display:block; width:100%; height:100%; object-fit:contain; object-position:center; }
.use-case-status { position:absolute; left:24px; right:24px; bottom:24px; color:#c4cddd; font-size:14px; line-height:1.5; }
.use-case-status[hidden] { display:none; }
.use-case-placeholder { position:absolute; inset:0; display:grid; place-items:center; background:linear-gradient(145deg,#0e1926,#070c15); border:1px solid #c9d4e41a; }
.use-case-placeholder>span { font:400 clamp(44px,8vw,96px)/1 var(--font-editorial); color:#cdb8893d; }
.use-case[data-image-state="failed"] .use-case-scene img { opacity:0; }
.use-case-meta { display:flex; align-items:center; gap:16px; margin:22px 0 16px; font-family:var(--font-display); font-size:11px; line-height:1.5; font-weight:500; letter-spacing:.07em; color:#b9b9b4; }
.use-case-number { color:#d2b882; font-variant-numeric:tabular-nums; }
.use-case-meta::after { content:''; height:1px; flex:1; background:linear-gradient(90deg,#d0ba872b,transparent); }
.use-case h4 { font:500 clamp(27px,2.65vw,41px)/1.2 var(--font-display); letter-spacing:-.045em; text-wrap:balance; max-width:660px; margin:0 0 14px; }
.use-case[data-size="support"] h4 { font-size:clamp(25px,2.05vw,32px); }
.use-case-description { color:var(--muted); font-size:16px; line-height:1.8; max-width:480px; }
.use-case-products { display:flex; flex-wrap:wrap; gap:0 22px; margin-top:19px; }
.use-case-products a { display:inline-flex; align-items:center; justify-content:space-between; min-height:44px; gap:20px; max-width:100%; border-bottom:1px solid #8192a55c; font-size:12px; line-height:1.5; color:#d3dbe6; transition:color .2s,border-color .2s; }
.use-case-products a>span:first-child { overflow-wrap:anywhere; }
.use-case-products a>span:last-child { color:var(--type-gold); font-size:18px; }
.use-case-products a:focus-visible { outline:2px solid #f2d29a; outline-offset:5px; }
@media(hover:hover) and (pointer:fine) { .use-case-products a:hover { color:#fff; border-color:#ead4ab; } }
html[lang="zh-CN"] .use-case-heading h2 { letter-spacing:-.025em; line-height:1.3; }
html[lang="zh-CN"] .use-case-heading h2>em { font-family:"Noto Serif SC Editorial","Songti SC","SimSun",serif; font-style:normal; font-size:1.04em; line-height:1.4; letter-spacing:.015em; }
html[lang="zh-CN"] .use-case h4 { letter-spacing:-.025em; line-height:1.4; }
@media(max-width:1000px) {
 .use-case-heading { gap:7%; margin:44px 0 54px; grid-template-columns:1.2fr 1fr; }
 .use-case-heading h2 { font-size:44px; }
 .use-case:nth-child(1) { grid-column:1/8; }
 .use-case:nth-child(2) { grid-column:8/13; margin-top:72px; }
 .use-case:nth-child(3) { grid-column:1/6; margin-top:58px; }
 .use-case:nth-child(4) { grid-column:6/13; }
 .use-case h4 { font-size:30px; }.use-case[data-size="support"] h4 { font-size:26px; }
 .use-case-meta { gap:10px; letter-spacing:.025em; }
}
@media(max-width:700px) {
 .use-cases { padding-top:0; padding-bottom:72px; }
 .use-case-heading { display:block; margin:36px 0 38px; }
 .use-case-heading h2 { font-size:clamp(32px,8.8vw,42px); max-width:510px; }
 .use-case-heading>p { margin-top:23px; max-width:460px; font-size:16px; }
 .use-case-chapter+.use-case-chapter { margin-top:62px; }
 .use-case-chapter-heading { grid-template-columns:auto 1fr; gap:6px 14px; padding-top:20px; margin-bottom:28px; }
 .use-case-chapter-heading h3 { font-size:27px; }.use-case-chapter-heading>p { grid-column:2; font-size:14px; }
 .use-case-grid { display:flex; flex-direction:column; gap:38px; }
 .use-case[data-use-case] { width:100%; margin-top:0; }
 .use-case h4,.use-case[data-size="support"] h4 { font-size:clamp(26px,7.3vw,32px); max-width:520px; margin-bottom:10px; }
 .use-case-meta { margin-top:16px; margin-bottom:10px; }
 .use-case-description { font-size:16px; max-width:460px; }
 .use-case-products { gap:8px 20px; margin-top:14px; }
}
@media(prefers-reduced-motion:reduce) { .use-case-products a { transition:none; } }
