.cases-showcase {
  position: relative;
  min-height: 100svh;
  overflow: hidden;
  padding: clamp(105px, 11vh, 140px) clamp(20px, 5vw, 76px) clamp(68px, 8vh, 96px);
  isolation: isolate;
  background: #030712;
}

.cases-showcase::before { position:absolute; inset:0; z-index:-1; opacity:.28; background-image:linear-gradient(rgba(85,184,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(85,184,255,.05) 1px,transparent 1px); background-size:60px 60px; mask-image:linear-gradient(180deg,transparent,#000 20%,#000 85%,transparent); content:""; }
.cases-backdrop { position:absolute; inset:0; z-index:-2; overflow:hidden; opacity:.19; pointer-events:none; }
.cases-backdrop::after { position:absolute; inset:0; background:linear-gradient(180deg,#030712 0%,rgba(3,7,18,.55) 42%,#030712 100%),linear-gradient(90deg,#030712 5%,transparent 48%,#030712 95%); content:""; }
.cases-backdrop img { width:100%; height:100%; object-fit:cover; filter:blur(42px) saturate(1.25); transform:scale(1.15); transition:opacity .3s ease; }
.cases-inner { width:min(1460px,100%); margin:0 auto; }
.cases-heading { display:grid; grid-template-columns:1.25fr .75fr; align-items:end; gap:clamp(35px,7vw,120px); margin-bottom:clamp(34px,5vh,54px); }
.cases-kicker { display:inline-flex; align-items:center; gap:12px; margin:0 0 16px; color:rgba(185,215,239,.56); font:700 10px/1 Inter,sans-serif; letter-spacing:.2em; text-transform:uppercase; }
.cases-kicker span { display:grid; width:28px; height:28px; place-items:center; border:1px solid rgba(65,225,255,.3); border-radius:50%; color:#70ebff; letter-spacing:0; }
.cases-heading h2 { margin:0; font-size:clamp(34px,4.2vw,62px); line-height:1.1; letter-spacing:-.05em; }
.cases-heading h2 em { color:transparent; background:linear-gradient(92deg,#73eaff,#a78bfa 76%); background-clip:text; -webkit-background-clip:text; font-style:normal; }
.cases-heading>p { max-width:490px; margin:0 0 5px; color:rgba(194,216,236,.55); font-size:14px; line-height:1.85; }

.case-console { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(340px,.72fr); gap:clamp(16px,2vw,28px); min-height:520px; }
.case-feature { position:relative; min-height:520px; overflow:hidden; border:1px solid rgba(82,209,255,.23); border-radius:22px; background:#06101f; box-shadow:0 30px 100px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.09); }
.case-feature::after { position:absolute; inset:0; background:linear-gradient(180deg,transparent 35%,rgba(2,7,17,.22) 56%,rgba(2,7,17,.98) 88%),linear-gradient(90deg,rgba(23,222,255,.1),transparent 35%); content:""; pointer-events:none; }
.case-feature-media { position:absolute; inset:0; }
.case-feature-media img { width:100%; height:100%; object-fit:cover; filter:saturate(1.08) contrast(1.04) brightness(.85); transform:scale(1.02); transition:opacity .32s ease,transform 6s ease; }
.case-feature:hover .case-feature-media img { transform:scale(1.075); }
.case-hud { position:absolute; top:21px; left:22px; z-index:3; display:flex; align-items:center; gap:9px; color:rgba(202,240,255,.62); font:600 8px/1 monospace; letter-spacing:.15em; }
.case-hud i { width:6px; height:6px; border:1px solid #72efff; transform:rotate(45deg); box-shadow:0 0 10px #4ae7ff; }.case-hud i:last-child { width:55px; height:1px; border:0; transform:none; background:linear-gradient(90deg,#57eaff,transparent); }
.case-feature-copy { position:absolute; right:0; bottom:0; left:0; z-index:4; display:flex; align-items:end; justify-content:space-between; gap:30px; padding:clamp(25px,3vw,42px); }
.case-feature-main span { color:#68e9ff; font:600 9px/1 monospace; letter-spacing:.16em; }.case-feature-main h3 { margin:11px 0 9px; font-size:clamp(27px,3vw,43px); letter-spacing:-.04em; }.case-feature-main p { max-width:620px; margin:0; color:rgba(208,226,240,.62); font-size:13px; line-height:1.75; }
.case-result { flex:0 0 auto; text-align:right; }.case-result small { display:block; margin-bottom:6px; color:rgba(193,218,237,.52); font-size:11px; }.case-result strong { color:transparent; background:linear-gradient(135deg,#75efff,#a78bfa); background-clip:text; -webkit-background-clip:text; font:800 clamp(42px,5vw,70px)/.9 Inter,sans-serif; letter-spacing:-.07em; }

.case-index { position:relative; display:flex; flex-direction:column; gap:8px; padding:9px; border:1px solid rgba(132,172,226,.13); border-radius:22px; background:rgba(5,11,24,.72); backdrop-filter:blur(20px); }
.case-tab { --tab:89,222,255; position:relative; display:grid; grid-template-columns:28px 1fr auto; align-items:center; gap:12px; flex:1; min-height:70px; padding:11px 15px; overflow:hidden; border:1px solid transparent; border-radius:13px; color:inherit; background:transparent; text-align:left; cursor:pointer; transition:border-color .25s ease,background .25s ease,transform .25s ease; }
.case-tab::before { position:absolute; inset:0; opacity:0; background:linear-gradient(90deg,rgba(var(--tab),.12),transparent 70%); content:""; transition:opacity .25s ease; }
.case-tab:hover,.case-tab.is-active { transform:translateX(-5px); border-color:rgba(var(--tab),.32); background:rgba(var(--tab),.055); }.case-tab.is-active::before,.case-tab:hover::before { opacity:1; }
.case-tab>span { position:relative; color:rgba(var(--tab),.5); font:600 9px/1 monospace; }.case-tab div { position:relative; min-width:0; }.case-tab b { display:block; margin-bottom:5px; color:rgba(244,250,255,.9); font-size:14px; }.case-tab small { display:block; overflow:hidden; color:rgba(184,207,227,.45); font-size:9px; white-space:nowrap; text-overflow:ellipsis; }.case-tab em { position:relative; color:rgba(var(--tab),.68); font:700 15px/1 monospace; font-style:normal; }
.case-cycle-progress { position:absolute; right:0; bottom:-15px; left:0; height:1px; overflow:hidden; background:rgba(104,213,255,.08); }.case-cycle-progress i { display:block; width:100%; height:100%; transform-origin:left; background:linear-gradient(90deg,#45e6ff,#936dff); animation:case-progress 5.5s linear infinite; }
.case-index.is-paused .case-cycle-progress i { animation-play-state:paused; }
.cases-footer { display:flex; align-items:center; gap:20px; margin-top:30px; color:rgba(174,207,230,.34); font:600 9px/1 monospace; letter-spacing:.13em; }.cases-footer>i { flex:1; height:1px; background:linear-gradient(90deg,rgba(70,221,255,.2),transparent); }.cases-footer a { display:flex; align-items:center; gap:10px; color:rgba(218,240,252,.72); }.cases-footer a b { color:#63eaff; font-size:15px; }

@keyframes case-progress { from{transform:scaleX(0)} to{transform:scaleX(1)} }
@media (max-width:960px) { .case-console { grid-template-columns:1fr; }.case-index { display:grid; grid-template-columns:repeat(2,1fr); }.case-tab { min-height:74px; }.case-cycle-progress { bottom:-12px; }.case-feature { min-height:480px; } }
@media (max-width:720px) { .cases-showcase { padding:92px 16px 70px; }.cases-heading { grid-template-columns:1fr; gap:22px; }.cases-heading h2 br { display:none; }.case-feature,.case-console { min-height:470px; }.case-feature-copy { align-items:flex-start; flex-direction:column; gap:17px; }.case-result { text-align:left; }.case-index { grid-template-columns:1fr; }.case-tab:nth-child(n+5) { display:none; }.cases-footer>span { display:none; } }
@media (prefers-reduced-motion:reduce) { .case-cycle-progress i { animation:none; } }