.case-hero { padding:120px 0 72px; border-bottom:1px solid var(--border-lt); }
.case-hero-grid { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr); gap:3rem; align-items:center; }
.case-breadcrumb { font-size:.8rem; color:var(--text-3); margin-bottom:1rem; }
.case-breadcrumb a { color:var(--text-3); text-decoration:none; }
.case-breadcrumb a:hover { color:var(--blue); }
.case-kicker { color:var(--blue); font-size:.72rem; font-weight:800; letter-spacing:1.5px; text-transform:uppercase; margin-bottom:.75rem; }
.case-title { font-size:3rem; font-weight:900; line-height:1.08; letter-spacing:-.045em; margin-bottom:1rem; }
.case-lead { max-width:700px; color:var(--text-3); font-size:1.05rem; line-height:1.8; }
.case-actions { display:flex; flex-wrap:wrap; gap:.75rem; margin-top:1.5rem; }
.case-badge { display:inline-block; margin-bottom:.8rem; padding:4px 11px; border:1px solid #a7f3d0; border-radius:100px; background:#ecfdf5; color:#065f46; font-size:.7rem; font-weight:800; letter-spacing:1px; text-transform:uppercase; }
.case-badge.client { color:#1d4ed8; background:#eff6ff; border-color:#bfdbfe; }
.case-art { display:block; width:min(100%,470px); margin:auto; filter:grayscale(20%) saturate(.65); }
.case-overview { max-width:850px; margin:0 auto; text-align:center; }
.case-overview p { color:var(--text-3); font-size:1.05rem; line-height:1.85; }
.case-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.25rem; }
.case-grid.three { grid-template-columns:repeat(3,minmax(0,1fr)); }
.case-card { border:1px solid var(--border); border-radius:14px; padding:1.75rem; background:var(--bg); }
.case-card i { color:var(--blue); font-size:1.3rem; margin-bottom:.8rem; }
.case-card h3 { font-size:1.05rem; margin-bottom:.6rem; }
.case-card p, .case-card li { color:var(--text-3); font-size:.9rem; line-height:1.7; }
.case-card ul { list-style:none; }
.case-card li { position:relative; padding:.25rem 0 .25rem 1rem; }
.case-card li::before { content:""; position:absolute; left:0; top:.85rem; width:5px; height:5px; border-radius:50%; background:var(--blue); }
.case-band { background:var(--bg-alt); border-top:1px solid var(--border-lt); border-bottom:1px solid var(--border-lt); }
.case-section-head { max-width:720px; margin-bottom:2.5rem; }
.case-section-head .section-title { margin-bottom:.75rem; }
.case-section-head p { color:var(--text-3); line-height:1.8; }
.case-flow { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border:1px solid var(--border); border-radius:14px; overflow:hidden; }
.case-flow-step { padding:1.5rem; border-right:1px solid var(--border); }
.case-flow-step:last-child { border-right:0; }
.case-flow-step span { display:block; color:var(--blue); font-size:.68rem; font-weight:900; letter-spacing:1px; margin-bottom:.6rem; }
.case-flow-step h3 { font-size:.95rem; margin-bottom:.35rem; }
.case-flow-step p { color:var(--text-3); font-size:.82rem; line-height:1.6; }
.tech-list { display:flex; flex-wrap:wrap; gap:.65rem; }
.tech-list span { border:1px solid var(--border); border-radius:100px; padding:7px 12px; background:var(--bg-alt); color:var(--text-2); font-size:.8rem; font-weight:600; }
.case-note { margin-top:1.25rem; padding:1.1rem 1.25rem; border-left:3px solid var(--blue); background:var(--blue-lt); color:var(--text-2); font-size:.88rem; line-height:1.7; }
@media (max-width:900px) {
    .case-hero-grid, .case-grid, .case-grid.three { grid-template-columns:1fr; }
    .case-hero-grid { gap:1.5rem; }
    .case-art { width:min(88vw,360px); }
    .case-flow { grid-template-columns:1fr 1fr; }
    .case-flow-step:nth-child(2) { border-right:0; }
    .case-flow-step:nth-child(-n+2) { border-bottom:1px solid var(--border); }
}
@media (max-width:600px) {
    .case-hero { padding:96px 0 52px; }
    .case-title { font-size:2rem; }
    .case-lead { font-size:1rem; }
    .case-flow { grid-template-columns:1fr; }
    .case-flow-step { border-right:0; border-bottom:1px solid var(--border); }
    .case-flow-step:nth-child(2) { border-bottom:1px solid var(--border); }
    .case-flow-step:last-child { border-bottom:0; }
    .case-actions .btn { width:100%; }
}