/* =========================================================
   Intelligent Networx — Premium shared layer
   Skill-driven: motion-principles · css-native · frontend-design
   ========================================================= */

/* ---- Scroll progress ---- */
#nx-progress{
  position:fixed;top:0;left:0;height:2px;width:0;z-index:10000;
  background:linear-gradient(90deg,#2a9d8f,#3ec7b5);
  box-shadow:0 0 10px rgba(62,199,181,.55);
  pointer-events:none;
}

/* ---- Back to top ---- */
#nx-top{
  position:fixed;right:22px;bottom:22px;width:46px;height:46px;border-radius:50%;
  border:1px solid rgba(10,43,92,.12);
  background:rgba(255,255,255,.92);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  color:#0a2b5c;display:flex;align-items:center;justify-content:center;
  cursor:pointer;z-index:9999;
  opacity:0;visibility:hidden;transform:translateY(14px);
  transition:opacity .3s ease,transform .3s ease,visibility .3s ease,background .2s ease,color .2s ease,border-color .2s ease;
  box-shadow:0 8px 24px rgba(10,43,92,.16);
}
#nx-top.show{opacity:1;visibility:visible;transform:none}
#nx-top:hover{background:#0a2b5c;color:#fff;border-color:#0a2b5c}
#nx-top svg{width:18px;height:18px}

/* ---- Display typeface (falls back to system stack offline) ---- */
h1,h2,h3,h4,h5,.brand,.menu>li>a,.nav-cta,.btn,.hero-eyebrow,.section-eyebrow,
.stat-num,.drop-group h6,.btn-hero-primary,.btn-hero-ghost,.hero-scroll .label{
  font-family:'Sora','Segoe UI',-apple-system,BlinkMacSystemFont,Roboto,Helvetica,Arial,sans-serif;
}
h1{letter-spacing:-.02em}
h2{letter-spacing:-.01em}

/* ---- Button light-sweep micro-interaction ---- */
.btn,.nav-cta,.btn-hero-primary,.btn-hero-ghost{
  position:relative;overflow:hidden;
}
.btn::after,.nav-cta::after,.btn-hero-primary::after,.btn-hero-ghost::after{
  content:"";position:absolute;top:0;left:-80%;width:50%;height:100%;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.32),transparent);
  transform:skewX(-20deg);transition:left .55s ease;pointer-events:none;
}
.btn:hover::after,.nav-cta:hover::after,.btn-hero-primary:hover::after,.btn-hero-ghost:hover::after{left:125%}

/* ---- Footer link underline reveal ---- */
.footer-col a,.foot-col li a,.foot-brand a{
  background-image:linear-gradient(currentColor,currentColor);
  background-size:0 1px;background-position:0 100%;background-repeat:no-repeat;
  transition:background-size .3s ease,color .15s ease;
  padding-bottom:1px;
}
.footer-col a:hover,.foot-col li a:hover,.foot-brand a:hover{background-size:100% 1px}

/* ---- Visible focus (a11y) ---- */
a:focus-visible,button:focus-visible,.btn:focus-visible,input:focus-visible,
textarea:focus-visible,select:focus-visible{
  outline:2px solid #2a9d8f;outline-offset:3px;
}
input:focus,textarea:focus,select:focus{
  border-color:#2a9d8f;
  box-shadow:0 0 0 3px rgba(42,157,143,.15);
  outline:none;
}

/* ---- Selection ---- */
::selection{background:rgba(42,157,143,.28);color:inherit}

/* ---- Page hero base (subpages were missing these) ---- */
.page-hero{
  position:relative;display:flex;align-items:center;overflow:hidden;
  min-height:460px;
  background:linear-gradient(135deg,#051733 0%,#0a2b5c 55%,#0d3572 100%);
}
.page-hero .bg{
  position:absolute;inset:0;z-index:0;
  background-size:cover;background-position:center;
}
.page-hero .wrap{
  position:relative;z-index:1;width:100%;max-width:1280px;margin:0 auto;
  padding:120px 32px 80px;
}
.page-hero h1{
  color:#fff;font-size:clamp(30px,4vw,46px);font-weight:700;
  line-height:1.2;margin:18px 0 12px;max-width:880px;
}
.page-hero p{color:#c9d5e5;font-size:17px;max-width:680px;line-height:1.7}

/* ---- Refined media ---- */
.page-body img,.article img,.svc-content img,.cs-content img,.ind-content img{
  border-radius:12px;
}

/* ---- Overview intro + card grid (missing on some pages) ---- */
.ov-intro{max-width:820px;margin:0 auto;padding:40px 32px 0;text-align:left}
.ov-intro p{font-size:16px;color:var(--muted,#5a6a7e);line-height:1.75}
.ov-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;max-width:900px;margin:40px auto;padding:0 24px}
.ov-card{
  background:#fff;border:1px solid var(--line,#e3e7ee);border-radius:10px;overflow:hidden;
  transition:transform .3s ease,box-shadow .3s ease;
  display:flex;flex-direction:column;text-decoration:none;color:inherit;
}
.ov-card:hover{transform:translateY(-4px);box-shadow:0 12px 28px rgba(10,43,92,.14)}
.ov-card .img{height:170px;background-size:cover;background-position:center}
.ov-card .body{padding:22px;flex:1;display:flex;flex-direction:column}
.ov-card .tag{
  display:inline-block;background:var(--teal,#7fc8c4);color:var(--navy,#0a2b5c);
  font-size:11.5px;font-weight:700;padding:4px 10px;border-radius:4px;
  margin-bottom:10px;letter-spacing:.5px;text-transform:uppercase;
  align-self:flex-start;
}
.ov-card h3{font-size:17px;font-weight:700;color:var(--navy,#0a2b5c);margin-bottom:8px}
.ov-card p{font-size:14px;color:var(--muted,#5a6a7e);line-height:1.6;flex:1}
.ov-card .link{margin-top:14px;color:var(--blue,#1a5fb4);font-weight:600;font-size:14px}
@media(max-width:700px){.ov-grid{grid-template-columns:1fr}}

/* ---- Footer consistency (fix subpage cascade conflict: light bg + white headings) ---- */
footer{
  background:#141a26;
  color:#9aa3b2;
  border-top:1px solid rgba(255,255,255,.06);
}
/* logo.png is a dark-navy mark: invert to white so it stays visible on the dark footer
   (the same file is used on the white nav, where it stays as-is) */
.foot-brand img{
  filter:brightness(0) invert(1);
  opacity:.92;
  height:38px;width:auto;
}

/* ---- Reduced motion: strip the decorative layer ---- */
@media (prefers-reduced-motion:reduce){
  #nx-progress,#nx-top{display:none}
  .btn::after,.nav-cta::after,.btn-hero-primary::after,.btn-hero-ghost::after{display:none}
}