.case-identity{position:relative;isolation:isolate;display:block;min-height:236px;margin:28px 0 34px;padding:23px 24px 25px;border:1px solid rgba(120,180,135,.22);border-radius:3px;background:linear-gradient(112deg,rgba(63,174,104,.105),rgba(255,255,255,.018) 62%,rgba(255,255,255,.005));overflow:hidden}
.case-identity::before{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(7,9,7,.08),transparent 57%,rgba(63,174,104,.055));content:"";pointer-events:none}
.case-identity::after{position:absolute;bottom:-1px;left:24px;width:58px;height:2px;background:linear-gradient(90deg,#55bf79,rgba(85,191,121,0));content:""}
.case-identity-copy{position:relative;z-index:2;max-width:calc(100% - 108px)}
.case-identity-copy::before{display:none;width:min(210px,100%);height:44px;margin:0 0 13px;background-position:left center;background-repeat:no-repeat;background-size:contain;content:""}
.case-identity[aria-label="Outlaw client case study"] .case-identity-copy::before{display:block;background-color:#f0f4f1;background-image:url("01-outlaw.png");background-position:center;border-radius:2px}
.case-identity[aria-label="Cave Tools client case study"] .case-identity-copy::before{display:block;background-image:url("02-cave-tools.png")}
.case-identity[aria-label="Viahart client case study"] .case-identity-copy::before{display:block;background-image:url("03-viahart.png")}
.case-identity[aria-label="MedCore client case study"] .case-identity-copy::before{display:block;background-image:url("04-medcore.jpg")}
.case-identity[aria-label="Flowdesk client case study"] .case-identity-copy::before{display:block;background-image:url("05-flowdesk.png")}
.case-identity[aria-label="VitaLab client case study"] .case-identity-copy::before{display:block;background-image:url("06-vitalab.png")}
.case-identity[aria-label="BuildRight client case study"] .case-identity-copy::before{display:block;background-image:url("07-buildright.png")}
.case-identity[aria-label="SkinTheory client case study"] .case-identity-copy::before{display:block;background-color:#f0f4f1;background-image:url("08-skintheory.webp");background-position:center;border-radius:2px}
.case-identity-label{display:block;color:rgba(169,224,184,.68);font-size:9px;font-weight:800;letter-spacing:.19em;line-height:1;text-transform:uppercase;white-space:nowrap}
.detail-intro .case-identity-name{display:block;margin:15px 0 18px;color:#e5eee7;font:700 clamp(40px,4.7vw,64px)/.94 "Manrope",Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;letter-spacing:-.065em;text-align:left}
.case-identity-meta{display:grid;gap:10px;max-width:520px}
.case-identity-industry,.case-identity-services{color:#c5d5ca;font-size:12px;line-height:1.45}
.case-identity-industry{letter-spacing:.01em}
.case-identity-services{color:#9eafa4}
.case-identity-services-label{display:block;margin-bottom:4px;color:var(--g);font-size:9px;font-weight:800;letter-spacing:.18em;line-height:1;text-transform:uppercase}
.case-identity-services-list{display:block}
.case-signal{position:absolute;top:0;right:0;z-index:1;width:43%;height:100%;min-width:168px;max-width:292px;opacity:.58;background-image:linear-gradient(rgba(120,180,135,.13) 1px,transparent 1px),linear-gradient(90deg,rgba(120,180,135,.13) 1px,transparent 1px);background-position:center;background-size:25px 25px;mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.78) 28%,#000 78%);-webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.78) 28%,#000 78%);pointer-events:none}
.case-signal::before{position:absolute;top:-22%;right:-15%;width:86%;aspect-ratio:1;border:1px solid rgba(85,191,121,.38);border-radius:50%;box-shadow:0 0 0 15px rgba(63,174,104,.035),0 0 0 31px rgba(63,174,104,.025);content:""}
.case-signal::after{position:absolute;top:55%;left:18%;width:69%;height:1px;background:linear-gradient(90deg,transparent,rgba(85,191,121,.7) 24%,rgba(85,191,121,.18));box-shadow:0 16px 0 rgba(120,180,135,.19);content:"";transform:rotate(-21deg);transform-origin:left center}
.case-signal-node{position:absolute;width:5px;height:5px;border:1px solid rgba(160,232,183,.82);border-radius:50%;background:var(--g);box-shadow:0 0 0 4px rgba(63,174,104,.08),0 0 12px rgba(63,174,104,.42)}
.case-signal-node:nth-child(1){top:31%;left:31%}
.case-signal-node:nth-child(2){top:59%;left:72%}
.case-signal-node:nth-child(3){top:78%;left:43%;width:4px;height:4px}
.case-signal-trace{position:absolute;top:26%;right:14%;width:39%;height:34%;border-top:1px solid rgba(120,180,135,.38);border-right:1px solid rgba(120,180,135,.38);transform:skewY(-24deg) rotate(11deg)}
.case-signal--cave-tools::before{border-radius:20%;transform:rotate(33deg) scale(.82)}
.case-signal--outlaw .case-signal-trace{top:30%;right:18%;transform:skewY(-14deg) rotate(21deg)}
.case-signal--viahart::before{top:-31%;right:-4%;border-radius:42% 58% 48% 52%;transform:rotate(-18deg) scale(.92)}
.case-signal--medcore::after{top:43%;transform:rotate(19deg)}
.case-signal--flowdesk::before{top:-8%;right:-23%;border-radius:8%;transform:rotate(45deg) scale(.8)}
.case-signal--vitalab::after{top:63%;left:8%;width:86%;transform:rotate(-8deg)}
.case-signal--buildright .case-signal-trace{transform:skewY(25deg) rotate(-18deg)}
.case-signal--skintheory::before{border-radius:50% 32% 56% 38%;transform:rotate(16deg) scale(.88)}
.detail-block:has(> .case-results){position:relative;margin-bottom:62px;padding:38px 34px 36px;border:1px solid rgba(120,180,135,.24);border-radius:4px;background:linear-gradient(135deg,rgba(63,174,104,.09),rgba(255,255,255,.018) 48%,rgba(7,9,7,.3));overflow:hidden}
.detail-block:has(> .case-results)::before{position:absolute;top:0;bottom:0;left:0;width:3px;background:linear-gradient(180deg,var(--g),rgba(63,174,104,.08) 76%,transparent);content:""}
.detail-block:has(> .case-results)::after{position:absolute;top:-130px;right:-90px;width:320px;height:320px;border:1px solid rgba(85,191,121,.11);border-radius:50%;box-shadow:0 0 0 20px rgba(63,174,104,.018),0 0 0 52px rgba(63,174,104,.012);content:"";pointer-events:none}
.detail-block:has(> .case-results)>h2{position:relative;z-index:1;margin-bottom:13px;color:#edf5ef;font-size:clamp(34px,4vw,54px);letter-spacing:-.06em}
.detail-block:has(> .case-results)>h2::after{display:block;width:40px;height:2px;margin-top:18px;background:linear-gradient(90deg,var(--g),rgba(63,174,104,0));content:""}
.detail-block:has(> .case-results)>p{position:relative;z-index:1;max-width:600px;margin:0;color:#aebdb3;font-size:14px;line-height:1.55}
.detail-block:has(> .case-results)>.case-results+p{margin-top:22px}
.case-results{position:relative;z-index:1;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:30px;border:0;border-radius:0;overflow:visible;background:transparent}
.case-result{position:relative;display:flex;min-width:0;min-height:154px;flex-direction:column;justify-content:space-between;border:1px solid rgba(120,180,135,.2);border-radius:3px;padding:24px 22px 21px;background:linear-gradient(145deg,rgba(63,174,104,.105),rgba(255,255,255,.012) 72%);transition:background .3s ease,border-color .3s ease,transform .3s ease}
.case-result::before{position:absolute;top:-1px;left:20px;width:28px;height:2px;background:linear-gradient(90deg,var(--g),rgba(85,191,121,0));content:""}
.case-result:hover{border-color:rgba(85,191,121,.48);background:linear-gradient(145deg,rgba(63,174,104,.17),rgba(255,255,255,.02));transform:translateY(-2px)}
.case-result b{display:block;color:#b9edc8;font:800 clamp(38px,4vw,58px)/.92 "Manrope",Inter,ui-sans-serif,system-ui,sans-serif;letter-spacing:-.07em;white-space:nowrap}
.case-result span{display:block;max-width:22ch;margin-top:22px;color:#a7b6ac;font-size:11px;line-height:1.45}

@media(max-width:760px){
  .case-identity{min-height:220px;margin:22px 0 30px;padding:20px 16px 23px}
  .case-identity::after{left:16px}
  .case-identity-copy{max-width:100%}
  .case-identity-copy::before{width:min(190px,100%);height:40px;margin-bottom:12px}
  .detail-intro .case-identity-name{margin:14px 0 19px;font-size:clamp(39px,12vw,56px);letter-spacing:-.06em}
  .case-identity-industry,.case-identity-services{max-width:100%;font-size:11px}
  .case-identity-services-label{margin-bottom:6px}
  .case-signal{right:-30px;width:58%;min-width:150px;opacity:.34}
    .detail-block:has(> .case-results){margin-bottom:44px;padding:28px 18px 23px}
  .detail-block:has(> .case-results)::after{top:-95px;right:-115px;width:240px;height:240px}
  .detail-block:has(> .case-results)>h2{font-size:33px}
  .detail-block:has(> .case-results)>h2::after{margin-top:15px}
  .case-results{grid-template-columns:1fr;gap:9px;margin-top:25px}
  .case-result{min-height:128px;padding:21px 18px 18px}
  .case-result b{font-size:clamp(38px,12vw,48px)}
  .case-result span{max-width:30ch;margin-top:18px;font-size:11px}
}

/* Keep legacy bullet-based strategy content in the same numbered system as Viahart. */
.detail-block > ul{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  margin:30px 0 0;
  padding:0;
  color:var(--muted);
  list-style:none;
  counter-reset:case-step;
  max-width:none;
}
.detail-block > ul li{
  position:relative;
  margin:0;
  padding:24px 0 6px;
  border-top:1px solid var(--line);
  color:var(--muted);
  font-size:14px;
}
.detail-block > ul li::before{
  display:block;
  margin-bottom:12px;
  color:var(--g);
  content:counter(case-step,decimal-leading-zero) ".";
  counter-increment:case-step;
  font:800 11px/1 "Manrope",sans-serif;
  letter-spacing:.12em;
}
.detail-block > ul li strong{
  display:block;
  margin-bottom:10px;
  color:#dbe6de;
  font:700 22px/1.1 "Manrope",Inter,ui-sans-serif,system-ui,sans-serif;
  letter-spacing:-.025em;
}
@media(max-width:760px){
  .detail-block > ul{grid-template-columns:1fr;gap:28px;margin-top:30px}
}
/* Case study listing cards — logo + result metrics */
.case-card{display:flex;flex-direction:column;will-change:transform}
.case-card-media{position:relative;display:flex;align-items:center;justify-content:center;height:120px;margin-bottom:18px;padding:18px 22px;border:1px solid rgba(120,180,135,.2);border-radius:6px;background:linear-gradient(150deg,rgba(63,174,104,.1),rgba(255,255,255,.014) 70%);overflow:hidden;transition:border-color .35s ease,background .35s ease}
.case-card-media::before{position:absolute;top:-1px;left:22px;width:34px;height:2px;background:linear-gradient(90deg,var(--g),rgba(85,191,121,0));content:""}
.case-card-media--light{border-color:rgba(120,180,135,.26);background:linear-gradient(150deg,#f4f7f4,#e8efe9)}
.case-card-media--square{padding:8px 22px}

.case-card-top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}
.case-card .service-number{margin-bottom:0}
.case-card-logo{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;opacity:.95;transition:opacity .35s ease,transform .35s ease}
.case-card:hover .case-card-media{border-color:rgba(85,191,121,.4);background:linear-gradient(150deg,rgba(63,174,104,.16),rgba(255,255,255,.02) 70%)}
.case-card:hover .case-card-media--light{background:linear-gradient(150deg,#fff,#eaf1eb)}
.case-card:hover .case-card-logo{opacity:1;transform:scale(1.025)}
.case-card p{flex:0 0 auto}
.case-card-metrics{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:auto;padding-top:22px}
.case-metric{position:relative;display:block;min-width:0;padding:13px 14px 12px;border:1px solid rgba(120,180,135,.18);border-radius:6px;background:linear-gradient(150deg,rgba(63,174,104,.07),rgba(255,255,255,.012) 70%);transition:border-color .35s ease,background .35s ease}
.case-metric::before{position:absolute;top:-1px;left:12px;width:20px;height:2px;background:linear-gradient(90deg,var(--g),rgba(85,191,121,0));content:""}
.case-metric b{display:block;color:#b9edc8;font:800 clamp(21px,1.9vw,26px)/1 "Manrope",Inter,ui-sans-serif,system-ui,sans-serif;letter-spacing:-.03em;white-space:nowrap}
.case-metric span{display:block;margin-top:6px;color:#93a49a;font-size:10px;font-weight:600;line-height:1.35;letter-spacing:.02em}
.case-metric--main{border-color:rgba(85,191,121,.34);background:linear-gradient(150deg,rgba(63,174,104,.14),rgba(255,255,255,.016) 70%)}
.case-metric--main b{color:#cdf3d8;font-size:clamp(26px,2.4vw,32px)}
.case-card:hover .case-metric{border-color:rgba(85,191,121,.4)}
.case-card:hover .case-metric--main{background:linear-gradient(150deg,rgba(63,174,104,.2),rgba(255,255,255,.02) 70%)}
.case-card .service-arrow{margin-top:18px}
@media (hover:none){.case-card-logo{opacity:1}}
@media(max-width:760px){.case-card-media{height:100px;margin-bottom:16px;padding:16px 18px}.case-card-top{margin-bottom:14px}.case-card-metrics{grid-template-columns:1fr 1fr;gap:8px}.case-metric b{font-size:20px}.case-metric--main b{font-size:24px}}