.account-ui[data-page="use-cases"] .use-case-intro { padding-top:72px; padding-bottom:48px; }
.account-ui[data-page="use-cases"] h1 { max-width:720px; font-size:clamp(36px,5vw,54px); }
.account-ui[data-page="use-cases"] .use-case-intro p { max-width:620px; font-size:20px; }
.account-ui .use-case { padding:44px 0 52px; border-top:1px solid var(--border); scroll-margin-top:24px; }
.account-ui .use-case h2 { margin:0 0 16px; font:500 clamp(26px,3vw,34px)/1.25 var(--font-display); }
.account-ui .use-case-description { max-width:720px; margin:0 0 28px; font-size:18px; }
.account-ui .use-case ol { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:36px; padding:0; margin:0; list-style:none; counter-reset:flow; }
.account-ui .use-case li { counter-increment:flow; }
.account-ui .use-case li::before { content:counter(flow,decimal-leading-zero); display:block; margin-bottom:10px; color:var(--accent); font-size:13px; }
.account-ui .use-case-film { margin-top:32px; }
.account-ui .use-case-film summary { display:list-item; width:fit-content; padding:12px 16px; border:1px solid var(--border); border-radius:6px; font-size:16px; }
.account-ui .use-case-film summary span { margin-left:14px; font-size:14px; color:var(--text-secondary); white-space:nowrap; }
.account-ui .use-case-film video { display:block; width:100%; aspect-ratio:16/9; height:auto; background:#202925; margin-top:20px; border-radius:6px; }
.account-ui .use-case-options { background:var(--surface-muted); padding:44px 0 56px; }
.account-ui .use-case-options h2 { margin:0 0 28px; }
.account-ui .use-case-modes { display:grid; grid-template-columns:1fr 1fr; gap:48px; }
.account-ui .use-case-modes h3 { margin:0 0 8px; }
.account-ui .use-case-modes p { margin:0; }
.account-ui .use-case-benefit { margin:32px 0 24px; color:var(--text-primary); }
@media(max-width:720px) {
  .account-ui[data-page="use-cases"] .use-case-intro { padding-top:40px; padding-bottom:28px; }
  .account-ui .use-case { padding:32px 0 36px; }
  .account-ui .use-case ol, .account-ui .use-case-modes { grid-template-columns:1fr; gap:24px; }
  .account-ui .use-case li { display:grid; grid-template-columns:24px 1fr; gap:12px; }
  .account-ui .use-case li::before { margin:4px 0 0; }
}