/* Shared hero + CTA styles copied from services */
.page-hero { padding: 40px 0 64px; background: radial-gradient(900px 400px at 80% 0%, rgba(198,255,61,0.08), transparent 60%), linear-gradient(180deg, #080a08 0%, #050705 100%); border-bottom: 1px solid var(--ink-300); position: relative; overflow: hidden; }
.page-hero::after { content: ""; position: absolute; inset: 0; background-image: repeating-linear-gradient(-68deg, rgba(198,255,61,0.06) 0 2px, transparent 2px 16px); opacity: 0.35; pointer-events: none; }
.crumbs { display: inline-flex; gap: 10px; align-items: center; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-600); margin-bottom: 32px; }
.crumbs a:hover { color: var(--lime-500); }
.crumbs .slash { color: var(--lime-500); }
.page-hero-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 48px; align-items: end; margin-bottom: 56px; }
.page-title { font-size: clamp(48px, 7vw, 120px); line-height: 0.95; margin: 12px 0 0; letter-spacing: -0.03em; }
.page-lede { font-size: 16px; color: var(--ink-700); margin: 0; max-width: 480px; }
@media (max-width: 900px) { .page-hero-grid { grid-template-columns: 1fr; } }

.case-stats-big {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border-top: 1px solid var(--ink-400);
}
.case-stats-big > div {
  padding: 24px 20px;
  border-right: 1px solid var(--ink-400);
}
.case-stats-big > div:last-child { border-right: none; }
.big-num { font-size: 52px; color: var(--lime-500); line-height: 1; text-shadow: 0 0 20px rgba(198,255,61,0.3); }
.big-lab { font-size: 11px; letter-spacing: 0.15em; text-transform: uppercase; color: var(--ink-600); margin-top: 8px; }
@media (max-width: 700px) { .case-stats-big { grid-template-columns: 1fr 1fr; } .case-stats-big > div { border-bottom: 1px solid var(--ink-400); } }

/* Filters */
.filters { padding: 28px 0; border-bottom: 1px solid var(--ink-300); background: var(--ink-000); position: sticky; top: 68px; z-index: 10; backdrop-filter: blur(8px); }
.filter-row { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.filter-label { font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--ink-600); }
.filter-label .slash { color: var(--lime-500); }
.filter-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.f-chip { background: transparent; border: 1px solid var(--ink-400); color: var(--ink-700); padding: 8px 14px; font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; cursor: pointer; border-radius: 100px; display: inline-flex; align-items: center; gap: 8px; transition: all 0.15s; }
.f-chip:hover { color: var(--ink-900); border-color: var(--ink-500); }
.f-chip.active { background: var(--lime-500); color: #050705; border-color: var(--lime-500); font-weight: 600; }
.f-chip .dot { width: 6px; height: 6px; border-radius: 50%; box-shadow: 0 0 8px currentColor; }

/* Case grid */
.cases-full { padding: 56px 0 120px; background: var(--ink-050); }
.case-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 16px; }
@media (max-width: 900px) { .case-row { grid-template-columns: 1fr; } }

.case {
  background: var(--ink-100);
  border: 1px solid var(--ink-400);
  clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 18px 100%, 0 calc(100% - 18px));
  overflow: hidden;
  transition: transform 0.2s;
}
.case:hover { transform: translateY(-3px); }
.case.big { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1.4fr; }
@media (max-width: 900px) { .case.big { grid-template-columns: 1fr; } }

.case-hero {
  position: relative;
  background: #050705;
  padding: 32px;
  color: var(--c, var(--lime-500));
  overflow: hidden;
  min-height: 220px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.case.big .case-hero { min-height: 100%; }
.case-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(400px 300px at 80% 30%, var(--c), transparent 65%);
  opacity: 0.18;
  pointer-events: none;
}
.case-hero-mask {
  color: var(--c);
  filter: drop-shadow(0 0 24px currentColor);
  opacity: 0.85;
  display: flex;
  justify-content: center;
  padding: 24px 0;
}
.case-hero-slash {
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(-68deg, rgba(255,255,255,0.05) 0 2px, transparent 2px 14px);
  pointer-events: none;
}
.case-hero-meta {
  position: relative;
  z-index: 1;
  font-size: 10px;
  letter-spacing: 0.15em;
  color: var(--ink-700);
  text-transform: uppercase;
}
.case-hero-meta .slash { color: var(--c); }

.case-content { padding: 32px; display: flex; flex-direction: column; gap: 16px; }
.case-h { font-size: clamp(28px, 3.2vw, 44px); line-height: 1; margin: 6px 0 0; color: var(--ink-900); }
.case-h .slash { color: var(--lime-500); }
.case-sub { font-family: var(--font-mono); font-size: 13px; color: var(--lime-500); letter-spacing: 0.04em; }
.case-content p { margin: 0; color: var(--ink-800); font-size: 14.5px; line-height: 1.55; }

.case-grid-inner { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 8px; }
.col-k { font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--ink-600); margin-bottom: 8px; }
@media (max-width: 700px) { .case-grid-inner { grid-template-columns: 1fr; } }

.case-kpi {
  display: flex;
  gap: 28px;
  padding-top: 18px;
  border-top: 1px dashed var(--ink-400);
  margin-top: auto;
  flex-wrap: wrap;
}
.case-kpi > div { display: flex; flex-direction: column; gap: 2px; }
.case-kpi b { font-family: var(--font-display); font-size: 22px; color: var(--lime-500); line-height: 1; }
.case-kpi span { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-600); }
.lime { color: var(--lime-500); }

/* CTA */
.cta-section { padding: 120px 0; background: linear-gradient(180deg, #080a08 0%, #050705 100%); position: relative; overflow: hidden; text-align: center; }
.cta-section::before { content: ""; position: absolute; inset: 0; background-image: repeating-linear-gradient(-68deg, rgba(198,255,61,0.08) 0 2px, transparent 2px 18px); opacity: 0.5; }
.cta-inner { position: relative; z-index: 1; }
.cta-title { font-size: clamp(36px, 5.4vw, 72px); margin: 18px auto 32px; max-width: 1000px; line-height: 1.02; }
.cta-buttons { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }

/* Mobile */
@media (max-width: 768px) {
  .page-hero { padding: 24px 0 40px; }
  .page-title { font-size: clamp(36px, 10vw, 64px); }
  .filters { top: 65px; padding: 16px 0; }
  .filter-row { gap: 12px; }
  .cases-full { padding: 40px 0 72px; }
  .case.big { grid-template-columns: 1fr; }
  .case-h { font-size: clamp(24px, 6vw, 36px); }
  .case-hero { min-height: 160px; padding: 24px; }
  .case-content { padding: 24px; }
  .cta-section { padding: 64px 0; }
  .cta-title { font-size: clamp(28px, 8vw, 44px); }
  .cta-buttons { flex-direction: column; align-items: center; }
  .cta-buttons .btn,
  .cta-buttons .btn-ghost { width: 100%; max-width: 360px; justify-content: center; }
}
