/* WSPÓLNE style stron case study / portfolio */
picture{display:contents}
@media (max-width:900px){.cta .panel{min-height:500px;padding:72px 22px 120px;border-radius:26px} .cta-row::before{display:none} .cta-row{justify-content:center} .cta-orb{width:300px!important;height:300px!important}}
@media (prefers-reduced-motion:reduce){.cta-ball{animation:none}}
.client-logo{display:block;margin-bottom:40px}
.client-logo img{display:block;max-height:150px;max-width:min(420px,80vw);width:auto;height:auto;filter:drop-shadow(0 12px 40px rgba(89,190,152,.35))}
.mission{margin:28px auto 0;max-width:38em;font-size:clamp(16px,1.5vw,18px);font-weight:400;line-height:1.7;color:#b9bcc6}
.meta .tags{max-height:none}
.intro{padding:240px 0 176px}
.copy .ask{color:#fff;font-weight:600;font-size:19px;margin-top:28px}
.copy .actions{margin-top:20px}
.stage.s2::before{background:radial-gradient(circle at 60% 40%,rgba(155,41,174,.55),rgba(28,63,114,.5) 55%,rgba(89,190,152,.32) 75%,transparent 80%)}
.shot{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 0%;animation:pan 16s ease-in-out infinite alternate}
@keyframes pan{from{object-position:50% 0%}to{object-position:50% 100%}}
.phone-wrap{position:relative;z-index:1;width:290px;max-width:100%;animation:floaty 7s ease-in-out infinite alternate}
.phone{position:relative;width:100%;aspect-ratio:9/19;border-radius:48px;padding:12px;background:linear-gradient(145deg,#3b3e47,#0f1015);transform:perspective(1300px) rotateY(-9deg) rotateX(3deg); box-shadow:inset 0 0 0 2px rgba(255,255,255,.16),0 60px 100px -34px rgba(0,0,0,.95),0 0 100px -24px rgba(58,141,159,.6)}
.phone::before,.phone::after{content:"";position:absolute;width:3px;border-radius:2px;background:#2b2d35}
.phone::before{left:-3px;top:22%;height:52px}
.phone::after{right:-3px;top:28%;height:72px}
.screen{position:absolute;inset:12px;border-radius:38px;overflow:hidden;background:#05060a}
.screen::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.16) 48%,transparent 60%);background-size:260% 100%;animation:glare 7s ease-in-out infinite}
@keyframes glare{from{background-position:130% 0}to{background-position:-60% 0}}
.island{position:absolute;top:24px;left:50%;width:86px;height:25px;border-radius:99px;background:#000;transform:translateX(-50%);z-index:3}
.devices{position:relative;z-index:1;width:min(100%,640px);padding:0 0 12%}
.laptop{width:90%;animation:floaty 8s ease-in-out infinite alternate}
.lp-screen{position:relative;aspect-ratio:16/10;border-radius:18px 18px 0 0;border:10px solid #1a1c22;border-bottom-width:14px;background:#05060a;overflow:hidden;box-shadow:0 40px 90px -30px rgba(0,0,0,.9),0 0 90px -30px rgba(155,41,174,.5)}
.tablet{position:absolute;right:-2%;bottom:0;width:46%;aspect-ratio:4/3;border-radius:22px;border:9px solid #1a1c22;background:#05060a;overflow:hidden;rotate:-3deg;animation:floaty 6s ease-in-out infinite alternate;animation-delay:-2s; box-shadow:0 40px 80px -24px rgba(0,0,0,.95),0 0 70px -20px rgba(58,141,159,.6)}
.tablet .shot{animation-duration:12s}
.tablet::after{content:"";position:absolute;left:50%;top:5px;width:6px;height:6px;margin-left:-3px;border-radius:50%;background:#2e3038;z-index:3}
.fchip.f1{left:0;top:14%}
.fchip.f2{right:0;top:44%;animation-delay:-2s}
.fchip.f2::before{background:linear-gradient(135deg,var(--purple),var(--teal))}
.fchip.f3{left:2%;bottom:12%;animation-delay:-4s}
.fchip.sync svg{width:18px;height:18px;animation:swapx 2.4s ease-in-out infinite}
@keyframes swapx{50%{transform:translateX(4px)}}
.reveal .phone-wrap,.reveal .laptop,.reveal .tablet{opacity:0;transition:opacity .9s,translate .9s cubic-bezier(.2,.7,.2,1);translate:0 40px}
.reveal .tablet{transition-delay:.35s;translate:40px 40px}
.reveal.in .phone-wrap,.reveal.in .laptop,.reveal.in .tablet{opacity:1;translate:0 0}
.meta-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:72px;margin-bottom:56px;width:100%;text-align:left}
.meta{padding:16px 20px;border-radius:20px;border:1px solid rgba(255,255,255,.14);background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.02));-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.meta small{display:block;font-size:12px;letter-spacing:.04em;color:#9aa0ab;margin-bottom:6px}