/* The approved card story, sized for a pinned homepage section. */
.client-work-story { --story-top:88px; position:relative; overflow:clip; background:var(--cream); color:var(--ink-blue); }
.cws-track { display:none; }
.client-work-story.is-enhanced .cws-track { display:block; height:440svh; }
.cws-pin { position:sticky; top:var(--story-top); height:calc(100svh - var(--story-top)); min-height:540px; isolation:isolate; }
.cws-skip { position:absolute; z-index:100; }
.cws-scene { position:relative; width:100%; height:100%; max-width:1600px; margin:0 auto; overflow:hidden; }
.cws-lines { position:absolute; inset:0; width:100%; height:100%; opacity:0; }
.cws-lines path { fill:none; stroke:#172b5024; stroke-width:1; }
.cws-head { position:absolute; top:24px; left:6%; right:6%; z-index:90; pointer-events:none; }
.cws-head[hidden] { display:none; }
.cws-head h2 { max-width:940px; margin:0; color:var(--ink-blue); font:400 clamp(36px,4.25vw,66px)/1.04 var(--sans); letter-spacing:-.045em; text-wrap:balance; }
.cws-head p { margin:15px 0 0; color:#51617a; font-size:clamp(16px,1.5vw,20px); line-height:1.4; opacity:0; }
.cws-focus { position:absolute; inset:24% 0; z-index:85; opacity:0; background:radial-gradient(ellipse at center,#f7f3e8 20%,#f7f3e8f7 38%,#f7f3e800 72%); pointer-events:none; }
.cws-head-bubbles h2 { max-width:800px; text-shadow:0 0 16px var(--cream),0 0 28px var(--cream); }
.cws-client { position:absolute; top:0; left:0; display:flex; align-items:center; gap:12px; width:194px; height:76px; padding:13px; border-radius:10px; background:var(--ink-blue); color:var(--cream); z-index:80; font-size:16px; }
.cws-client>span { display:grid; place-items:center; flex:none; width:35px; height:38px; border-radius:6px; background:var(--chartreuse); color:var(--ink-blue); }
.cws-client small { display:block; margin-top:5px; color:#d6deeb; font-size:12px; }
.cws-roster { position:absolute; inset:0; z-index:75; pointer-events:none; }
.cws-person { position:absolute; top:0; left:0; display:flex; align-items:center; gap:6px; padding:6px 9px; height:27px; border-radius:5px; background:#ede8dc; font-size:12px; white-space:nowrap; }
.cws-person i,.cws-owner i { flex:none; width:6px; height:6px; border-radius:50%; background:#8094b0; }
.cws-brand { position:absolute; left:6%; top:0; z-index:80; display:flex; align-items:center; gap:9px; font-size:19px; opacity:0; }
.cws-brand img { width:186px; height:auto; display:block; }
.cws-label { position:absolute; left:0; top:0; z-index:70; font-size:16px; font-weight:600; line-height:1.2; }
.cws-label small { display:block; margin-top:5px; color:#677793; font-size:11px; font-weight:400; }
.cws-card { position:absolute; top:0; left:0; box-sizing:border-box; width:220px; height:142px; overflow:hidden; transform-origin:0 0; border:1px solid #172b5025; border-radius:9px; background:#fffdf8; color:var(--ink-blue); box-shadow:0 5px 16px #172b5010; backface-visibility:hidden; }
.cws-drift { position:absolute; inset:0; pointer-events:none; }
.cws-owner { display:flex; align-items:center; gap:6px; height:28px; padding:6px 11px; border-bottom:1px solid #172b5012; font-size:11px; white-space:nowrap; }
.cws-card[data-owner="1"] .cws-owner i { background:#9a885c; }
.cws-card[data-owner="2"] .cws-owner i { background:#7f719b; }
.cws-card-body { padding:11px; }
.cws-source { display:flex; align-items:center; gap:6px; height:24px; color:#556783; font-size:11px; line-height:1.2; }
.cws-source img { flex:none; display:block; width:24px; height:24px; object-fit:contain; }
.cws-title { display:block; margin-top:9px; font-size:var(--cws-title-size,17px); font-weight:400; line-height:1.23; overflow-wrap:anywhere; }
.cws-cue { position:absolute; bottom:20px; left:6%; z-index:95; margin:0; color:#667894; font-size:12px; pointer-events:none; }
.cws-motion { top:auto; right:24px; bottom:20px; z-index:95; }
.cws-motion[hidden] { display:none; }
.cws-fallback { max-width:1200px; margin:0 auto; padding:32px 6%; }
.cws-fallback article { padding:32px 0; border-bottom:1px solid #172b5020; }
.cws-fallback h2 { margin:0 0 16px; font:400 clamp(30px,4vw,52px)/1.1 var(--sans); letter-spacing:-.04em; }
.cws-fallback p { max-width:720px; color:#51617a; font-size:18px; line-height:1.5; }
.client-work-story.is-enhanced .cws-fallback { position:absolute!important; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); padding:0; margin:-1px; white-space:nowrap; }
@media(max-width:1000px) {
 .cws-head h2 { font-size:clamp(34px,5vw,48px); }
 .cws-label { font-size:14px; }
}
@media(max-width:600px) {
 .client-work-story.is-enhanced .cws-track { height:460svh; }
 .cws-head { top:18px; left:18px; right:18px; }
 .cws-head h2 { font-size:clamp(28px,7.5vw,38px); }
 .cws-head p { margin-top:10px; font-size:14px; line-height:1.3; }
 .cws-client { width:170px; height:58px; gap:8px; padding:10px; font-size:14px; }
 .cws-client>span { width:28px; height:30px; }
 .cws-client small { font-size:11px; margin-top:2px; }
 .cws-person { padding:4px 6px; font-size:10px; height:22px; gap:4px; }
 .cws-person i { width:4px; height:4px; }
 .cws-owner { height:22px; padding:4px 6px; gap:3px; font-size:10px; }
 .cws-owner i { display:none; }
 .cws-card-body { padding:8px; }
 .cws-source { height:18px; gap:4px; font-size:10px; }
 .cws-source img { width:18px; height:18px; }
 .cws-title { margin-top:7px; line-height:1.2; }
 .cws-source span { display:none; }
 .cws-label { font-size:12px; }
 .cws-label small { display:none; }
 .cws-brand { left:18px; font-size:15px; }
 .cws-brand .brand-mark { width:16px; height:16px; }
 .cws-cue { bottom:12px; left:18px; font-size:11px; }
 .cws-motion { right:12px; bottom:12px; }
 .cws-focus { inset:20% -15%; }
}
@media(prefers-reduced-motion:reduce) {
 .client-work-story.is-enhanced .cws-track { display:none; }
 .client-work-story.is-enhanced .cws-fallback { position:static!important; width:auto; height:auto; clip-path:none; padding:32px 6%; margin:0 auto; white-space:normal; }
}