.work-showcase{--work-top:100px;--work-navy:#24275f;--work-gold:#f8b331;color:var(--title-color,#24275f)}
.work-heading{max-width:800px;margin:0 auto 45px}.work-heading>span,.work-number{font-size:12px;letter-spacing:2px;font-weight:700;color:#a36b09}.work-heading h2{font-size:clamp(32px,4vw,56px);font-weight:700;margin:12px 0}.work-heading p{font-size:18px;line-height:1.6}
.work-tabs{display:flex;border-bottom:1px solid #dcddec;background:var(--white-color,#fff);margin-bottom:24px;overflow-x:auto}.work-tabs button{flex:1;white-space:nowrap;border:0;border-bottom:3px solid transparent;background:none;padding:18px 20px;color:#8589ab;font-size:18px;font-weight:600;transition:color .3s,border-color .3s}.work-tabs button[aria-selected=true]{color:var(--work-navy);border-color:var(--work-gold)}.work-tabs button:focus-visible,.work-cta:focus-visible{outline:2px solid var(--work-gold);outline-offset:-3px}
.work-panel{display:grid;grid-template-columns:.85fr 1.15fr;border:1px solid #e0e1ee;border-radius:22px;overflow:hidden;margin-bottom:24px;background:#f4f3fc}.work-story{padding:clamp(24px,3vw,48px);background:radial-gradient(ellipse at top left,#fff1ce,transparent 65%),linear-gradient(130deg,#f7f5ff,#e9eaf8);display:flex;flex-direction:column;align-items:flex-start;justify-content:center}.work-story h3{color:var(--work-navy);font-size:clamp(24px,2.6vw,40px);line-height:1.15;font-weight:700;margin:18px 0}.work-story p{color:#565d76;font-size:16px;line-height:1.6}.work-client-logos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;width:100%;margin:12px 0 20px}.work-client-logos>div{height:58px;background:#fff;border:1px solid #dedfec;border-radius:10px;padding:10px}.work-client-logos img{width:100%;height:100%;object-fit:contain}.work-cta{color:var(--work-navy);font-weight:700;display:flex;justify-content:space-between;gap:35px;border-bottom:2px solid var(--work-gold);padding:8px 0;margin-top:10px}
.work-gallery{background:radial-gradient(at 0 0,#293d78,transparent 65%),#101222;padding:22px;display:flex;flex-direction:column;justify-content:center;min-height:420px}.work-batch{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;animation:work-reveal .65s ease both}.work-batch[hidden],.work-panel[hidden]{display:none}.work-media{margin:0;min-width:0;overflow:hidden;border-radius:10px;background:#fff;box-shadow:0 10px 22px #0003;transition:transform .35s,box-shadow .35s}.work-media:hover{transform:translateY(-4px);box-shadow:0 15px 30px #0006}.work-media img,.work-media video,.work-media iframe{width:100%;height:clamp(120px,16vh,200px);object-fit:cover;display:block;border:0}.work-browser img{object-position:top}.work-media figcaption{padding:8px 10px;font-size:12px;font-weight:600;color:var(--work-navy);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.work-browser-bar{display:flex;gap:4px;padding:7px 9px;background:#eceef5}.work-browser-bar i{width:5px;height:5px;border-radius:50%;background:#f8b331}.work-browser-bar i:nth-child(2){background:#a0a8c2}.work-browser-bar i:nth-child(3){background:#626a94}.work-gallery-controls{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:14px;color:#fff;font-size:12px}.work-gallery-controls button{border:1px solid #ffffff40;border-radius:50%;background:#ffffff10;color:#fff;width:32px;height:32px}.work-empty{color:#fff;text-align:center;padding:30px}.work-empty>span{font-size:24px;font-weight:700}.work-empty p{color:#bfc5df;margin:12px 0}.work-empty a{color:var(--work-gold)}
.work-enhanced .work-panel{animation:work-reveal .5s ease both}.work-enhanced .work-scroll-track{height:calc(400vh - var(--work-top))}.work-enhanced .work-sticky{position:sticky;top:var(--work-top);padding-top:8px}.work-enhanced .work-panel{height:calc(100dvh - var(--work-top) - 110px);min-height:400px;max-height:680px}.work-enhanced .work-story{overflow:auto}.work-enhanced .work-gallery{min-height:0}.work-enhanced .work-panels{padding-bottom:20px}
@keyframes work-reveal{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:991px){.work-tabs button{font-size:14px;padding:14px}.work-panel{grid-template-columns:1fr}.work-gallery{min-height:320px}.work-heading{margin-bottom:25px}.work-media img,.work-media video,.work-media iframe{height:160px}}
@media(prefers-reduced-motion:reduce){.work-showcase *{animation:none!important;transition:none!important}}
