/* Nuveux Design Solutions \u2014 custom styles layered on Tailwind */
html { scroll-behavior: smooth; }
body { scroll-padding-top: 5rem; }
:root { --navy: #163066; }

.h-18 { height: 4.5rem; }

/* Font-weight utility aliases used in markup */
.font-500 { font-weight: 500; }
.font-600 { font-weight: 600; }
.font-700 { font-weight: 700; }
.font-800 { font-weight: 800; }

/* Header scroll state (toggled by JS) */
[data-header] { background: transparent; }
[data-header] [data-navlinks] a,
[data-header] [data-logo-text] { color: #fff; }
[data-header].is-scrolled {
  background: rgba(255,255,255,.92);
  backdrop-filter: saturate(180%) blur(12px);
  box-shadow: 0 1px 0 rgba(15,23,42,.06), 0 8px 24px -16px rgba(15,23,42,.3);
}
[data-header].is-scrolled [data-navlinks] a { color: #475569; }
[data-header].is-scrolled [data-navlinks] a:hover { color: var(--navy); }
[data-header].is-scrolled [data-logo-text] { color: var(--navy); }
[data-header].is-scrolled [data-menu-btn] { color: var(--navy); }
[data-header] [data-menu-btn] { color: #fff; }

/* Reveal-on-scroll animation */
[data-reveal] { opacity: 0; transform: translateY(18px); transition: opacity .6s ease, transform .6s ease; }
[data-reveal].is-visible { opacity: 1; transform: none; }

/* Card hover lift */
.card-lift { transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.card-lift:hover { transform: translateY(-4px); box-shadow: 0 24px 48px -24px rgba(22,48,102,.35); }

/* Service card icon colour shift on hover */
.card-lift:hover .svc-icon { background: #2f6bff; color: #fff; transform: scale(1.05); }
.svc-icon { transition: background .25s ease, color .25s ease, transform .25s ease; }

/* Slow ambient pulse for hero glow */
@keyframes pulseSlow { 0%,100% { opacity:.6; transform:scale(1); } 50% { opacity:1; transform:scale(1.08); } }
.animate-pulse-slow { animation: pulseSlow 7s ease-in-out infinite; }

/* Infinite tech marquee */
.marquee { display:flex; overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); }
.marquee__track { display:flex; gap:.75rem; flex-shrink:0; min-width:100%; padding-right:.75rem; animation:marquee 38s linear infinite; }
.marquee--reverse .marquee__track { animation-direction:reverse; animation-duration:46s; }
.marquee:hover .marquee__track { animation-play-state:paused; }
@keyframes marquee { from { transform:translateX(0); } to { transform:translateX(-100%); } }
.tech-pill { display:inline-flex; align-items:center; gap:.5rem; white-space:nowrap; padding:.6rem 1.1rem; border-radius:9999px; border:1px solid #e2e8f0; background:#fff; font-weight:600; font-size:.875rem; color:#334155; box-shadow:0 1px 2px rgba(15,23,42,.04); transition:border-color .2s ease,color .2s ease,box-shadow .2s ease; }
.tech-pill:hover { border-color:#2f6bff; color:#163066; box-shadow:0 8px 20px -12px rgba(47,107,255,.5); }
.tech-pill .dot { width:.5rem; height:.5rem; border-radius:9999px; background:#2f6bff; }

/* FAQ accordion */
.faq-item button svg { transition: transform .3s ease; }
.faq-item.open button svg { transform: rotate(45deg); }
.faq-item .faq-answer { max-height: 0; overflow: hidden; transition: max-height .35s ease; }

/* Accessibility: visible keyboard focus */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible {
  outline: 3px solid #2f6bff; outline-offset: 2px; border-radius: 6px;
}

/* Skip-to-content link */
.skip-link {
  position: absolute; left: 1rem; top: -4rem; z-index: 60;
  background: #163066; color: #fff; padding: .6rem 1rem; border-radius: .5rem;
  font-weight: 600; transition: top .2s ease;
}
.skip-link:focus { top: 1rem; }

/* Respect reduced-motion preference */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { animation-duration: .001ms !important; transition-duration: .001ms !important; animation-iteration-count: 1 !important; }
  [data-reveal] { opacity: 1 !important; transform: none !important; }
  .marquee__track { animation: none !important; }
  .animate-pulse-slow { animation: none !important; }
}