nav.navGrid {position:relative}
.navGrid {padding-top:30px}
.navGrid-grid {
  display:flex;
  gap:14px;

  overflow-x:auto;
  overflow-y:hidden;

  padding:40px 20px 14px;
  margin-top:30px;

  scroll-snap-type:x proximity;

  -webkit-overflow-scrolling:touch;

  scrollbar-width:thin;
  scrollbar-color:rgba(0,0,0,0.18) transparent;
}

/* Chrome / Safari */
.navGrid-grid::-webkit-scrollbar {
  height:6px;
}

.navGrid-grid::-webkit-scrollbar-track {
  background:transparent;
}

.navGrid-grid::-webkit-scrollbar-thumb {
  background:rgba(0,0,0,0.18);
  border-radius:20px;
}

.navItemGrid-card {
  flex:0 0 380px;

background:var(--back);
  box-shadow:0 4px 10px rgba(0,0,0,0.2);
  border-radius:6px;
  padding:14px;
color:var(--white);
  display:flex;
  flex-direction:column;
  justify-content:space-between;

  transition:
	transform 0.2s ease,
	box-shadow 0.2s ease;

  scroll-snap-align:start;
}

.navItemGrid-card:hover {
  transform:translateY(-4px);

  box-shadow:
	0 8px 20px rgba(0,0,0,0.3);
}



.navItemGrid-card h3 {
  margin-bottom:10px;
  font-size:1rem;
 
  text-align:left;
  padding:0;
  margin:0 0 10px;
}

.navItemGrid-card p {
  font-size:0.8rem;opacity:0.8;
  line-height:1.5;
  margin-bottom:15px;
 
}
.navGridCta {font-size:0.9em}
.navGrid h2 {margin:0 auto}