:root{--ink:#111217;--muted:#5f6470;--soft:#f3f3f4;--paper:#fff;--line:#d9dadf;--red:#b01217}
body{background:#fff}
.case-hub{min-height:70vh}
.case-hub__head{border-bottom:1px solid var(--line);background:#fff}
.case-hub__head-inner{max-width:1220px;margin:0 auto;padding:66px 0 46px;display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,.75fr);gap:70px;align-items:end}
.case-hub__head h1{margin:0;font-size:68px;line-height:1}
.case-hub__head p{margin:0;color:#41444d;font-size:19px;line-height:1.55}
.case-controls{position:sticky;top:var(--site-header-height,104px);z-index:20;border-bottom:1px solid var(--line);background:rgba(255,255,255,.97);backdrop-filter:blur(12px);transition:top .24s ease}
html.is-site-header-hidden .case-controls{top:0}
.case-controls__inner{max-width:1220px;margin:0 auto;padding:16px 0;display:grid;grid-template-columns:280px minmax(0,1fr);gap:18px;align-items:center}
.case-search{width:100%;height:44px;padding:0 14px;border:1px solid var(--line);border-radius:0;background:#fff;color:var(--ink);font:inherit}
.case-filters{display:flex;justify-content:flex-start;overflow:auto;scrollbar-width:none}
.case-filters::-webkit-scrollbar{display:none}
.case-filter{min-height:44px;padding:0 10px;border:1px solid var(--line);border-right:0;border-radius:0;background:#fff;color:#4e515b;font:inherit;font-size:12px;font-weight:800;white-space:nowrap;cursor:pointer}
.case-filter:last-child{border-right:1px solid var(--line)}
.case-filter.is-active{border-color:var(--red);background:var(--red);color:#fff}
.case-grid-wrap{background:var(--soft);padding:42px 24px 82px}
.case-grid{max-width:1220px;margin:0 auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px 20px}
.case-card{min-width:0;border:1px solid var(--line);background:#fff;color:var(--ink);text-decoration:none}
.case-card[hidden]{display:none}
.case-card__media{aspect-ratio:4/3;display:grid;place-items:center;overflow:hidden;background:#f7f7f8}
.case-card__media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .25s ease}
.case-card[data-cover-kind="source"] .case-card__media{padding:24px;background:#fff}
.case-card[data-cover-kind="source"] .case-card__media img{object-fit:contain}
.case-card[data-cover-slug="laktalis"] .case-card__media img{transform:scale(1.35)}
.case-card[data-cover-slug="positive-technologies"] .case-card__media img{transform:scale(1.25)}
.case-card[data-cover-slug="rehau"] .case-card__media img{transform:scale(1.16)}
.case-card:hover .case-card__media img{transform:scale(1.025)}
.case-card[data-cover-slug="laktalis"]:hover .case-card__media img{transform:scale(1.38)}
.case-card[data-cover-slug="positive-technologies"]:hover .case-card__media img{transform:scale(1.28)}
.case-card[data-cover-slug="rehau"]:hover .case-card__media img{transform:scale(1.19)}
.case-card__copy{min-height:278px;padding:24px 24px 28px;display:flex;flex-direction:column}
.case-card__topic{color:var(--red);font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.12em}
.case-card h2{margin:13px 0 0;font-size:25px;line-height:1.18}
.case-card p{margin:18px 0 0;color:var(--muted);font-size:15px;line-height:1.55}
.case-card__link{margin-top:auto;padding-top:22px;color:var(--red);font-size:14px;font-weight:900}
.case-empty{display:none;max-width:1220px;margin:0 auto;padding:54px 0;color:var(--muted);font-size:18px}
.case-empty.is-visible{display:block}
@media(max-width:1280px){
  .case-hub__head-inner,.case-controls__inner{margin-left:24px;margin-right:24px}
}
@media(max-width:1000px){
  .case-hub__head-inner{padding:46px 0 34px;grid-template-columns:1fr;gap:20px}
  .case-hub__head h1{font-size:54px}
  .case-controls__inner{grid-template-columns:1fr}
  .case-filters{justify-content:flex-start}
  .case-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px){
  .case-hub__head-inner,.case-controls__inner{margin-left:18px;margin-right:18px}
  .case-hub__head h1{font-size:44px}
  .case-hub__head p{font-size:17px}
  .case-controls{position:static}
  .case-grid-wrap{padding:28px 18px 58px}
  .case-grid{grid-template-columns:1fr}
  .case-card__copy{min-height:0}
  .case-card h2{font-size:23px}
}