.cases-page {
  background:
    radial-gradient(ellipse 65% 38% at 52% -5%, rgba(107,146,201, .15), transparent 72%),
    radial-gradient(ellipse 42% 28% at 100% 25%, rgba(var(--teal-rgb), .08), transparent 72%),
    var(--ink);
}

.cases-page .nav-cases {
  border: 1px solid rgba(var(--teal-rgb), .35);
  background: rgba(var(--teal-rgb), .1);
  color: #effff9;
}

.cases-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(330px, .62fr);
  gap: clamp(48px, 9vw, 145px);
  align-items: center;
  min-height: min(680px, calc(100vh - 88px));
  padding: clamp(79px, 11vw, 145px) 0 clamp(82px, 10vw, 128px);
}

.cases-hero-copy { max-width: 735px; }
.cases-hero h1 { max-width: 720px; margin: 0; color: #f4f6f3; font: 500 clamp(3.35rem, 6.25vw, 6.45rem)/.9 var(--headline); letter-spacing: -.09em; }
.cases-hero h1 em { color: var(--teal); font-style: normal; }
.cases-lede { max-width: 620px; margin: 28px 0 0; color: #b3bdc5; font-size: clamp(1rem, 1.45vw, 1.16rem); font-weight: 500; line-height: 1.72; }
.cases-hero .hero-actions { margin-top: 34px; }

.honesty-card {
  position: relative;
  display: grid;
  gap: 18px;
  max-width: 430px;
  padding: clamp(23px, 3vw, 34px);
  overflow: hidden;
  border: 1px solid rgba(var(--slate-rgb),.3);
  border-radius: 22px;
  background:
    radial-gradient(circle at 90% 8%, rgba(var(--accent-rgb),.14), transparent 26%),
    linear-gradient(145deg, rgba(37,55,81,.92), rgba(24,39,59,.97));
  box-shadow: 0 28px 52px rgba(0,0,0,.25), inset 0 1px rgba(255,255,255,.07);
}

.honesty-card::after { position: absolute; right: -30px; bottom: -43px; width: 148px; aspect-ratio: 1; border: 1px dashed rgba(var(--accent-rgb),.25); border-radius: 50%; content: ""; }
.honesty-card-label { position: relative; z-index: 1; color: var(--accent); font: .55rem/1 var(--mono); letter-spacing: .06em; }
.honesty-card h2 { position: relative; z-index: 1; max-width: 350px; margin: 0; color: #f8f8fc; font: 500 clamp(1.75rem, 3vw, 2.6rem)/.98 var(--headline); letter-spacing: -.07em; }
.honesty-card > p { position: relative; z-index: 1; max-width: 365px; margin: 0; color: #b5b8c7; font-size: .8rem; font-weight: 500; line-height: 1.66; }
.honesty-card-foot { position: relative; z-index: 1; display: flex; align-items: center; gap: 10px; padding-top: 15px; border-top: 1px solid rgba(255,255,255,.12); }.honesty-card-foot > span { color: var(--teal); font: .58rem/1 var(--mono); }.honesty-card-foot p { margin: 0; color: #d7dcda; font: .61rem/1.4 var(--mono); }.honesty-card-foot i { margin: 0 4px; color: var(--accent); font-style: normal; }

.project-section { padding: clamp(80px, 10vw, 130px) 0; scroll-margin-top: 85px; border-top: 1px solid rgba(255,255,255,.1); background: radial-gradient(ellipse 60% 42% at 100% 0%, rgba(var(--teal-rgb),.08), transparent 72%), #142338; }
.project-heading { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(250px, .65fr); gap: clamp(30px, 7vw, 95px); align-items: end; }
.project-heading h2 { max-width: 750px; margin: 0; color: #f1f5f2; font: 500 clamp(2.7rem, 5vw, 5rem)/.94 var(--headline); letter-spacing: -.075em; }
.project-heading h2 em { color: var(--accent); font-style: normal; }
.project-heading > p { max-width: 430px; margin: 0 0 5px; color: #a9b8be; font-size: .9rem; font-weight: 500; line-height: 1.7; }
.project-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; margin: 45px 0 23px; }
.project-filter { min-height: 38px; padding: 0 15px; border: 1px solid rgba(183,202,206,.23); border-radius: 999px; background: rgba(255,255,255,.025); color: #becbd0; font: 600 .67rem/1 var(--mono); cursor: pointer; transition: color 180ms ease, border-color 180ms ease, background 180ms ease; }
.project-filter:hover,.project-filter:focus-visible { border-color: var(--teal); color: #fff; outline: none; }
.project-filter.is-active { border-color: rgba(var(--accent-rgb), .45); background: var(--action); color: var(--on-action); }
.project-count { margin-left: auto; color: #82939b; font: .6rem/1 var(--mono); }
.project-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.project-card { display: flex; min-height: 290px; flex-direction: column; padding: clamp(22px, 2.8vw, 33px); border: 1px solid rgba(188,208,211,.17); border-radius: 19px; background: linear-gradient(145deg, rgba(33,51,73,.86), rgba(24,40,59,.96)); box-shadow: inset 0 1px rgba(255,255,255,.035); }
.project-card[hidden] { display: none; }
.project-card-top { display: flex; justify-content: space-between; gap: 15px; color: var(--teal); font: 500 .54rem/1.3 var(--mono); letter-spacing: .05em; }
.project-card-top b { color: #647780; font-weight: 500; }
.project-card h3 { max-width: 500px; margin: 27px 0 11px; color: #f1f5f2; font: 500 clamp(1.55rem, 2.35vw, 2.25rem)/1.04 var(--headline); letter-spacing: -.055em; }
.project-card > p { max-width: 530px; margin: 0; color: #aab9bf; font-size: .75rem; font-weight: 500; line-height: 1.65; }
.project-flow { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: auto; padding-top: 26px; color: #dbe4dc; font: .56rem/1.5 var(--mono); }
.project-flow span { padding: 7px 9px; border: 1px solid rgba(var(--teal-rgb),.19); border-radius: 7px; background: rgba(var(--teal-rgb),.065); }
.project-flow i { color: var(--accent); font-style: normal; }
.project-card-foot { display: flex; flex-wrap: wrap; gap: 8px 13px; margin-top: 20px; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.1); color: #b2c0c4; font-size: .67rem; line-height: 1.5; }
.project-card-foot small { color: var(--accent); font: .51rem/1.5 var(--mono); letter-spacing: .05em; }

.honesty-card > p,
.project-card > p { font-size: .87rem; }

.project-filter { font-size: .76rem; }
.project-card-foot { font-size: .75rem; }
.project-flow { font-size: .64rem; }
.cases-cta { position: relative; overflow: hidden; padding: clamp(75px, 10vw, 125px) 0; background: linear-gradient(125deg, #243b53, #172b40 59%, #1c3046); }.cases-cta::before { position: absolute; inset: 0; background: radial-gradient(circle at 76% 28%, rgba(var(--accent-rgb),.15), transparent 24%), linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px); background-size: auto, 46px 46px, 46px 46px; content: ""; }.cases-cta-inner { position: relative; z-index: 1; display: flex; align-items: end; justify-content: space-between; gap: 45px; }.cases-cta h2 { max-width: 790px; margin: 0; color: #f4f7f1; font: 500 clamp(2.9rem, 5.15vw, 5.15rem)/.92 var(--headline); letter-spacing: -.08em; }.cases-cta h2 em { color: var(--accent); }.cases-cta .button { flex: 0 0 auto; }

@media (max-width: 1000px) {
  .cases-hero { grid-template-columns: 1fr; gap: 42px; min-height: auto; }
  .honesty-card { max-width: 540px; }
  .project-heading { grid-template-columns: 1fr; gap: 22px; }
  .project-heading > p { max-width: 650px; }
}

@media (max-width: 700px) {
  .cases-hero { padding-top: 66px; }
  .cases-hero h1 { font-size: clamp(3rem, 13.5vw, 4.35rem); }
  .cases-lede { margin-top: 23px; font-size: .94rem; }
  .honesty-card { padding: 21px; border-radius: 18px; }
  .honesty-card h2 { font-size: 1.8rem; }
  .project-section { padding: 76px 0; }
  .project-heading h2 { font-size: clamp(2.55rem, 11.8vw, 3.42rem); }
  .project-heading > p { font-size: .82rem; }
  .project-toolbar { margin-top: 32px; }
  .project-count { flex-basis: 100%; margin: 8px 0 0; }
  .project-grid { grid-template-columns: 1fr; gap: 11px; }
  .project-card { min-height: 0; padding: 22px 19px; border-radius: 16px; }
  .project-card h3 { margin-top: 22px; font-size: 1.75rem; }
  .project-flow { margin-top: 0; padding-top: 23px; }
  .cases-cta { padding: 78px 0; }
  .cases-cta h2 { font-size: clamp(2.55rem, 11.8vw, 3.42rem); }
  .cases-cta-inner { display: grid; gap: 30px; align-items: start; }
  .cases-cta .button { width: 100%; }
}

/* Consistent vertical rhythm (matches the home page). */
.project-section,
.cases-cta { padding-top: var(--section-space); padding-bottom: var(--section-space); }
.project-toolbar { margin: var(--block-gap) 0 20px; }
.cases-hero { padding: clamp(56px, 7vw, 96px) 0 var(--section-space); min-height: 0; }