/* ============================================================
   NexGen overrides — sitewide blue/white/black/green palette,
   Inter font (matches Remmato), NexGen logo + typewriter caret.
   Collapses purple/amber/pink/cyan accents into blue + green.
   ============================================================ */

:root {
  --font-body:    'Inter', ui-sans-serif, system-ui, sans-serif;
  --font-display: 'Inter', ui-sans-serif, system-ui, sans-serif;

  /* Brand */
  --nx-blue:        #1e63d6;
  --nx-blue-soft:   #4f93ff;
  --nx-blue-deep:   #0b3a8a;
  --nx-green:       #22c55e;
  --nx-green-soft:  #4ade80;
  --nx-green-deep:  #0f7a3a;
  --nx-ink:         #0a0f1c;
  --nx-white:       #f6f9ff;

  /* Remap original accent tokens to the 4-color brand */
  --c-green:    var(--nx-green);
  --c-green-ink:#04130a;
  --c-blue:     var(--nx-blue-soft);
  --c-blue-ink: #04122b;
  --c-purple:   var(--nx-blue);          /* was purple */
  --c-purple-ink: #ffffff;
  --c-amber:    var(--nx-green-soft);    /* was amber */
  --c-amber-ink: #04130a;
  --c-pink:     var(--nx-blue-soft);     /* was pink */
  --c-cyan:     var(--nx-green-soft);    /* was cyan */
  --c-indigo:   var(--nx-blue);
  --c-teal:     var(--nx-green);
}

body { font-family: var(--font-body); }
h1, h2, h3, h4, .h1, .h2, .logo-text {
  font-family: var(--font-display);
  letter-spacing: -0.018em;
}

/* ---- Logo (header & footer) -------------------------------- */
.logo { gap: 0; }
.logo .logo-mark { display: none !important; }
.logo .logo-text { display: none !important; }
img.nexgen-logo {
  height: 44px;
  width: auto;
  display: block;
  background: transparent;
  padding: 0;
  border-radius: 0;
  box-shadow: none;
}
.footer img.nexgen-logo,
footer img.nexgen-logo { height: 48px; }


/* ---- Brand palette: buttons, pills, glows (sitewide) ------- */
.btn--green  { background: var(--nx-green); color: #04130a; box-shadow: 0 0 26px rgba(34,197,94,0.32); }
.btn--blue   { background: var(--nx-blue);  color: #fff;    box-shadow: 0 0 26px rgba(30,99,214,0.35); }
.btn--purple { background: var(--nx-blue-deep); color: #fff; box-shadow: 0 0 26px rgba(11,58,138,0.4); }
.btn--amber  { background: var(--nx-green-soft); color: #04130a; box-shadow: 0 0 26px rgba(74,222,128,0.3); }

.site-header .btn--green,
.hero-home .btn--green,
.footer .btn--green {
  background: var(--nx-blue);
  color: #fff;
  box-shadow: 0 0 26px rgba(30,99,214,0.35);
}
.site-header .btn--green:hover,
.hero-home .btn--green:hover { background: var(--nx-blue-deep); opacity: 1; }

/* Hero accent labels */
.hero-home .cycle-word { color: var(--nx-green) !important; }
.hero-home .hero-home__title { color: var(--nx-white); }

/* Tag pills — keep only blue/green palette */
.tag-pill.accent-green  { color: var(--nx-green); border-color: rgba(34,197,94,0.45); }
.tag-pill.accent-blue   { color: var(--nx-blue-soft); border-color: rgba(79,147,255,0.45); }
.tag-pill.accent-purple { color: var(--nx-blue); border-color: rgba(30,99,214,0.5); }
.tag-pill.accent-amber  { color: var(--nx-green-soft); border-color: rgba(74,222,128,0.45); }

/* Eyebrows / accent text classes that were purple/amber/pink/cyan */
.accent-purple, .text-purple, .eyebrow-purple { color: var(--nx-blue) !important; }
.accent-amber,  .text-amber,  .eyebrow-amber  { color: var(--nx-green-soft) !important; }
.accent-pink,   .text-pink,   .eyebrow-pink   { color: var(--nx-blue-soft) !important; }
.accent-cyan,   .text-cyan,   .eyebrow-cyan   { color: var(--nx-green-soft) !important; }

/* Card / row accent variables — collapse RGB tuples to blue/green too */
.accent-green  { --accent: var(--nx-green);       --accent-rgb: 34,197,94; }
.accent-blue   { --accent: var(--nx-blue-soft);   --accent-rgb: 79,147,255; }
.accent-purple { --accent: var(--nx-blue);        --accent-rgb: 30,99,214; }
.accent-amber  { --accent: var(--nx-green-soft);  --accent-rgb: 74,222,128; }
.accent-pink   { --accent: var(--nx-blue-soft);   --accent-rgb: 79,147,255; }
.accent-cyan   { --accent: var(--nx-green-soft);  --accent-rgb: 74,222,128; }
.accent-indigo { --accent: var(--nx-blue);        --accent-rgb: 30,99,214; }
.accent-teal   { --accent: var(--nx-green);       --accent-rgb: 34,197,94; }

/* Card top-borders / agent-row left borders (uses background-color) */
.hero-agent-row.accent-purple,
[class*="border-purple"], .border-purple { border-color: var(--nx-blue) !important; }
.hero-agent-row.accent-amber,
[class*="border-amber"],  .border-amber  { border-color: var(--nx-green-soft) !important; }
.hero-agent-row.accent-pink,
[class*="border-pink"],   .border-pink   { border-color: var(--nx-blue-soft) !important; }
.hero-agent-row.accent-cyan,
[class*="border-cyan"],   .border-cyan   { border-color: var(--nx-green-soft) !important; }

/* ---- Typewriter line under hero h1 ------------------------- */
.typewriter-line {
  margin-top: 14px;
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 22px;
  color: #cfe1ff;
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
}
.typewriter-line .tw-prefix { color: var(--text-secondary); font-weight: 500; }
.typewriter-line .typewriter {
  color: var(--nx-green);
  min-width: 4ch;
  font-weight: 700;
}
.typewriter-line .tw-caret {
  display: inline-block;
  color: var(--nx-blue);
  font-weight: 400;
  animation: tw-blink 1s steps(1) infinite;
  margin-left: 2px;
}
@keyframes tw-blink { 50% { opacity: 0; } }

/* ---- Footer pattern (subtle blue grid) --------------------- */
.footer, footer.footer {
  background:
    radial-gradient(1200px 320px at 80% -10%, rgba(30,99,214,0.18), transparent 60%),
    linear-gradient(180deg, #060c18 0%, #04070f 100%);
  border-top: 1px solid rgba(30,99,214,0.25);
}
.footer::before, footer.footer::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(to right, rgba(255,255,255,0.04) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,0.04) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: linear-gradient(180deg, transparent, black 30%, black 70%, transparent);
  opacity: 0.7;
}
.footer { position: relative; }

/* Nav hover = blue, active/selected = black */
.site-header .nav-link { transition: color .15s ease, background .15s ease; }
.site-header .nav-link:hover,
.site-header .nav-link:focus-visible { color: var(--nx-blue) !important; }
.site-header .nav-link.is-active,
.site-header .nav-link[aria-current="page"] {
  color: var(--nx-green) !important;
  background: transparent;
  position: relative;
}
.site-header .nav-link.is-active::after,
.site-header .nav-link[aria-current="page"]::after {
  content: '';
  position: absolute;
  left: 15px;
  right: 15px;
  bottom: -1px;
  height: 2px;
  background: var(--nx-green) !important;
  border-radius: 2px;
}

/* ---------- Accessibility: focus-visible & keyboard navigation ---------- */
/* Remove default outline only when not keyboard-focused */
a:focus:not(:focus-visible),
button:focus:not(:focus-visible),
[role="button"]:focus:not(:focus-visible),
input:focus:not(:focus-visible),
select:focus:not(:focus-visible),
textarea:focus:not(:focus-visible) { outline: none; }

/* Universal keyboard focus ring */
a:focus-visible,
button:focus-visible,
[role="button"]:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--nx-blue);
  outline-offset: 3px;
  border-radius: 6px;
  transition: outline-color .12s ease;
}

/* Header nav links: stronger focus state */
.site-header .nav-link:focus-visible,
.site-header .nav-cta:focus-visible,
.site-header .logo:focus-visible {
  outline: 2px solid var(--nx-blue);
  outline-offset: 4px;
  color: var(--nx-blue) !important;
  background: rgba(30, 99, 214, 0.08);
  border-radius: 6px;
}

/* Megamenu links: visible focus inside the dropdown */
.nav-megamenu a:focus-visible {
  outline: 2px solid var(--nx-blue);
  outline-offset: 2px;
  background: rgba(30, 99, 214, 0.08);
  border-radius: 6px;
}

/* Buttons (primary / ghost / CTA) */
.btn:focus-visible,
.nav-cta:focus-visible {
  outline: 2px solid var(--nx-blue);
  outline-offset: 3px;
  box-shadow: 0 0 0 4px rgba(30, 99, 214, 0.22);
}

/* Footer links */
.site-footer a:focus-visible {
  outline: 2px solid var(--nx-blue);
  outline-offset: 3px;
  color: var(--nx-blue) !important;
  border-radius: 4px;
}

/* Skip link: only visible when focused */
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 1000;
  padding: 10px 16px;
  background: var(--nx-ink);
  color: #fff;
  font-weight: 600;
  text-decoration: none;
  border-radius: 0 0 8px 0;
}
.skip-link:focus,
.skip-link:focus-visible {
  left: 0;
  outline: 2px solid var(--nx-blue);
  outline-offset: 2px;
}

/* Mobile nav toggle */
.nav-toggle:focus-visible {
  outline: 2px solid var(--nx-blue);
  outline-offset: 3px;
  border-radius: 6px;
}

/* Cards and tiles that act as links */
.product-menu-link:focus-visible,
.industry-menu-link:focus-visible,
.megamenu-link:focus-visible,
.service-card:focus-visible,
.footer-link:focus-visible {
  outline: 2px solid var(--nx-blue);
  outline-offset: 3px;
  border-radius: 8px;
}

/* Honor users who prefer reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}

/* New header logo (nexgts.ai wordmark, wide aspect) */
.site-header img.nexgen-logo[src*="nexgts-header-logo"] {
  height: 40px;
  width: auto;
  max-width: 200px;
  object-fit: contain;
  display: block;
}


/* ---------- Perf: snappier reveal & transitions ---------- */
.reveal {
  transition: opacity .28s ease-out, transform .28s ease-out !important;
  transform: translateY(14px) !important;
}
.reveal.in {
  transform: translateY(0) !important;
}

/* Tone down ambient floats/glows that run forever and burn CPU on low-end devices */
@media (max-width: 980px) {
  [class*="float"], .pulse, .pulseDot { animation: none !important; }
}

/* ---------- Footer trust stats ---------- */
.footer-bottom .container {
  flex-wrap: wrap;
  row-gap: 10px;
}
.footer-trust {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 18px;
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--text-secondary);
}
.footer-trust li {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
}
.footer-trust li strong {
  color: var(--nx-green);
  font-weight: 700;
  margin-right: 6px;
  letter-spacing: 0.01em;
}
.footer-trust li + li {
  padding-left: 18px;
  border-left: 1px solid var(--border-strong);
}
@media (max-width: 640px) {
  .footer-bottom .container {
    justify-content: center;
    text-align: center;
  }
  .footer-trust {
    justify-content: center;
    gap: 6px 14px;
  }
  .footer-trust li + li {
    padding-left: 14px;
    border-left: 1px solid var(--border-soft);
  }
}
