/* NEXFIN premium visual system — additive layer, designed to sit above existing page styles. */
:root {
  --nx-accent: #75dce1;
  --nx-accent-soft: rgba(117,220,225,.16);
  --nx-glass: rgba(255,255,255,.065);
  --nx-glass-line: rgba(160,210,218,.20);
  --nx-ease: cubic-bezier(.22,.8,.25,1);
}
html { scroll-behavior: smooth; scroll-padding-top: 92px; }
body { isolation: isolate; }
::selection { background: rgba(117,220,225,.28); color: inherit; }
:focus-visible { outline: 2px solid var(--nx-accent, #75dce1); outline-offset: 3px; }

/* Subtle ambient lighting; fixed, pointer-free and inexpensive to paint. */
.nx-ambient {
  position: fixed; inset: 0; z-index: -1; pointer-events: none; overflow: hidden;
  background: radial-gradient(42rem 34rem at var(--nx-bg-x, 78%) var(--nx-bg-y, 18%), rgba(67,160,177,.075), transparent 70%);
}
.nx-ambient::before, .nx-ambient::after {
  content: ""; position: absolute; width: min(42vw, 520px); aspect-ratio: 1; border-radius: 50%;
  filter: blur(65px); opacity: .11; will-change: transform;
  background: radial-gradient(circle, #55c7d0, transparent 68%);
  animation: nx-drift 22s ease-in-out infinite alternate;
}
.nx-ambient::before { top: 12%; right: -15%; }
.nx-ambient::after { bottom: -22%; left: -17%; background: radial-gradient(circle, #b99a68, transparent 68%); animation-duration: 28s; animation-direction: alternate-reverse; }
@keyframes nx-drift { to { transform: translate3d(-22px, 26px, 0) scale(1.08); } }

/* A slim reading-progress line is also added to application pages. */
.nx-progress { position: fixed; z-index: 1002; inset: 0 0 auto; height: 2px; pointer-events: none; background: transparent; }
.nx-progress > span { display: block; width: 0; height: 100%; background: linear-gradient(90deg, #75dce1, #b7f1e8, #c6a875); box-shadow: 0 0 13px rgba(117,220,225,.65); }
.nx-cursor-glow { position: fixed; z-index: 0; width: 300px; height: 300px; border-radius: 50%; pointer-events: none; opacity: 0;
  background: radial-gradient(circle, rgba(91,201,211,.105), rgba(91,201,211,.035) 35%, transparent 70%);
  transform: translate3d(-50%,-50%,0); transition: opacity .25s ease; will-change: left, top; }
.nx-cursor-ring { position: fixed; z-index: 1001; width: 22px; height: 22px; border: 1px solid rgba(117,220,225,.48); border-radius: 50%; pointer-events: none; opacity: 0;
  transform: translate3d(-50%,-50%,0); transition: width .2s ease, height .2s ease, opacity .2s ease, border-color .2s ease; }
.nx-cursor-ring.is-hover { width: 38px; height: 38px; border-color: rgba(117,220,225,.82); }

/* Consistent page entrance and scroll reveal. Content stays visible if JS/observer is unavailable. */
html.nx-enhanced body { animation: nx-page-in .42s var(--nx-ease) both; }
@keyframes nx-page-in { from { opacity: .86; } to { opacity: 1; } }
html.nx-enhanced .nx-reveal { opacity: 0; transform: translate3d(0, 18px, 0); transition: opacity .65s var(--nx-ease), transform .65s var(--nx-ease); transition-delay: var(--nx-delay, 0ms); }
html.nx-enhanced .nx-reveal.nx-visible { opacity: 1; transform: none; }
html.nx-enhanced body.nx-leaving { opacity: .72; transition: opacity .16s ease; }

/* Premium surface treatment that respects the light client workspace and dark public site. */
.app-card, .app-auth-card, .app-sidebar, .app-topbar, .nfx-admin-commandbar, .nfx-admin-kpis article {
  transition: border-color .28s var(--nx-ease), box-shadow .28s var(--nx-ease), transform .28s var(--nx-ease), background-color .28s ease;
}
.app-card, .app-auth-card, .app-sidebar, .nfx-admin-commandbar, .nfx-admin-kpis article {
  box-shadow: 0 14px 38px rgba(13,38,64,.065), 0 1px 0 rgba(255,255,255,.75) inset;
}
.app-card:hover, .nfx-admin-kpis article:hover { border-color: rgba(67,126,177,.30); box-shadow: 0 20px 48px rgba(13,38,64,.105); }
.app-topbar { box-shadow: 0 8px 30px rgba(18,42,67,.045); }
.app-nav a { position: relative; overflow: hidden; }
.app-nav a::before { content: ""; position: absolute; left: 0; top: 18%; bottom: 18%; width: 2px; border-radius: 2px; background: var(--app-blue, #2765a8); transform: scaleY(0); transition: transform .22s ease; }
.app-nav a[aria-current="page"]::before, .app-nav a:hover::before { transform: scaleY(1); }
.app-button, .app-top-actions a, .app-top-actions button, .button, .nav-cta, .service-buy-link {
  transition: transform .24s var(--nx-ease), box-shadow .24s ease, background-color .24s ease, border-color .24s ease;
}
.app-button:hover, .app-top-actions a:hover, .app-top-actions button:hover, .button:hover, .nav-cta:hover, .service-buy-link:hover {
  box-shadow: 0 10px 26px rgba(42,132,157,.15);
}

/* Marketing-page cards gain a restrained border glow and depth. */
.service-product-card, .vision-card, .detail-card, .research-card, .platform-card, .resource-card, .market-photo-grid figure, .visual-frame {
  position: relative; isolation: isolate; transition: border-color .3s ease, box-shadow .3s ease, transform .3s var(--nx-ease);
}
.service-product-card::after, .vision-card::after, .detail-card::after, .research-card::after, .platform-card::after, .resource-card::after, .market-photo-grid figure::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0;
  background: radial-gradient(260px circle at var(--nx-pointer-x,50%) var(--nx-pointer-y,50%), rgba(117,220,225,.13), transparent 72%);
  transition: opacity .28s ease; z-index: 1;
}
.service-product-card:hover::after, .vision-card:hover::after, .detail-card:hover::after, .research-card:hover::after, .platform-card:hover::after, .resource-card:hover::after, .market-photo-grid figure:hover::after { opacity: 1; }
.service-product-card:hover, .vision-card:hover, .detail-card:hover, .research-card:hover, .platform-card:hover, .resource-card:hover { border-color: rgba(117,220,225,.42); box-shadow: 0 20px 48px rgba(0,0,0,.22), 0 0 0 1px rgba(117,220,225,.07); }

/* Scroll-aware header and active navigation affordances. */
.site-header.scrolled { box-shadow: 0 12px 35px rgba(0,0,0,.16); }
.main-nav a, .app-nav a { -webkit-tap-highlight-color: transparent; }
.main-nav a { position: relative; }
.main-nav a:not(.nav-cta)::after { content: ""; position: absolute; height: 1px; left: 0; right: 100%; bottom: -7px; background: var(--nx-accent); transition: right .28s var(--nx-ease); }
.main-nav a:hover::after, .main-nav a[aria-current="page"]::after { right: 0; }

/* Floating back-to-top control. */
.nx-back-top { position: fixed; z-index: 900; right: clamp(16px,3vw,34px); bottom: clamp(16px,3vw,30px); width: 44px; height: 44px; display: grid; place-items: center;
  border: 1px solid rgba(117,220,225,.38); border-radius: 50%; color: #071722; background: linear-gradient(145deg,#b4f0ec,#75dce1);
  box-shadow: 0 8px 28px rgba(0,0,0,.18), 0 0 22px rgba(117,220,225,.14); font-size: 18px; cursor: pointer;
  opacity: 0; visibility: hidden; transform: translateY(10px); transition: opacity .25s ease, visibility .25s ease, transform .25s var(--nx-ease); }
.nx-back-top.is-visible { opacity: 1; visibility: visible; transform: translateY(0); }
.nx-back-top:hover { transform: translateY(-4px); box-shadow: 0 12px 32px rgba(0,0,0,.22), 0 0 25px rgba(117,220,225,.22); }

/* Pointer motion is intentionally limited to capable desktop devices. */
@media (pointer:fine) and (hover:hover) and (min-width:900px) {
  html.nx-pointer .nx-cursor-glow, html.nx-pointer .nx-cursor-ring { opacity: 1; }
  html.nx-pointer .nx-cursor-glow { opacity: .9; }
  .market-photo-grid figure.nx-tilt { will-change: transform; }
}
@media (max-width:899px) {
  .nx-cursor-glow, .nx-cursor-ring, .nx-ambient::before, .nx-ambient::after { display: none !important; }
  .nx-back-top { width: 40px; height: 40px; }
}
@media (max-width:600px) {
  html { scroll-padding-top: 76px; }
  html.nx-enhanced .nx-reveal { transform: translate3d(0,10px,0); transition-duration: .42s; }
  .nx-progress { height: 2px; }
}
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  html.nx-enhanced body, html.nx-enhanced .nx-reveal { animation: none !important; opacity: 1 !important; transform: none !important; }
  .nx-ambient, .nx-cursor-glow, .nx-cursor-ring, .nx-back-top { display: none !important; }
}


/* NEXFIN global interaction polish — additive and reduced-motion aware. */
:where(.app-card,.detail-card,.service-product-card,.research-card,.platform-card,.resource-card,.vision-card,.team-card){transition:transform .32s cubic-bezier(.2,.7,.2,1),border-color .32s,box-shadow .32s}
:where(.app-button,.wwn-primary,.mem-btn,.nav-auth-signup){transition:transform .24s ease,filter .24s ease,box-shadow .24s ease}
:where(.app-button,.wwn-primary,.mem-btn,.nav-auth-signup):hover{transform:translateY(-2px);filter:brightness(1.06)}
:where(.app-card,.detail-card,.service-product-card,.research-card,.platform-card,.resource-card,.vision-card):hover{transform:translateY(-4px)}
:where(input,select,textarea,button,a):focus-visible{outline:2px solid rgba(117,220,225,.82);outline-offset:3px}
@media(prefers-reduced-motion:reduce){:where(.app-card,.detail-card,.service-product-card,.research-card,.platform-card,.resource-card,.vision-card,.team-card),:where(.app-button,.wwn-primary,.mem-btn,.nav-auth-signup){transition:none!important}}
