.ni-work-showcase{position:relative;overflow:hidden;padding:88px 0 92px;background:radial-gradient(circle at 50% 18%, rgba(25,181,241,.05), transparent 24%),radial-gradient(circle at 72% 82%, rgba(235,75,63,.04), transparent 20%),linear-gradient(180deg,#070910 0%,#0b0f18 55%,#101522 100%);color:#eef2f8}
.ni-work-showcase *{box-sizing:border-box}.ni-work-showcase button{font:inherit;color:inherit}
.ni-work-particles,.ni-work-bgfx{position:absolute;inset:0;z-index:0;pointer-events:none}.ni-work-bgfx{overflow:hidden}
.ni-work-orb{position:absolute;border-radius:50%;filter:blur(70px);opacity:.5;animation:niWorkFloat 10s ease-in-out infinite}
.ni-work-orb-1{width:280px;height:280px;left:-60px;top:80px;background:rgba(25,181,241,.12)}
.ni-work-orb-2{width:320px;height:320px;right:-90px;bottom:40px;background:rgba(235,75,63,.1);animation-delay:-4s}
.ni-work-gridlines{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);background-size:70px 70px;mask-image:radial-gradient(circle at center, rgba(0,0,0,.8), transparent 78%);-webkit-mask-image:radial-gradient(circle at center, rgba(0,0,0,.8), transparent 78%);opacity:.32}
.ni-work-spotlight{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);width:780px;height:420px;border-radius:50%;background:radial-gradient(circle, rgba(255,255,255,.05), rgba(255,255,255,0) 68%);filter:blur(24px)}
.ni-work-container,.ni-work-header,.ni-work-grid,.ni-work-stageword{position:relative;z-index:2}
.ni-work-container{width:min(1280px, calc(100% - 48px));margin:0 auto}
.ni-work-header{max-width:950px;margin-bottom:28px;z-index:3}
.ni-work-eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.28em;color:#19b5f1;margin-bottom:12px}
.ni-work-title{font-size:clamp(24px,2.1vw,38px);line-height:1.14;margin:0;color:#eef2f8;text-wrap:balance}
.ni-work-stageword{position:absolute;left:50%;top:58%;transform:translate(-50%,-50%);font-size:clamp(86px,17vw,220px);line-height:.85;font-weight:800;letter-spacing:-.06em;color:rgba(255,255,255,.02);-webkit-text-stroke:1px rgba(14,19,34,.82);white-space:nowrap;pointer-events:none;user-select:none;transition:opacity .35s ease,transform .35s ease;text-transform:uppercase}
.ni-work-grid{display:grid;grid-template-columns:.95fr 1.1fr .9fr;gap:34px;align-items:center}
.ni-work-list{display:grid;gap:12px;z-index:3}
.ni-work-item{border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg, rgba(255,255,255,.032), rgba(255,255,255,.018));color:rgba(236,241,248,.88);padding:16px 18px;text-align:left;border-radius:16px;transition:transform .3s ease,background .3s ease,border-color .3s ease,box-shadow .3s ease,color .3s ease;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.02)}
.ni-work-item small{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.22em;color:#19b5f1;margin-bottom:6px}
.ni-work-item strong{display:block;font-size:16px;line-height:1.35}
.ni-work-item:hover,.ni-work-item.active{transform:translateY(-1px);color:#fff;background:linear-gradient(180deg, rgba(255,255,255,.065), rgba(255,255,255,.03));border-color:rgba(25,181,241,.26);box-shadow:0 12px 28px rgba(0,0,0,.16),0 0 0 1px rgba(25,181,241,.05) inset}
.ni-work-visual-wrap{z-index:3;display:flex;justify-content:center}
.ni-work-visual{width:min(520px,100%);aspect-ratio:4/4.4;border-radius:28px;position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.08);background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));box-shadow:0 22px 44px rgba(0,0,0,.16);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.ni-work-mock{position:absolute;inset:18px;border-radius:22px;overflow:hidden;background:linear-gradient(135deg,#111827 0%,#1f2937 100%);transition:transform .45s ease,opacity .35s ease}
.ni-work-mock::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.01)),radial-gradient(circle at 20% 20%, rgba(25,181,241,.18), transparent 28%),radial-gradient(circle at 80% 75%, rgba(235,75,63,.14), transparent 26%);pointer-events:none}
.ni-work-browserbar{height:44px;display:flex;align-items:center;gap:8px;padding:0 16px;border-bottom:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.03)}
.ni-work-browserbar span{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.18)}
.ni-work-canvas{height:calc(100% - 44px);padding:24px;display:flex;flex-direction:column;justify-content:space-between}
.ni-work-canvas-top{max-width:78%}.ni-work-canvas-kicker{font-size:11px;text-transform:uppercase;letter-spacing:.24em;color:#19b5f1;margin-bottom:12px}
.ni-work-canvas-title{font-size:clamp(24px,2.4vw,36px);line-height:1.05;margin:0 0 12px;color:#fff}
.ni-work-canvas-desc{font-size:14px;line-height:1.7;color:rgba(240,244,250,.78);margin:0}
.ni-work-canvas-bottom{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.ni-work-mini{border-radius:16px;min-height:90px;background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.08)}
.ni-work-detail{z-index:3;padding:28px;border-radius:28px;background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.025));border:1px solid rgba(255,255,255,.08);box-shadow:0 20px 42px rgba(0,0,0,.14);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.ni-work-detail-label{font-size:11px;text-transform:uppercase;letter-spacing:.24em;color:#19b5f1;margin-bottom:12px}
.ni-work-detail h3{margin:0 0 12px;font-size:clamp(24px,2vw,34px);line-height:1.06;color:#f4f7fb}
.ni-work-detail p{margin:0 0 18px;color:rgba(235,241,248,.78);font-size:15px;line-height:1.78}
.ni-work-tags{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px}
.ni-work-tags span{padding:10px 14px;border-radius:999px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);font-size:13px;color:rgba(245,247,251,.9)}
.ni-work-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.ni-work-metric{padding:14px 16px;border-radius:18px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.06)}
.ni-work-metric strong{display:block;font-size:22px;line-height:1;margin-bottom:6px;color:#fff}
.ni-work-metric span{font-size:12px;text-transform:uppercase;letter-spacing:.18em;color:rgba(235,241,248,.62)}
@keyframes niWorkFloat{0%{transform:translateY(0) scale(1)}50%{transform:translateY(-18px) scale(1.04)}100%{transform:translateY(0) scale(1)}}
@media (max-width:1100px){.ni-work-grid{grid-template-columns:1fr;gap:28px}.ni-work-stageword{top:26%;font-size:clamp(70px,16vw,180px)}.ni-work-visual-wrap{order:2}.ni-work-detail{order:3}}
@media (max-width:767px){.ni-work-showcase{padding:64px 0 72px}.ni-work-container{width:min(100% - 32px,1280px)}.ni-work-title{font-size:clamp(22px,7vw,32px);line-height:1.16}.ni-work-stageword{top:22%}.ni-work-canvas{padding:18px}.ni-work-canvas-top{max-width:100%}.ni-work-canvas-bottom{grid-template-columns:1fr 1fr}.ni-work-detail{padding:24px}}

.ni-work-item{display:block;position:relative;text-decoration:none}
.ni-work-item::after{
  content:'↗';
  position:absolute;
  right:16px;
  top:50%;
  transform:translateY(-50%);
  font-size:14px;
  opacity:.45;
  transition:opacity .3s ease,transform .3s ease;
}
.ni-work-item:hover::after,
.ni-work-item.active::after{
  opacity:.85;
  transform:translateY(-50%) translateX(2px);
}

.ni-work-canvas-bottom{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  align-items:stretch;
}
.ni-work-thumb,
.ni-work-mini{
  min-height:92px;
  border-radius:18px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015));
}
.ni-work-thumb{
  padding:0;
  cursor:pointer;
  position:relative;
  box-shadow:0 12px 24px rgba(0,0,0,.14);
  transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease;
}
.ni-work-thumb:hover{
  transform:translateY(-2px);
  border-color:rgba(25,181,241,.26);
  box-shadow:0 16px 30px rgba(0,0,0,.22);
}
.ni-work-thumb img{
  display:block;
  width:100%;
  height:100%;
  min-height:92px;
  object-fit:cover;
  object-position:center;
}
.ni-work-canvas-bottom.has-1{
  grid-template-columns:1fr;
}
.ni-work-canvas-bottom.has-1 .ni-work-thumb img{
  min-height:132px;
}
.ni-work-canvas-bottom.has-2{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.ni-work-canvas-bottom.has-2 .ni-work-thumb img{
  min-height:110px;
}

.ni-work-lightbox{
  position:fixed;
  inset:0;
  background:rgba(6,7,11,.88);
  display:flex;
  align-items:center;
  justify-content:center;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  z-index:10000;
  transition:opacity .3s ease,visibility .3s ease;
  padding:34px;
}
.ni-work-lightbox.open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
.ni-work-lightbox img{
  max-width:min(1100px,92vw);
  max-height:86vh;
  border-radius:20px;
  display:block;
  box-shadow:0 25px 60px rgba(0,0,0,.4);
}
.ni-work-lightbox-close{
  position:absolute;
  top:18px;
  right:22px;
  width:46px;
  height:46px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.15);
  background:rgba(255,255,255,.08);
  color:#fff;
  font-size:30px;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
}

@media (max-width:767px){
  .ni-work-canvas-bottom{gap:10px}
  .ni-work-thumb,.ni-work-mini{min-height:78px}
  .ni-work-thumb img{min-height:78px}
}

.ni-work-bottom{display:flex;justify-content:center;margin-top:34px;position:relative;z-index:3}
.ni-work-viewall{display:inline-flex;align-items:center;justify-content:center;min-width:175px;padding:15px 22px;border-radius:999px;border:1px solid rgba(25,181,241,.24);background:rgba(255,255,255,.045);color:#eef2f8;text-decoration:none;transition:transform .3s ease,border-color .3s ease,background .3s ease}
.ni-work-viewall:hover{transform:translateY(-2px);border-color:rgba(25,181,241,.44);background:rgba(25,181,241,.10)}