/* ── CASE FILTER BAR ── */
    .filter-bar {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      margin-bottom: clamp(40px, 6vw, 64px);
    }
    .filter-tag {
      font-family: var(--font-mono);
      font-size: 9px;
      letter-spacing: .18em;
      text-transform: uppercase;
      padding: 8px 16px;
      border: 1px solid rgba(200,217,230,0.2);
      color: rgba(245,239,235,0.75);
      cursor: default;
    }
    .filter-tag--red   { border-color: rgba(86,124,141,.4);   color: rgba(245,239,235,0.8); }
    .filter-tag--blue  { border-color: rgba(200,217,230,.3); color: rgba(200,217,230,.8); }
    .filter-tag--tan   { border-color: rgba(200,217,230,0.35); color: rgba(200,217,230,0.8); }

    /* ── CASE CARDS ── */
    .cases-list {
      display: flex;
      flex-direction: column;
      gap: 0;
      border: 1px solid rgba(200,217,230,0.12);
    }
    .case-card {
      display: grid;
      grid-template-columns: 280px 1fr;
      gap: 0;
      border-bottom: 1px solid rgba(200,217,230,0.1);
      position: relative;
      overflow: hidden;
      transition: background 350ms var(--ease-out);
    }
    .case-card:last-child { border-bottom: none; }
    .case-card::before {
      content: '';
      position: absolute;
      top: 0; left: 0; bottom: 0;
      width: 3px;
      transform: scaleY(0);
      transform-origin: top;
      transition: transform 400ms var(--ease-out);
    }
    .case-card--red::before   { background: var(--perm-red); }
    .case-card--blue::before  { background: var(--perm-blue); }
    .case-card--tan::before   { background: var(--perm-tan); }
    .case-card:hover::before  { transform: scaleY(1); }
    .case-card:hover          { background: rgba(134,169,185,.02); }

    .case-card-left {
      padding: clamp(28px, 4vw, 48px);
      border-right: 1px solid rgba(200,217,230,0.1);
      background: var(--perm-darker);
      display: flex;
      flex-direction: column;
      gap: 16px;
    }
    .case-num {
      font-family: var(--font-mono);
      font-size: 48px;
      font-weight: 400;
      line-height: 1;
      opacity: .07;
      color: #F5EFEB;
      letter-spacing: -.04em;
    }
    .case-client {
      font-family: var(--font-mono);
      font-size: 9px;
      letter-spacing: .22em;
      text-transform: uppercase;
      color: var(--perm-blue);
    }
    .case-type-tag {
      display: inline-block;
      font-family: var(--font-mono);
      font-size: 9px;
      letter-spacing: .15em;
      text-transform: uppercase;
      padding: 5px 10px;
      border: 1px solid;
      align-self: flex-start;
    }
    .case-type-tag--red  { color: rgba(245,239,235,0.8); border-color: rgba(86,124,141,.4); }
    .case-type-tag--blue { color: rgba(200,217,230,.8); border-color: rgba(200,217,230,.3); }
    .case-type-tag--tan  { color: rgba(200,217,230,0.8); border-color: rgba(200,217,230,0.35); }

    .case-stats {
      margin-top: auto;
      display: flex;
      flex-direction: column;
      gap: 12px;
    }
    .case-stat-row {
      display: flex;
      flex-direction: column;
    }
    .case-stat-val {
      font-family: var(--font-wordmark);
      font-size: clamp(22px, 2.8vw, 32px);
      font-weight: 700;
      color: #F5EFEB;
      line-height: 1;
    }
    .case-stat-lbl {
      font-family: var(--font-mono);
      font-size: 8px;
      letter-spacing: .18em;
      text-transform: uppercase;
      color: rgba(245,239,235,0.75);
      margin-top: 4px;
    }

    .case-card-right {
      padding: clamp(28px, 4vw, 48px);
      display: flex;
      flex-direction: column;
      gap: 20px;
    }
    .case-title {
      font-family: var(--font-wordmark);
      font-style: italic;
      font-size: clamp(22px, 2.8vw, 34px);
      font-weight: 700;
      line-height: 1.15;
      color: #F5EFEB;
    }
    .case-situation {
      font-size: clamp(13px, 1.4vw, 15px);
      line-height: 1.8;
      color: rgba(245,239,235,0.75);
    }
    .case-facts {
      display: flex;
      flex-direction: column;
      gap: 10px;
    }
    .case-fact {
      display: flex;
      gap: 12px;
      align-items: flex-start;
      font-size: 13px;
      color: rgba(245,239,235,0.75);
    }
    .case-fact-dot {
      width: 5px; height: 5px;
      border-radius: 50%;
      background: var(--perm-blue);
      margin-top: 8px;
      flex-shrink: 0;
    }
    .case-fact-dot--red { background: var(--perm-red); }
    .case-fact-dot--tan { background: var(--perm-tan); }

    .case-proof {
      margin-top: auto;
      padding-top: 20px;
      border-top: 1px solid rgba(200,217,230,0.1);
    }
    .case-proof-label {
      font-family: var(--font-mono);
      font-size: 9px;
      letter-spacing: .2em;
      text-transform: uppercase;
      color: rgba(245,239,235,0.75);
      margin-bottom: 8px;
    }
    .case-proof-text {
      font-size: 13px;
      line-height: 1.6;
      color: rgba(245,239,235,0.75);
      font-style: italic;
    }

    /* ── RESPONSIVE ── */
    @media (max-width: 1024px) {
      .case-card { grid-template-columns: 1fr; }
      .case-card-left { border-right: none; border-bottom: 1px solid rgba(200,217,230,0.1); }
      .case-stats { flex-direction: row; gap: 32px; flex-wrap: wrap; }
    }
    @media (max-width: 768px) {
      .erkenning-inner { flex-direction: column; align-items: flex-start; }
    }


    /* ── BEELDVERSLAG NOODDORP ── */
    .case-gallery { padding: clamp(28px,4vw,48px); border-bottom: 1px solid rgba(200,217,230,0.1); background: var(--perm-darker); }
    .cg-head { max-width: 760px; margin-bottom: clamp(20px,3vw,32px); }
    .cg-eyebrow { font-family: var(--font-mono); font-size: 10px; letter-spacing: .18em; text-transform: uppercase; color: rgba(200,217,230,0.85); margin: 0 0 10px; }
    .cg-title { font-family: var(--font-wordmark); font-weight: 400; font-size: clamp(24px,2.6vw,36px); line-height: 1.15; color: #F5EFEB; margin: 0 0 12px; }
    .cg-sub { font-family: var(--font-body); font-size: 15px; line-height: 1.6; color: rgba(245,239,235,0.75); margin: 0; }
    .cg-grid { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 200px; grid-auto-flow: dense; gap: 8px; }
    .cg-item { position: relative; margin: 0; overflow: hidden; background: #0D1520; }
    .cg-item--wide { grid-column: span 2; }
    .cg-item--tall { grid-row: span 2; }
    .cg-link { display: block; width: 100%; height: 100%; cursor: zoom-in; }
    .cg-link:focus-visible { outline: 2px solid #C8D9E6; outline-offset: -2px; }
    .cg-item img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 600ms var(--ease-out); }
    .cg-item:hover img { transform: scale(1.04); }
    .cg-item figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 28px 12px 10px; font-family: var(--font-mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: rgba(245,239,235,0.9); background: linear-gradient(to top, rgba(6,10,15,.85), rgba(6,10,15,0)); pointer-events: none; }
    .cg-lightbox { position: fixed; inset: 0; z-index: 1000; background: rgba(6,10,15,.94); display: flex; align-items: center; justify-content: center; padding: 24px 64px; }
    .cg-lightbox[hidden] { display: none; }
    .cg-lb-fig { margin: 0; max-width: 100%; max-height: 100%; display: flex; flex-direction: column; align-items: center; gap: 12px; }
    .cg-lb-fig img { max-width: 100%; max-height: calc(100vh - 110px); object-fit: contain; display: block; }
    .cg-lb-fig figcaption { font-family: var(--font-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: rgba(245,239,235,0.75); text-align: center; }
    .cg-lb-close, .cg-lb-prev, .cg-lb-next { position: absolute; background: none; border: 1px solid rgba(200,217,230,0.35); color: #F5EFEB; width: 44px; height: 44px; border-radius: 50%; font-size: 24px; line-height: 1; cursor: pointer; }
    .cg-lb-close { top: 20px; right: 20px; }
    .cg-lb-prev { left: 12px; top: 50%; transform: translateY(-50%); }
    .cg-lb-next { right: 12px; top: 50%; transform: translateY(-50%); }
    .cg-lb-close:hover, .cg-lb-prev:hover, .cg-lb-next:hover { background: rgba(86,124,141,.35); }
    @media (max-width: 768px) {
      .cg-grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 150px; }
      .cg-lightbox { padding: 64px 12px; }
      .cg-lb-prev, .cg-lb-next { top: auto; bottom: 16px; transform: none; }
      .cg-lb-prev { left: calc(50% - 56px); } .cg-lb-next { right: calc(50% - 56px); }
    }

    .case-sub-label { font-family: var(--font-mono); font-size: 10px; letter-spacing: .18em; text-transform: uppercase; color: rgba(200,217,230,0.85); margin: 20px 0 10px; }

    .case-gallery--small .cg-grid { grid-auto-rows: 240px; }
    @media (max-width: 768px) { .case-gallery--small .cg-grid { grid-auto-rows: 160px; } }