@charset "UTF-8";
/* NDA CASES ARCHIVE — page-specific styles only. Base patterns live in base.css */

/* ── FILTER BAR ── */
/* base.css gives #filter-bar .filter-inner `overflow-x:auto` so the unit buttons can
   scroll on narrow screens. CSS forces the other axis to `auto` as well, which turned
   the 42px-tall bar into a clipping box and cut the Tags and Industry dropdowns down to
   a 2px sliver — they opened, but nothing was visible. Scroll the buttons instead and
   let the bar itself overflow. Only the cases archive has dropdowns in the bar, so this
   override stays on this page. */
#filter-bar .filter-inner{overflow:visible}
.filter-facets{display:flex;align-items:center;gap:10px}
.filter-units{display:flex;align-items:stretch;gap:0;min-width:0;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.filter-units::-webkit-scrollbar{display:none}
.filter-tag-wrap{position:relative}
.filter-industry-wrap{position:relative}
.industry-trigger{
  display:flex;align-items:center;gap:7px;
  padding:10px 14px;
  font-family:var(--display);font-size:12px;font-weight:600;letter-spacing:-.01em;
  color:var(--dim);background:rgba(255,255,255,.04);
  border:1px solid var(--b1);border-radius:6px;cursor:pointer;
  transition:color .15s,border-color .15s,background .15s;white-space:nowrap;
}
.industry-trigger:hover{color:var(--text);border-color:var(--b2);background:rgba(255,255,255,.07)}
.industry-trigger.has-filter{color:var(--n0);border-color:var(--b2);background:rgba(255,255,255,.08)}
.industry-trigger-label{flex:1}
.industry-chevron{font-size:11px;color:var(--dim);transition:transform .2s;flex-shrink:0}
.industry-trigger.open .industry-chevron{transform:rotate(180deg)}
.industry-dropdown{
  position:absolute;top:calc(100% + 6px);right:0;
  background:rgba(15,22,35,.98);border:1px solid var(--b2);
  border-radius:8px;overflow:hidden;
  min-width:200px;z-index:300;
  opacity:0;transform:translateY(-6px);pointer-events:none;
  transition:opacity .18s ease,transform .18s ease;
  backdrop-filter:blur(20px);
}
.industry-dropdown.open{opacity:1;transform:none;pointer-events:all}
.industry-option{
  display:flex;align-items:center;justify-content:space-between;
  padding:11px 16px;font-size:12.5px;color:var(--mid);cursor:pointer;
  transition:background .12s,color .12s;gap:12px;
  border-bottom:1px solid var(--b1);
}
.industry-option:last-child{border-bottom:none}
.industry-option:hover{background:rgba(255,255,255,.05);color:var(--text)}
.industry-option.active{color:var(--n0)}
.industry-option-check{
  width:14px;height:14px;border-radius:50%;
  border:1px solid var(--b1);flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-size:11px;color:transparent;
  transition:background .15s,border-color .15s,color .15s;
}
.industry-option.active .industry-option-check{background:var(--n0);border-color:var(--n0);color:var(--bg)}
.tag-trigger{
  display:flex;align-items:center;gap:7px;
  padding:10px 14px;
  font-family:var(--display);font-size:12px;font-weight:600;letter-spacing:-.01em;
  color:var(--dim);background:rgba(255,255,255,.04);
  border:1px solid var(--b1);border-radius:6px;cursor:pointer;
  transition:color .15s,border-color .15s,background .15s;white-space:nowrap;
}
.tag-trigger:hover{color:var(--text);border-color:var(--b2);background:rgba(255,255,255,.07)}
.tag-trigger.has-filter{color:var(--n0);border-color:var(--b2);background:rgba(255,255,255,.08)}
.tag-trigger-label{flex:1}
.tag-chevron{font-size:11px;color:var(--dim);transition:transform .2s;flex-shrink:0}
.tag-trigger.open .tag-chevron{transform:rotate(180deg)}
.tag-dropdown{
  position:absolute;top:calc(100% + 6px);right:0;
  background:rgba(15,22,35,.98);border:1px solid var(--b2);
  border-radius:8px;overflow:hidden;
  min-width:200px;z-index:300;
  opacity:0;transform:translateY(-6px);pointer-events:none;
  transition:opacity .18s ease,transform .18s ease;
  backdrop-filter:blur(20px);
}
.tag-dropdown.open{opacity:1;transform:none;pointer-events:all}
.tag-option{
  display:flex;align-items:center;justify-content:space-between;
  padding:11px 16px;font-size:12.5px;color:var(--mid);cursor:pointer;
  transition:background .12s,color .12s;gap:12px;
  border-bottom:1px solid var(--b1);
}
.tag-option:last-child{border-bottom:none}
.tag-option:hover{background:rgba(255,255,255,.05);color:var(--text)}
.tag-option.active{color:var(--n0)}
.tag-option-check{
  width:14px;height:14px;border-radius:50%;
  border:1px solid var(--b1);flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-size:11px;color:transparent;
  transition:background .15s,border-color .15s,color .15s;
}
.tag-option.active .tag-option-check{background:var(--n0);border-color:var(--n0);color:var(--bg)}

/* ── CASES AREA ── */
#cases{padding:56px 0 96px;background:var(--bg)}
.cases-wrap{max-width:1200px;margin:0 auto;padding:0 56px}
.empty-state{padding:80px 0;text-align:center;display:none}
.empty-state.visible{display:block}
.empty-state-title{font-family:var(--display);font-size:18px;font-weight:700;color:var(--mid);margin-bottom:8px}
.empty-state-sub{font-size:15px;color:var(--dim)}
.cases-count{font-size:11px;color:var(--dim);letter-spacing:.06em;margin-bottom:40px;padding-bottom:16px;border-bottom:1px solid var(--b1)}
.cases-count span{color:var(--mid);font-weight:500}

/* ── CASES GRID ── */
.cases-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}

/* ── CASE CARD ── */
.case-card{
  background:var(--graph);border:1px solid var(--b1);border-radius:10px;
  overflow:hidden;display:flex;flex-direction:column;
  transition:border-color .2s,transform .2s;cursor:pointer;
}
.case-card:hover{border-color:var(--b2);transform:translateY(-2px)}
.case-image{
  aspect-ratio:16/9;position:relative;overflow:hidden;
  display:flex;align-items:flex-end;padding:16px;
  background-position:center;background-repeat:no-repeat;background-size:cover;
}
.case-image::after{
  content:'';position:absolute;inset:0;
  background:var(--case-card-image-overlay);
}
.case-image-logo{
  position:absolute;top:16px;left:16px;z-index:1;
  width:68px;height:68px;padding:11px;border-radius:16px;
  background:var(--case-card-image-surface);border:1px solid rgba(255,255,255,.18);
  backdrop-filter:blur(12px);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 10px 30px rgba(0,0,0,.18);
}
.case-image-logo img{max-width:100%;max-height:100%;object-fit:contain;display:block}
.case-card[data-unit="growth"] .case-image{background:linear-gradient(145deg,rgba(232,91,158,.3) 0%,rgba(9,13,20,.9) 100%)}
.case-card[data-unit="innovation"] .case-image{background:linear-gradient(145deg,rgba(34,182,230,.25) 0%,rgba(9,13,20,.9) 100%)}
.case-card[data-unit="learn"] .case-image{background:linear-gradient(145deg,rgba(242,131,63,.25) 0%,rgba(9,13,20,.9) 100%)}
.case-image::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;z-index:2}
.case-card[data-unit="growth"] .case-image::before{background:var(--growth)}
.case-card[data-unit="innovation"] .case-image::before{background:var(--innovation)}
.case-card[data-unit="learn"] .case-image::before{background:#F2833F}
.case-image-metric{position:relative;z-index:1}
.case-image-num{font-family:var(--display);font-size:clamp(28px,4vw,40px);font-weight:700;letter-spacing:-.04em;line-height:1;margin-bottom:3px;color:var(--n0)}
.case-card[data-unit="growth"] .case-image-num{color:var(--growth)}
.case-card[data-unit="innovation"] .case-image-num{color:var(--innovation)}
.case-image-label{font-size:11px;color:var(--case-card-image-label);line-height:1.4}
.case-card[data-unit="learn"] .case-image-num{color:var(--learn)}
.case-card[data-unit="learn"]:hover .case-link{color:var(--learn);gap:8px}
.news-image-meta{
  position:relative;z-index:1;
  display:flex;flex-direction:column;gap:4px;
  padding:7px 10px 8px;
  max-width:fit-content;
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  background:rgba(9,13,20,.34);
  backdrop-filter:blur(8px);
}
.news-image-kind{
  font-size:10px;
  font-weight:700;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--growth);
  line-height:1;
}
.news-image-source{
  font-size:11px;
  font-weight:600;
  line-height:1.2;
  color:var(--n0);
  opacity:.8;
}
.news-card .case-image{padding:14px}
.news-card .case-image::after{background:linear-gradient(180deg,rgba(9,13,20,.08) 0%,rgba(9,13,20,.44) 100%)}
.news-card .case-image-metric{display:none}
.case-body{padding:20px 22px 22px;display:flex;flex-direction:column;flex:1}
.case-tags{display:flex;align-items:center;gap:6px;margin-bottom:14px;flex-wrap:wrap}
.case-client{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--case-card-client);margin-bottom:8px}
.case-unit-tag{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:3px 8px;border-radius:3px}
.case-unit-tag.growth{background:rgba(232,91,158,.1);color:var(--growth);border:1px solid rgba(232,91,158,.18)}
.case-unit-tag.innovation{background:rgba(34,182,230,.08);color:var(--innovation);border:1px solid rgba(34,182,230,.15)}
.case-unit-tag.learn{background:rgba(242,131,63,.08);color:var(--learn);border:1px solid rgba(242,131,63,.16)}
.case-industry-tag{
  font-size:8.5px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;
  color:var(--case-card-industry-text);background:var(--case-card-industry-bg);
  border:1px solid var(--b1);border-radius:3px;padding:3px 8px;
}
.case-h{font-family:var(--display);font-size:clamp(16px,1.3vw,20px);font-weight:700;letter-spacing:-.025em;color:var(--case-card-title);line-height:1.15;margin-bottom:10px}
.case-excerpt{
  font-size:14px;color:var(--case-card-text);line-height:1.65;margin-bottom:18px;flex:1;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden;
}
.case-link{
  font-size:11.5px;font-weight:600;
  display:inline-flex;align-items:center;gap:5px;
  margin-top:auto;transition:color .15s,gap .15s;color:var(--case-card-link);
}
.case-card[data-unit="growth"]:hover .case-link{color:var(--growth);gap:8px}
.case-card[data-unit="innovation"]:hover .case-link{color:var(--innovation);gap:8px}
.case-card[data-unit="learn"]:hover .case-link{color:#F2833F;gap:8px}
.case-image-metric--private{grid-template-columns:1fr}
.case-image-metric--private .case-image-num{display:none}
.case-image-metric--private .case-image-label{max-width:100%}

/* ── PAGINATION ── */
/* Filter transition */
#cases{transition:opacity .2s ease}
.cases-filtering{opacity:0}

/* ── EMPTY STATE ── */
.cases-empty{padding:80px 56px 120px;display:flex;justify-content:center}
.cases-empty-inner{max-width:380px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:16px}
.cases-empty-icon{
  width:56px;height:56px;border-radius:12px;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);
  display:flex;align-items:center;justify-content:center;color:var(--dim);
}
.cases-empty-title{font-family:var(--display);font-size:18px;font-weight:700;letter-spacing:-.025em;color:var(--n0)}
.cases-empty-sub{font-size:15px;color:var(--dim);line-height:1.7}

/* ── RESPONSIVE ── */
@media(max-width:1024px){
  .filter-inner,.cases-wrap{padding:0 32px}
  .filter-facets{gap:8px}
  .cases-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:720px){
  .filter-inner{padding:0 20px;gap:12px;align-items:flex-start;flex-direction:column}
  .filter-facets{width:100%;justify-content:space-between}
  .cases-wrap{padding:0 20px}
  .cases-grid{grid-template-columns:1fr}
  .cases-empty{padding:56px 20px 80px}
}