#cases .glow{background:radial-gradient(560px 340px at 25% 35%,rgba(255,106,43,.2),transparent 70%),radial-gradient(560px 340px at 85% 70%,rgba(111,147,191,.22),transparent 70%),radial-gradient(500px 240px at 50% 0,rgba(201,162,75,.15),transparent 70%)}
#cases .case{display:grid;grid-template-columns:1.25fr 1fr;gap:44px;align-items:center;margin-top:56px;border-radius:30px;padding:44px 46px;background:linear-gradient(180deg,rgba(22,29,40,.9),rgba(12,16,23,.9));border:1px solid var(--line);position:relative;overflow:hidden}
#cases .case::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,#5DBB63,#FFC531,#FF6A2B,#6F93BF)}
#cases .dev{position:relative;aspect-ratio:640/450;container-type:inline-size}
#cases .lap{position:absolute;left:0;top:0;width:92%}
#cases .lap .scr{border-radius:clamp(7px,2.2cqw,14px) clamp(7px,2.2cqw,14px) 0 0;border:clamp(4px,1.6cqw,10px) solid #1b222e;border-bottom-width:clamp(5px,1.9cqw,12px);background:#000;box-shadow:0 30px 80px rgba(0,0,0,.6),0 0 0 1px #2d3a50;overflow:hidden;line-height:0}
#cases .lap .scr img{width:100%;display:block}
#cases .lap .base{height:clamp(8px,2.6cqw,16px);margin:0 -4cqw;border-radius:0 0 clamp(8px,2.6cqw,16px) clamp(8px,2.6cqw,16px);background:linear-gradient(180deg,#3b4658,#1a212c);box-shadow:0 18px 40px rgba(0,0,0,.5)}
#cases .pho{position:absolute;right:0;bottom:0;width:28%;border-radius:clamp(14px,4.7cqw,30px);border:clamp(3px,1.1cqw,7px) solid #1b222e;background:#000;box-shadow:0 30px 70px rgba(0,0,0,.65),0 0 0 1px #2d3a50;overflow:hidden;line-height:0}
#cases .pho img{width:100%;display:block}
#cases .tagc{display:inline-block;font:700 16px/1 'DejaVu Sans Mono',monospace;letter-spacing:.16em;text-transform:uppercase;padding:9px 14px;border-radius:8px;color:var(--ouro-c);background:#241d0d;border:1px solid #5a4719}
#cases .case h3{font:800 44px/1.08 'Inter Display';letter-spacing:-.02em;margin-top:18px}
#cases .case p{font:400 23px/1.5 Inter;color:#D5DCE8;margin-top:16px}
#cases .chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
#cases .chips span{font:600 19px Inter;color:var(--aco-c);border:1px solid #2d4466;background:#0f1a2b;padding:9px 16px;border-radius:99px}
#cases .second{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:24px}
#cases .mini{border-radius:26px;padding:34px 36px;border:1px solid var(--line);background:linear-gradient(180deg,rgba(22,29,40,.9),rgba(12,16,23,.9))}
#cases .mini h4{font:800 34px/1.1 'Inter Display';margin-top:16px}
#cases .mini p{font:400 21px/1.5 Inter;color:#C9D2E0;margin-top:12px}
#cases .mini.next{border:2px dashed #3a4d6b;background:rgba(15,26,43,.5);display:flex;flex-direction:column;justify-content:center}
#cases .mini.next .tagc{align-self:flex-start}
#cases .mini.next .btn{margin-top:22px;font-size:22px;padding:18px 28px;align-self:flex-start}
#cases .note{margin-top:26px;text-align:center;font:500 16px/1.6 'DejaVu Sans Mono',monospace;letter-spacing:.12em;color:var(--prata);text-transform:uppercase}
#cases h2{font-size:clamp(34px,5.2vw,64px)}
#cases .sub{font-size:clamp(19px,2.4vw,27px)}
@media (max-width:1100px){#cases.sec{padding:64px 32px 72px}
#cases .case{padding:34px 30px;gap:30px}
#cases .case h3{font-size:36px}#cases .case p{font-size:20px}#cases .chips span{font-size:17px}}
@media (max-width:900px){#cases .case{grid-template-columns:1fr;margin-top:40px}
#cases .dev{max-width:640px;width:100%;margin:0 auto}}
@media (max-width:700px){#cases.sec{padding:56px 20px 64px}
#cases .case{padding:22px 18px 26px;border-radius:22px;gap:26px}
#cases .case h3{font-size:30px;margin-top:14px}
#cases .case p{font-size:18px}
#cases .chips{gap:8px;margin-top:18px}#cases .chips span{font-size:16px;padding:8px 14px}
#cases .tagc{font-size:13px;padding:8px 12px}
#cases .second{grid-template-columns:1fr;gap:18px}
#cases .mini{padding:24px 20px;border-radius:20px}
#cases .mini h4{font-size:26px}#cases .mini p{font-size:18px}
#cases .mini.next .btn{align-self:stretch;justify-content:center;font-size:20px;padding:18px 20px}
#cases .note{font-size:13px;letter-spacing:.08em}}
#cases .lap .scr img,#cases .pho img{height:auto}

#cases .second{grid-template-columns:1fr}
@media (min-width:901px){#cases .mini.next{flex-direction:row;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap}#cases .mini.next>*{margin-top:0}#cases .mini.next .btn{margin-top:0;align-self:center}#cases .mini.next h4{flex:1 1 360px}}
