/* nvalgo responsive polish v20 — unlock mobile scroll (silk touchmove was blocking) */

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  position: relative;
}

img,
video,
canvas,
iframe,
svg {
  max-width: 100%;
}

/* Keep brand mark crisp on every breakpoint */
img[alt='nvalgo'] {
  display: block !important;
  height: 30px !important;
  width: auto !important;
  max-width: none !important;
  object-fit: contain !important;
  flex-shrink: 0 !important;
}

/* ========== NAV / DRAWER (shared) ========== */
.nv-topbar {
  /* Desktop default after JS tags the bar */
  padding-left: 44px !important;
  padding-right: 44px !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

.nv-burger {
  display: none;
  margin-left: auto;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.06);
  color: #fff;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex: 0 0 auto;
  position: relative;
  z-index: 1300;
  pointer-events: auto;
}

.nv-burger svg {
  width: 20px;
  height: 20px;
  display: block;
  pointer-events: none;
}

.nv-drawer-backdrop {
  display: none !important;
  position: fixed !important;
  inset: 0;
  background: rgba(6, 7, 10, 0.55);
  z-index: 1400;
  opacity: 0;
  pointer-events: none !important;
  visibility: hidden !important;
}

.nv-drawer {
  display: none !important;
  position: fixed !important;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(86vw, 360px);
  z-index: 1500;
  background: #0d0e13;
  border-left: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: -24px 0 60px rgba(0, 0, 0, 0.45);
  transform: translateX(104%);
  transition: transform 240ms cubic-bezier(0.4, 0, 0.2, 1);
  padding:
    calc(72px + env(safe-area-inset-top))
    16px
    calc(24px + env(safe-area-inset-bottom));
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  pointer-events: none !important;
  visibility: hidden !important;
}

.nv-drawer[hidden],
.nv-drawer-backdrop[hidden] {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

body.nv-nav-open {
  overflow: hidden !important;
}

body.nv-nav-open .nv-drawer-backdrop {
  display: block !important;
  opacity: 1;
  pointer-events: auto !important;
  visibility: visible !important;
}

body.nv-nav-open .nv-drawer {
  display: block !important;
  transform: translateX(0);
  pointer-events: auto !important;
  visibility: visible !important;
}

.nv-drawer-section {
  margin-bottom: 18px;
}

.nv-drawer-label {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #6f6a86;
  padding: 8px 10px 10px;
}

.nv-drawer a {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 10px;
  border-radius: 12px;
  text-decoration: none;
  color: #fff;
}

.nv-drawer a:active,
.nv-drawer a:hover {
  background: rgba(255, 255, 255, 0.06);
}

.nv-drawer-name {
  display: block;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.25;
}

.nv-drawer-desc {
  display: block;
  margin-top: 3px;
  font-size: 12px;
  font-weight: 500;
  color: #8b83a8;
  line-height: 1.35;
}

.nv-drawer-cta {
  display: grid !important;
  gap: 10px;
  margin-top: 8px;
  padding-top: 8px;
}

.nv-drawer-cta a {
  justify-content: center;
  text-align: center;
  font-weight: 700;
  border-radius: 999px;
  padding: 12px 14px;
}

.nv-drawer-cta .nv-cta-primary {
  background: linear-gradient(96deg, #7b68ee 0%, #ff4fcb 55%, #ff8a3d 100%);
  color: #fff;
}

.nv-drawer-cta .nv-cta-ghost {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: #fff;
}

/* ========== DESKTOP ========== */
@media (min-width: 981px) {
  html body .about-hero {
    grid-template-columns: 1.1fr 0.9fr !important;
  }

  html body .nv-topbar,
  html body div[style*='position: fixed'][style*='z-index: 1100'],
  html body div[style*='position:fixed'][style*='z-index:1100'] {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    padding-left: 44px !important;
    padding-right: 44px !important;
    overflow: visible !important;
    box-sizing: border-box !important;
    height: 60px !important;
  }

  /* Products / Services / Company cluster must stay horizontal */
  html body .nv-topbar > .nv-desktop-only,
  html body div[style*='position: fixed'][style*='z-index: 1100'] > div,
  html body div[style*='position:fixed'][style*='z-index:1100'] > div {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: 24px !important;
  }

  html body .nv-burger,
  html body .nv-drawer,
  html body .nv-drawer-backdrop,
  html body .nv-hide-mobile {
    display: none !important;
  }

  html body .nv-desktop-only {
    display: flex !important;
  }

  html body img[alt='nvalgo'] {
    height: 30px !important;
    width: auto !important;
  }
}

/* Full desktop width — restore 4-up stats row (About sample) */
@media (min-width: 1001px) {
  html body .stat-grid {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

/* ========== MOBILE / TABLET ========== */
@media (max-width: 980px) {
  html {
    overflow-x: clip !important;
    overflow-y: scroll !important;
    height: 100% !important;
    max-height: 100% !important;
    overscroll-behavior-y: contain !important;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-y !important;
    background-color: #fff !important;
  }

  body,
  x-dc {
    overflow-x: clip !important;
    overflow-y: visible !important;
    height: auto !important;
    max-height: none !important;
    min-height: 100% !important;
    max-width: 100% !important;
    width: 100% !important;
    min-width: 0 !important;
    position: relative !important;
    touch-action: pan-y !important;
    -webkit-overflow-scrolling: touch !important;
    /* Keep original light page canvas — do NOT paint whole site dark */
    background-color: #fff !important;
  }

  /* Homepage root: overflow:hidden was blocking vertical scroll on mobile */
  html body > div[style*='overflow: hidden'],
  html body > div[style*='overflow:hidden'],
  html body div[style*='overflow: hidden'][style*='padding-top'],
  html body div[style*='overflow:hidden'][style*='padding-top'],
  html body div[style*='overflow: hidden'][style*='width: 100%'],
  html body div[style*='overflow:hidden'][style*='width: 100%'] {
    overflow: visible !important;
    overflow-x: clip !important;
    overflow-y: visible !important;
    height: auto !important;
    max-height: none !important;
    touch-action: pan-y !important;
  }

  .nv-burger {
    display: inline-flex !important;
  }

  html body div[style*='position: fixed'][style*='z-index: 1100'],
  html body div[style*='position:fixed'][style*='z-index:1100'],
  html body .nv-topbar {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    height: 56px !important;
    left: 0 !important;
    right: 0 !important;
    top: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    padding-left: max(16px, env(safe-area-inset-left)) !important;
    padding-right: max(16px, env(safe-area-inset-right)) !important;
    overflow: visible !important;
    z-index: 1300 !important;
    background: rgba(6, 7, 10, 0.96) !important;
    flex-wrap: nowrap !important;
  }

  html body .nv-topbar > .nv-desktop-only,
  html body div[style*='position: fixed'][style*='z-index: 1100'] > div,
  html body div[style*='position:fixed'][style*='z-index:1100'] > div {
    display: none !important;
  }

  html body div[style*='position: fixed'][style*='z-index: 1100'] > a:not(:has(img)),
  html body div[style*='position:fixed'][style*='z-index:1100'] > a:not(:has(img)) {
    display: none !important;
  }

  html body .nv-brand-link,
  html body div[style*='position: fixed'][style*='z-index: 1100'] > a:has(img[alt='nvalgo']),
  html body div[style*='position:fixed'][style*='z-index:1100'] > a:has(img[alt='nvalgo']) {
    display: inline-flex !important;
    align-items: center !important;
    flex: 0 0 auto !important;
    min-width: max-content !important;
    overflow: visible !important;
    margin-right: auto !important;
  }

  html body .nv-topbar img[alt='nvalgo'],
  html body div[style*='position: fixed'][style*='z-index: 1100'] img[alt='nvalgo'],
  html body div[style*='position:fixed'][style*='z-index:1100'] img[alt='nvalgo'] {
    height: 26px !important;
    width: auto !important;
    min-width: 88px !important;
  }

  html body .nv-burger {
    order: 2;
    margin-left: 0 !important;
    z-index: 1301 !important;
  }

  html body div[style*='padding-top: 60px'],
  html body div[style*='padding-top:60px'] {
    padding-top: 56px !important;
    /* transparent — hero paints its own dark bg; light sections keep white page */
    background-color: transparent !important;
  }

  .cta-shot,
  .nv-hide-mobile {
    display: none !important;
  }

  /* Homepage hero orbit — keep desktop composition, scale to phone width */
  html body .nv-hero-orbit {
    display: block !important;
    width: 1320px !important;
    max-width: none !important;
    height: 720px !important;
    transform-origin: top center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    overflow: visible !important;
  }

  html body .nv-hero-orbit .float1,
  html body .nv-hero-orbit .float2 {
    display: block !important;
    visibility: visible !important;
  }

  html body .nv-hero-orbit-wrap {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    overflow-y: visible !important;
    display: flex !important;
    justify-content: center !important;
  }

  html body .bento-grid,
  html body .foot-cols,
  html body .suite-content,
  html body .suite-bullets,
  html body .erp-grid,
  html body .console-body,
  html body .qa-cols,
  html body .module-grid {
    grid-template-columns: 1fr !important;
  }

  html body .bento-cell {
    min-height: 0 !important;
    height: auto !important;
    border-right: 0 !important;
    overflow: visible !important;
    min-width: 0 !important;
  }

  html body [style*='grid-template-columns: 1fr 1fr'],
  html body [style*='grid-template-columns:1fr 1fr'],
  html body [style*='grid-template-columns: 1fr 1fr 1fr'],
  html body [style*='grid-template-columns:1fr 1fr 1fr'],
  html body [style*='grid-template-columns: repeat(2'],
  html body [style*='grid-template-columns:repeat(2'],
  html body [style*='grid-template-columns: repeat(3'],
  html body [style*='grid-template-columns:repeat(3'],
  html body [style*='grid-template-columns: repeat(4'],
  html body [style*='grid-template-columns:repeat(4'],
  html body [style*='grid-template-columns: 1.1fr'],
  html body [style*='grid-template-columns: 1.15fr'],
  html body [style*='grid-template-columns: 1.2fr'],
  html body [style*='grid-template-columns: 0.95fr'],
  html body [style*='grid-template-columns: minmax(0,1fr) minmax(0,1fr)'] {
    grid-template-columns: 1fr !important;
  }

  html body [style*='padding: 0 44px'],
  html body [style*='padding:0 44px'],
  html body [style*='padding-left: 44px'],
  html body [style*='padding-right: 44px'],
  html body [style*='padding: 80px 44px'],
  html body [style*='padding: 96px 44px'],
  html body [style*='padding: 72px 44px'],
  html body [style*='padding: 64px 44px'],
  html body [style*='padding: 120px 44px'],
  html body [style*='padding: 100px 44px'] {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  html body [style*='font-size: 64px'],
  html body [style*='font-size:64px'],
  html body [style*='font-size: 56px'],
  html body [style*='font-size:56px'],
  html body [style*='font-size: 72px'],
  html body [style*='font-size:72px'],
  html body [style*='font-size: 80px'],
  html body [style*='font-size:80px'] {
    font-size: clamp(1.85rem, 8vw, 2.8rem) !important;
    line-height: 1.12 !important;
    word-break: break-word !important;
  }

  html body [style*='font-size: 48px'],
  html body [style*='font-size:48px'],
  html body [style*='font-size: 40px'],
  html body [style*='font-size:40px'],
  html body [style*='font-size: 36px'],
  html body [style*='font-size:36px'] {
    font-size: clamp(1.45rem, 6.2vw, 2.1rem) !important;
    line-height: 1.18 !important;
    word-break: break-word !important;
  }

  html body .brandmark {
    font-size: clamp(42px, 14vw, 72px) !important;
    max-width: 100% !important;
    font-family: 'Plus Jakarta Sans', 'Public Sans', sans-serif !important;
  }

  html body input,
  html body textarea,
  html body select {
    font-size: 16px !important;
    max-width: 100% !important;
  }

  .nv-clip {
    max-width: 100% !important;
    overflow: hidden !important;
    min-width: 0 !important;
  }

  .nv-stack {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Homepage features mosaic: 10-col desktop → equal 3-col mobile */
  html body .nvalgo-features-mosaic,
  html body [style*='grid-template-columns: repeat(10'],
  html body [style*='grid-template-columns:repeat(10'] {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    grid-auto-rows: minmax(84px, auto) !important;
    grid-auto-flow: row !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    -webkit-mask-image: none !important;
    mask-image: none !important;
    overflow: hidden !important;
  }

  html body .nvalgo-features-mosaic > *,
  html body [style*='grid-template-columns: repeat(10'] > *,
  html body [style*='grid-template-columns:repeat(10'] > * {
    grid-column: auto !important;
    grid-row: auto !important;
    margin: 0 !important;
    min-width: 0 !important;
    max-width: 100% !important;
    width: auto !important;
    box-sizing: border-box !important;
  }

  html body .nvalgo-features-mosaic .lift,
  html body [style*='grid-template-columns: repeat(10'] .lift,
  html body [style*='grid-template-columns:repeat(10'] .lift {
    display: none !important;
  }

  /* Crosshair dividers → white center stripe on stacked grids */
  html body div[style*='left: 50%'][style*='width: 1px'],
  html body div[style*='left:50%'][style*='width:1px'],
  html body div[style*='top: 50%'][style*='height: 1px'],
  html body div[style*='top:50%'][style*='height:1px'] {
    display: none !important;
  }

  /* Fixed desktop mock widths */
  html body [style*='width: 454px'],
  html body [style*='width:454px'],
  html body [style*='width: 480px'],
  html body [style*='width:480px'],
  html body [style*='width: 520px'],
  html body [style*='width:520px'],
  html body [style*='width: 560px'],
  html body [style*='width:560px'],
  html body [style*='width: 620px'],
  html body [style*='width:620px'],
  html body [style*='width: 640px'],
  html body [style*='width:640px'],
  html body [style*='width: 720px'],
  html body [style*='width:720px'],
  html body [style*='width: 800px'],
  html body [style*='width:800px'],
  html body [style*='width: 960px'],
  html body [style*='width:960px'],
  html body [style*='width: 1100px'],
  html body [style*='width:1100px'] {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  html body [style*='padding: 48px 56px'],
  html body [style*='padding:48px 56px'],
  html body [style*='padding: 40px 8px 40px 56px'],
  html body [style*='padding: 48px 56px 48px 8px'],
  html body [style*='padding: 40px 56px 40px 8px'],
  html body [style*='padding: 40px 8px 40px 56px'] {
    padding: 24px 4px !important;
  }

  /* Section outer paddings — use full phone width */
  html body [style*='padding: 76px 44px'],
  html body [style*='padding: 74px 44px'],
  html body [style*='padding: 80px 44px'],
  html body [style*='padding: 72px 44px'],
  html body [style*='padding: 64px 44px'],
  html body [style*='padding: 96px 44px'],
  html body [style*='padding: 60px 44px'],
  html body [style*='padding: 48px 44px'] {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  /* Mock / lift cards — full width on mobile */
  html body .lift,
  html body .nv-card-wide {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }

  html body [style*='width: 92%'],
  html body [style*='width:92%'] {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Compliance / badge strips: 4-col → 2-col */
  html body .nv-badges-grid,
  html body [style*='grid-template-columns: repeat(4'],
  html body [style*='grid-template-columns:repeat(4'] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  html body .nv-badges-grid > *,
  html body [style*='grid-template-columns: repeat(4'] > *,
  html body [style*='grid-template-columns:repeat(4'] > * {
    border-left: 0 !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
    min-width: 0 !important;
  }

  html body .nv-badges-grid img,
  html body [style*='grid-template-columns: repeat(4'] img,
  html body [style*='grid-template-columns:repeat(4'] img {
    height: auto !important;
    width: 100% !important;
    max-width: 160px !important;
    object-fit: contain !important;
  }

  /* Kill absolute overflow decorations (purple panels peeking) */
  html body div[style*='right: -'],
  html body div[style*='right:-'],
  html body div[style*='left: -'],
  html body div[style*='left:-'] {
    display: none !important;
  }
}

@media (max-width: 560px) {
  html body [style*='padding-left: 20px'],
  html body [style*='padding-right: 20px'],
  html body [style*='padding-left: 16px'],
  html body [style*='padding-right: 16px'] {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  html body .nvalgo-features-mosaic,
  html body [style*='grid-template-columns: repeat(10'],
  html body [style*='grid-template-columns:repeat(10'] {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    grid-auto-rows: minmax(80px, auto) !important;
  }
}