/* Case study pages + featured case-study blocks (mubasharkhan.com) */
.cs-hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:36px}
.cs-cover{margin-top:56px;border-radius:22px;overflow:hidden;border:1px solid hsl(var(--border));background:#0C0E13;box-shadow:0 60px 120px -50px rgba(0,0,0,.9)}
.cs-cover img{display:block;width:100%;height:auto}

/* stats */
.cs-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;margin-top:56px;border:1px solid hsl(var(--border));border-radius:18px;overflow:hidden;background:hsl(var(--border))}
.cs-stat{background:hsl(var(--card));padding:24px 22px}
.cs-stat b{display:block;font-family:"Sora Variable",Sora,sans-serif;font-size:2rem;font-weight:600;letter-spacing:-.02em;color:#FFB23F;line-height:1.1}
.cs-stat span{display:block;margin-top:8px;font-size:14px;line-height:1.45;color:hsl(var(--muted-foreground))}
@media (min-width:768px){.cs-stats{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1100px){.cs-stats{grid-template-columns:repeat(6,minmax(0,1fr))}}

/* brief */
.cs-brief{display:grid;gap:32px}
@media (min-width:1000px){.cs-brief{grid-template-columns:1fr 1.15fr;gap:64px;align-items:start}}
.cs-needs{display:grid;gap:12px;margin:0;padding:0;list-style:none}
.cs-needs li{display:flex;gap:14px;align-items:flex-start;padding:16px 18px;border:1px solid hsl(var(--border));border-radius:14px;background:hsl(var(--card));font-size:16px;line-height:1.5}
.cs-needs li i{flex:none;font-style:normal;font-family:"Geist Mono Variable",ui-monospace,monospace;font-size:12px;font-weight:600;color:#FFB23F;margin-top:3px}

/* modules */
.cs-modules{display:grid;gap:22px;margin-top:56px}
.cs-mod{border:1px solid hsl(var(--border));border-radius:22px;background:hsl(var(--card));padding:28px 22px;display:grid;gap:28px}
@media (min-width:768px){.cs-mod{padding:40px}}
@media (min-width:1100px){.cs-mod{grid-template-columns:1fr 1.15fr;gap:48px;align-items:start}.cs-mod.flip .cs-mod-media{order:-1}}
.cs-num{font-family:"Geist Mono Variable",ui-monospace,monospace;font-size:13px;font-weight:600;letter-spacing:.14em;color:#FFB23F}
.cs-mod h3{margin-top:10px;font-family:"Sora Variable",Sora,sans-serif;font-size:1.65rem;font-weight:600;line-height:1.2;letter-spacing:-.015em}
.cs-mod p.cs-lead{margin-top:14px;font-size:16.5px;line-height:1.65;color:hsl(var(--muted-foreground))}
.cs-list{margin:20px 0 0;padding:0;list-style:none;display:grid;gap:10px}
.cs-list li{position:relative;padding-left:26px;font-size:15.5px;line-height:1.55;color:hsl(var(--foreground) / .9)}
.cs-list li:before{content:"";position:absolute;left:2px;top:.55em;width:12px;height:7px;border-left:2px solid #FFB23F;border-bottom:2px solid #FFB23F;transform:rotate(-45deg)}
.cs-list b{color:hsl(var(--foreground));font-weight:600}
.cs-tools{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 0;padding:0;list-style:none}
.cs-tools li{border-radius:999px;background:hsl(var(--foreground) / .06);padding:5px 11px;font-size:12.5px;color:hsl(var(--muted-foreground))}

/* media */
.cs-mod-media{display:grid;gap:14px}
.cs-shot{display:block;border-radius:14px;overflow:hidden;border:1px solid hsl(var(--border));background:#fff;text-decoration:none}
.cs-shot .cs-bar{display:flex;align-items:center;gap:6px;height:30px;padding:0 12px;background:#1B1D27}
.cs-shot .cs-bar i{width:9px;height:9px;border-radius:50%;background:#3A3D4B;display:block}
.cs-shot .cs-bar span{margin-left:10px;font-size:11.5px;color:#9EA2B3;font-family:"Geist Mono Variable",ui-monospace,monospace}
.cs-shot img{display:block;width:100%;height:auto}
.cs-cap{font-size:13px;line-height:1.5;color:hsl(var(--muted-foreground))}
.cs-cap a{color:#FFB23F;text-decoration:underline;text-underline-offset:3px}
.cs-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.cs-four{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media (min-width:640px){.cs-four{grid-template-columns:repeat(4,minmax(0,1fr))}}
.cs-img{display:block;border-radius:12px;overflow:hidden;border:1px solid hsl(var(--border));background:#0C0E13}
.cs-img img{display:block;width:100%;height:auto}
.cs-tall{max-height:520px;overflow:hidden;position:relative}
.cs-tall:after{content:"";position:absolute;left:0;right:0;bottom:0;height:90px;background:linear-gradient(transparent,rgba(12,14,19,.95))}
.cs-place{display:grid;grid-template-columns:.62fr 1fr;gap:12px;align-items:start}
.cs-place-r{display:grid;gap:12px}
.cs-label{display:block;margin-top:6px;font-family:"Geist Mono Variable",ui-monospace,monospace;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:hsl(var(--muted-foreground))}

/* chat example */
.cs-chat{border-radius:16px;border:1px solid hsl(var(--border));background:#0F1118;padding:18px;display:grid;gap:10px}
.cs-chat-h{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:hsl(var(--muted-foreground));padding-bottom:8px;border-bottom:1px solid hsl(var(--border))}
.cs-chat-h b{color:hsl(var(--foreground));font-weight:600}
.cs-msg{max-width:85%;padding:10px 14px;border-radius:14px;font-size:14px;line-height:1.5}
.cs-msg.bot{background:hsl(var(--foreground) / .07);border-bottom-left-radius:4px}
.cs-msg.me{justify-self:end;background:#6D3AF0;color:#fff;border-bottom-right-radius:4px}
.cs-chat-ok{justify-self:center;font-size:12px;color:#7EE2B0;background:rgba(37,211,102,.1);border-radius:999px;padding:4px 12px}

/* workflow list */
.cs-flows{display:grid;gap:8px;margin:20px 0 0;padding:0;list-style:none}
.cs-flows li{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;padding:12px 14px;border-radius:12px;background:hsl(var(--foreground) / .04);font-size:14.5px;line-height:1.5}
.cs-flows li b{display:block;color:hsl(var(--foreground));font-weight:600}
.cs-flows li span{color:hsl(var(--muted-foreground))}
.cs-flows li i{font-style:normal;font-family:"Geist Mono Variable",ui-monospace,monospace;font-size:11px;font-weight:600;color:#0C0E13;background:#FFB23F;border-radius:6px;padding:3px 6px;margin-top:2px}

/* pipeline */
.cs-pipe{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:16px}
.cs-pipe span{border:1px solid hsl(var(--border));border-radius:999px;padding:6px 12px;font-size:13px;background:hsl(var(--card))}
.cs-pipe em{font-style:normal;color:hsl(var(--muted-foreground));font-size:13px}

/* end-to-end flow */
.cs-flow{display:grid;gap:12px;margin-top:48px;padding:0;list-style:none;counter-reset:f}
@media (min-width:768px){.cs-flow{grid-template-columns:repeat(4,minmax(0,1fr))}}
.cs-flow li{position:relative;border:1px solid hsl(var(--border));border-radius:16px;background:hsl(var(--card));padding:22px 20px;counter-increment:f}
.cs-flow li:before{content:"0" counter(f);display:block;font-family:"Geist Mono Variable",ui-monospace,monospace;font-size:12px;font-weight:600;color:#FFB23F;letter-spacing:.12em}
.cs-flow li b{display:block;margin-top:10px;font-family:"Sora Variable",Sora,sans-serif;font-size:1.1rem;font-weight:600}
.cs-flow li span{display:block;margin-top:8px;font-size:14.5px;line-height:1.55;color:hsl(var(--muted-foreground))}

/* stack */
.cs-stack{display:flex;flex-wrap:wrap;gap:10px;margin:32px 0 0;padding:0;list-style:none}
.cs-stack li{border:1px solid hsl(var(--border));border-radius:999px;padding:9px 16px;font-size:14.5px;background:hsl(var(--card))}

.cs-note{margin-top:28px;padding:18px 20px;border-radius:14px;border:1px dashed hsl(var(--foreground) / .2);font-size:15px;line-height:1.6;color:hsl(var(--muted-foreground))}
.cs-note b{color:hsl(var(--foreground))}

/* featured case-study block on /work and the home page */
.cs-feature{display:grid;gap:0;border:1px solid hsl(var(--border));border-radius:22px;overflow:hidden;background:hsl(var(--card));text-decoration:none;color:inherit;transition:border-color .3s}
.cs-feature:hover{border-color:rgba(255,178,63,.55)}
@media (min-width:1000px){.cs-feature{grid-template-columns:1.25fr 1fr}}
.cs-feature-img{display:block;background:#0C0E13;overflow:hidden}
.cs-feature-img img{display:block;width:100%;height:100%;object-fit:cover;object-position:top left;transition:transform .7s cubic-bezier(.22,1,.36,1)}
.cs-feature:hover .cs-feature-img img{transform:scale(1.03)}
.cs-feature-body{padding:28px 24px;display:flex;flex-direction:column;justify-content:center}
@media (min-width:768px){.cs-feature-body{padding:40px}}
.cs-feature-body h2,.cs-feature-body h3{margin-top:14px;font-family:"Sora Variable",Sora,sans-serif;font-size:1.7rem;font-weight:600;line-height:1.18;letter-spacing:-.015em}
.cs-feature-body p{margin-top:14px;font-size:16px;line-height:1.6;color:hsl(var(--muted-foreground))}
.cs-feature-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.cs-feature-tags span{border-radius:999px;background:hsl(var(--foreground) / .06);padding:5px 11px;font-size:12.5px;color:hsl(var(--muted-foreground))}
.cs-feature-cta{display:inline-flex;align-items:center;gap:8px;margin-top:26px;font-weight:600;color:#FFB23F}
.cs-feature-cta svg{width:16px;height:16px;transition:transform .3s}
.cs-feature:hover .cs-feature-cta svg{transform:translateX(4px)}
.cs-badge{display:inline-flex;align-self:flex-start;align-items:center;gap:8px;border:1px solid rgba(255,178,63,.45);border-radius:999px;padding:5px 12px;font-family:"Geist Mono Variable",ui-monospace,monospace;font-size:11.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#FFB23F}
.cs-badge:before{content:"";width:7px;height:7px;border-radius:50%;background:#25D366;box-shadow:0 0 0 3px rgba(37,211,102,.2)}
