/* ===================================================================
   NAUGRA GROUP — Bootstrap 5 Custom Theme
   Palette inspired by reference: petrol teal + warm cream + editorial serif
   =================================================================== */

/* ---------- Fonts (loaded via head.php) ---------- */
/* Display: "Poppins" (modern geometric) | Body: "DM Sans" */

:root {
  --ng-teal:        #1f8a9e;   /* primary teal — brighter */
  --ng-teal-dark:   #166577;
  --ng-teal-deep:   #103f4a;
  --ng-sky:         #38b6c9;   /* bright sky-teal accent */

  /* bright neutral base (white + faint tints) */
  --ng-cream:       #f4f9fb;   /* very light teal-tinted band */
  --ng-cream-soft:  #ffffff;   /* page background = white */
  --ng-grey:        #eef2f5;   /* light cool section */
  --ng-ink:         #16242b;   /* near-black text */
  --ng-muted:       #5d6b73;   /* muted body text */
  --ng-line:        #e3e9ee;   /* light cool border */

  /* accent colours for variety in elements */
  --ng-gold:        #f2a341;   /* warm amber */
  --ng-coral:       #ef6f5b;   /* coral / red-orange */
  --ng-green:       #3bb978;   /* fresh green */
  --ng-violet:      #6c63c7;   /* soft violet */

  --bs-primary: var(--ng-teal);
  --ng-serif: "Poppins", "Helvetica Neue", Arial, sans-serif;
  --ng-sans:  "DM Sans", "Helvetica Neue", Arial, sans-serif;
}

/* ---------- Base ---------- */
html { scroll-behavior: smooth; }
body {
  font-family: var(--ng-sans);
  color: var(--ng-ink);
  background: var(--ng-cream-soft);
  font-size: 1rem;
  line-height: 1.75;
  letter-spacing: .015em;
}

h1, h2, h3, h4, h5, .ng-serif {
  font-family: var(--ng-serif);
  font-weight: 600;
  letter-spacing: -.02em;
  line-height: 1.15;
  color: var(--ng-ink);
}

a { color: var(--ng-teal); text-decoration: none; transition: color .25s ease; }
a:hover { color: var(--ng-teal-dark); }

.text-teal { color: var(--ng-teal) !important; }
.bg-teal   { background: var(--ng-teal) !important; }
.bg-cream  { background: var(--ng-cream) !important; }
.bg-grey   { background: var(--ng-grey) !important; }

/* ---------- Buttons ---------- */
.btn-ng {
  --bs-btn-color: #fff;
  background: var(--ng-teal);
  color: #fff;
  border: none;
  border-radius: 2px;
  padding: .8rem 2.2rem;
  font-family: var(--ng-sans);
  font-size: .78rem;
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
  transition: background .3s ease, transform .3s ease;
}
.btn-ng:hover { background: var(--ng-teal-deep); color: #fff; transform: translateY(-2px); }

.btn-ng-outline {
  background: transparent;
  color: var(--ng-teal);
  border: 1px solid var(--ng-teal);
  border-radius: 2px;
  padding: .75rem 2rem;
  font-size: .78rem;
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
  transition: all .3s ease;
}
.btn-ng-outline:hover { background: var(--ng-teal); color: #fff; }

/* underline link in cream/teal blocks */
.link-underline {
  display: inline-block;
  font-size: .76rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  border-bottom: 1px solid currentColor;
  padding-bottom: 3px;
}

/* eyebrow label */
.eyebrow {
  font-family: var(--ng-sans);
  font-size: .72rem;
  letter-spacing: .35em;
  text-transform: uppercase;
  color: var(--ng-teal);
  font-weight: 500;
  margin-bottom: 1rem;
  display: inline-block;
}

/* ===================================================================
   HEADER / NAVBAR
   =================================================================== */
.ng-topbar {
  background: var(--ng-teal-deep);
  color: #d9e6e9;
  font-size: .8rem;
  letter-spacing: .04em;
}
.ng-topbar a { color: #d9e6e9; }
.ng-topbar a:hover { color: #fff; }

.ng-navbar {
  background: var(--ng-cream-soft);
  border-bottom: 1px solid var(--ng-line);
  transition: box-shadow .3s ease, padding .3s ease;
}
.ng-navbar.fixed-active {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1030;
  box-shadow: 0 6px 24px rgba(22,67,77,.10);
  animation: ngDrop .4s ease;
}
@keyframes ngDrop { from { transform: translateY(-100%);} to { transform: translateY(0);} }

/* full-width inner row with controlled side padding (logo flush-ish left) */
.ng-nav-inner { padding-left: clamp(1rem, 3vw, 2.5rem); padding-right: clamp(1rem, 3vw, 2.5rem); }
.ng-navbar .navbar-brand { margin-right: 1rem; }
.ng-navbar .navbar-brand img { max-height: 42.5px; width: auto; }

.ng-navbar .nav-link {
  font-family: var(--ng-sans);
  font-size: .86rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ng-ink);
  font-weight: 500;
  padding: .6rem .7rem !important;
  position: relative;
  white-space: nowrap;
}
@media (min-width:1200px){ .ng-navbar .nav-link { padding:.6rem .85rem !important; letter-spacing:.1em; } }
.ng-navbar .nav-link::after {
  content:""; position:absolute; left:.7rem; right:.7rem; bottom:.35rem;
  height:2px; background: var(--ng-teal); transform: scaleX(0);
  transform-origin: left; transition: transform .3s ease;
}
.ng-navbar .nav-link:hover::after,
.ng-navbar .nav-item.active > .nav-link::after { transform: scaleX(1); }
.ng-navbar .nav-item.active > .nav-link { color: var(--ng-teal); }
.ng-navbar .dropdown-toggle::after { border:0; content:"\f107"; font-family:FontAwesome; vertical-align:0; margin-left:.35rem; font-size:.85em; }

/* ===== Lab Products mega dropdown ===== */
.ng-mega { position:relative; }
.ng-products-menu {
  border:0; border-radius:12px; padding:1rem; margin-top:0;
  box-shadow:0 20px 50px rgba(16,63,74,.18);
  min-width:320px; max-width:360px;
  border-top:3px solid var(--ng-teal);
}
/* invisible bridge so hover doesn't drop when crossing toward the menu */
.ng-products-menu::before {
  content:""; position:absolute; top:-12px; left:0; right:0; height:12px; background:transparent;
}
.ng-products-grid { display:grid; grid-template-columns:1fr; gap:.25rem; max-height:70vh; overflow-y:auto; }
.ng-prod-item {
  display:flex; align-items:center; gap:.75rem; padding:.55rem .7rem; border-radius:8px;
  color:var(--ng-ink); transition:background .2s ease, transform .2s ease; text-transform:none;
}
.ng-prod-item:hover { background:var(--ng-cream); transform:translateX(3px); color:var(--ng-teal); }
.ng-prod-ico {
  width:38px; height:38px; border-radius:9px; flex:0 0 38px;
  display:flex; align-items:center; justify-content:center; color:#fff; font-size:1rem;
}
.ng-ico-0 { background:linear-gradient(135deg,#1f8a9e,#166577); }
.ng-ico-1 { background:linear-gradient(135deg,#ef6f5b,#d64f3a); }
.ng-ico-2 { background:linear-gradient(135deg,#f2a341,#e08827); }
.ng-ico-3 { background:linear-gradient(135deg,#3bb978,#2a9c61); }
.ng-ico-4 { background:linear-gradient(135deg,#6c63c7,#4f46b3); }
.ng-prod-name { font-family:var(--ng-sans); font-size:.9rem; font-weight:500; line-height:1.2; letter-spacing:0; }
.ng-products-all {
  display:flex; align-items:center; justify-content:center; gap:.3rem;
  margin-top:.7rem; padding:.7rem; border-radius:8px; background:var(--ng-teal); color:#fff;
  font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; font-weight:500; transition:background .25s ease;
}
.ng-products-all:hover { background:var(--ng-teal-deep); color:#fff; }
@media (max-width:991.98px){
  .ng-products-menu { min-width:100%; max-width:100%; box-shadow:none; }
}

/* ===== Big colourful cart & search icons ===== */
.ng-navbar .ng-icon-item { margin-left:.2rem; }
.ng-navbar .ng-cart, .ng-navbar .ng-search {
  width:42px; height:42px; padding:0 !important; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:1.15rem; color:#fff;
  transition:transform .25s ease, box-shadow .25s ease;
}
.ng-navbar .ng-cart { background:linear-gradient(135deg,#f2a341,#e08827); box-shadow:0 5px 14px rgba(242,163,65,.4); }
.ng-navbar .ng-search { background:linear-gradient(135deg,#1f8a9e,#166577); box-shadow:0 5px 14px rgba(31,138,158,.4); }
.ng-navbar .ng-cart:hover, .ng-navbar .ng-search:hover { transform:translateY(-3px) scale(1.06); color:#fff; }
.ng-navbar .ng-cart::after, .ng-navbar .ng-search::after { display:none; }

/* ===================================================================
   HERO CAROUSEL
   =================================================================== */
.ng-hero { position: relative; background: var(--ng-grey); }
.ng-hero .carousel-item { position: relative; }
.ng-hero .hero-media { height: clamp(420px, 70vh, 760px); overflow: hidden; }
.ng-hero .hero-media img { width: 100%; height: 100%; object-fit: cover; }
.ng-hero .hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(22,67,77,.78) 0%, rgba(22,67,77,.35) 55%, rgba(22,67,77,0) 100%);
}
.ng-hero .hero-caption {
  position: absolute; top: 50%; transform: translateY(-50%);
  left: 0; right: 0;
}
.ng-hero .hero-caption .eyebrow { color: #9fd4dd; }
.ng-hero .hero-caption h1,
.ng-hero .hero-caption .h1 {
  color: #fff; font-size: clamp(2.2rem, 5vw, 4.2rem);
  font-weight: 700; letter-spacing: -.03em;
  line-height: 1.05; margin-bottom: 1.2rem; max-width: 16ch;
}
.ng-hero .hero-caption p { color: #e7eef0; max-width: 46ch; margin-bottom: 1.8rem; }
.ng-hero .carousel-indicators { margin-bottom: 1.4rem; }
.ng-hero .carousel-indicators [data-bs-target] {
  width: 36px; height: 3px; border-radius: 0; background: rgba(255,255,255,.45);
}
.ng-hero .carousel-indicators .active { background: #fff; }
.ng-hero .carousel-control-prev, .ng-hero .carousel-control-next { width: 6%; opacity: .85; }

/* ===================================================================
   GENERIC SECTION SPACING
   =================================================================== */
.ng-section { padding: clamp(3.5rem, 7vw, 6.5rem) 0; }
.ng-section--cream { background: var(--ng-cream); }
.ng-section--grey  { background: var(--ng-grey); }
.ng-section--teal  { background: var(--ng-teal-deep); color:#dceaed; }
.ng-section--teal h2, .ng-section--teal h3 { color:#fff; }

.section-title { font-size: clamp(1.9rem,3.5vw,2.9rem); line-height:1.12; font-weight:600; }
.section-title span { color: var(--ng-teal); font-style: normal; font-weight:700; }
.title-rule { width:64px; height:2px; background:var(--ng-teal); margin:1.1rem 0; border:0; opacity:1; }
.title-rule.center { margin-left:auto; margin-right:auto; }

/* ===================================================================
   TRUST / STATS STRIP  (SEO + credibility)
   =================================================================== */
.ng-trust {
  background: var(--ng-teal); color:#fff; position:relative; overflow:hidden;
  background-image:
    linear-gradient(135deg, var(--ng-teal) 0%, var(--ng-teal-dark) 100%),
    radial-gradient(circle at 20% 0%, rgba(255,255,255,.08), transparent 50%);
}
.ng-trust .stat { padding: 2.6rem 1rem; text-align:center; transition:transform .3s ease; }
.ng-trust .stat:hover { transform:translateY(-5px); }
.ng-trust .stat .fa { font-size:1.8rem; color:var(--ng-gold); margin-bottom:.7rem; display:block; }
.ng-trust [class*="col-"]:nth-child(1) .stat .fa { color:#ffe08a; }
.ng-trust [class*="col-"]:nth-child(2) .stat .fa { color:#ffb38a; }
.ng-trust [class*="col-"]:nth-child(3) .stat .fa { color:#9ff0dd; }
.ng-trust [class*="col-"]:nth-child(4) .stat .fa { color:#bff0c8; }
.ng-trust .stat .num { font-family: var(--ng-serif); font-weight:700; font-size: clamp(2.2rem,4vw,3.2rem); line-height:1; }
.ng-trust .stat .lbl { font-size:.74rem; letter-spacing:.2em; text-transform:uppercase; color:#cfeaef; margin-top:.6rem; }
.ng-trust .col-6:not(:last-child) .stat,
.ng-trust [class*="col-"] .stat { position:relative; }
.ng-trust [class*="col-"] + [class*="col-"] .stat::before {
  content:""; position:absolute; left:0; top:25%; bottom:25%; width:1px; background:rgba(255,255,255,.22);
}

/* ===================================================================
   PRODUCT / CATEGORY CARDS
   =================================================================== */
.ng-cat-head {
  margin-bottom: 2.5rem; padding: 1.6rem 1.8rem; background:#fff;
  border:1px solid var(--ng-line); border-left:4px solid var(--ng-teal); border-radius:6px;
}
.ng-cat-head h2 { font-size: clamp(1.6rem,2.6vw,2.2rem); display:flex; align-items:center; gap:.7rem; margin:0; }
.ng-cat-head h2 .fa { color: var(--ng-gold); font-size:.85em; }
.ng-cat-head .title-rule { margin:.9rem 0; }
.ng-cat-head .ng-prose { margin:0; max-width:none; color:#3c4548; }
.ng-cat-head .ng-prose p:last-child { margin-bottom:0; }

.product-card {
  background:#fff; border:1px solid var(--ng-line); border-radius:10px; overflow:hidden;
  height:100%; transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
  position:relative;
}
.product-card::before {
  content:""; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg, var(--ng-teal), var(--ng-sky));
  transform:scaleX(0); transform-origin:left; transition:transform .35s ease; z-index:2;
}
.product-card:hover::before { transform:scaleX(1); }
.product-card:hover { transform: translateY(-6px); box-shadow: 0 18px 40px rgba(16,63,74,.15); border-color:var(--ng-sky); }
.product-card .img-wrap { aspect-ratio: 4/3; overflow:hidden; background:var(--ng-grey); }
.product-card .img-wrap img { width:100%; height:100%; object-fit:cover; transition: transform .6s ease; }
.product-card:hover .img-wrap img { transform: scale(1.06); }
.product-card .product_name { padding:1rem 1.1rem; }
.product-card .product_name a {
  font-family: var(--ng-serif); font-size:1.15rem; font-weight:600; color:var(--ng-ink); line-height:1.25;
}
.product-card:hover .product_name a { color: var(--ng-teal); }

/* product listing rows (from home-product.php / products.php) */
.product_listing_box .details {
  background:#fff; border:1px solid var(--ng-line); border-radius:12px;
  padding:1.5rem; margin-bottom:1.4rem; position:relative; overflow:hidden;
  transition: box-shadow .3s ease, transform .3s ease, border-color .3s ease;
}
/* left accent bar that grows on hover */
.product_listing_box .details::before {
  content:""; position:absolute; left:0; top:0; bottom:0; width:4px;
  background:linear-gradient(180deg, var(--ng-teal), var(--ng-sky));
  transform:scaleY(0); transform-origin:top; transition:transform .35s ease;
}
.product_listing_box .details:hover::before { transform:scaleY(1); }
.product_listing_box .details:hover {
  box-shadow:0 16px 40px rgba(16,63,74,.13); transform:translateY(-4px); border-color:var(--ng-sky);
}
/* framed product image */
.product_listing_box .details .col-md-3 {
  display:flex; align-items:center; justify-content:center;
}
.product_listing_box .details .img-thumbnail {
  border:1px solid var(--ng-line); padding:.6rem; background:#fff; border-radius:10px;
  max-height:200px; object-fit:contain; transition:transform .4s ease;
}
.product_listing_box .details:hover .img-thumbnail { transform:scale(1.04); }

/* details column with more life */
.product_listing_box .details_name { padding-left:.4rem; }
.product_listing_box .details_name h3 { font-size:1.45rem; margin-bottom:.5rem; line-height:1.2; }
.product_listing_box .details_name h3 a { color:var(--ng-ink); transition:color .25s ease; }
.product_listing_box .details:hover .details_name h3 a { color:var(--ng-teal); }

/* tag badges fill the blank space (global — works in listing rows & spec box) */
.ng-prod-tags { display:flex; flex-wrap:wrap; gap:.45rem; margin:.6rem 0 .9rem; }
.ng-prod-tags span {
  display:inline-flex; align-items:center;
  font-size:.72rem; letter-spacing:.04em; padding:.32rem .7rem; border-radius:50px;
  background:#fff; color:var(--ng-teal-dark); border:1px solid var(--ng-line); font-weight:500;
}
.ng-prod-tags span .fa { margin-right:.4rem; color:var(--ng-teal); }
.ng-spec-box .ng-prod-tags span { background:#fff; }

.product_listing_box .details_name .link { display:block; margin-bottom:.3rem; }
.product_listing_box .ng-prod-code { font-size:.85rem; color:var(--ng-muted); margin:0; }
.product_listing_box .ng-prod-code strong { color:var(--ng-ink); }

/* right-side quote/enquiry aside card */
.ng-prod-aside {
  background:var(--ng-cream); border:1px solid var(--ng-line); border-radius:10px;
  padding:1.1rem 1.2rem;
}
.ng-aside-title {
  font-family:var(--ng-serif); font-weight:600; font-size:1rem; color:var(--ng-ink);
  margin:0 0 .7rem; padding-bottom:.5rem; border-bottom:2px solid var(--ng-line);
}
.ng-aside-points { list-style:none; margin:0 0 .9rem; padding:0; }
.ng-aside-points li { font-size:.85rem; color:#3c4548; padding:.25rem 0; }
.ng-aside-points li .fa { color:var(--ng-teal); margin-right:.5rem; }
.ng-aside-btn {
  display:flex; align-items:center; justify-content:center; gap:.2rem;
  padding:.55rem; border-radius:7px; font-size:.82rem; font-weight:600; margin-bottom:.5rem;
  color:#fff; transition:transform .2s ease, filter .2s ease;
}
.ng-aside-btn:last-child { margin-bottom:0; }
.ng-aside-btn:hover { transform:translateY(-2px); color:#fff; filter:brightness(.95); }
.ng-aside-wa { background:#25d366; }
.ng-aside-call { background:var(--ng-teal); }
.product_listing_box .details_name .link a { font-size:.8rem; color:var(--ng-muted); word-break:break-all; }
.product_listing_box .details_name .link a::before { content:"\f0c1"; font-family:FontAwesome; margin-right:.4rem; color:var(--ng-sky); }
.product_listing_box .btngroup { margin-top:1rem; }

/* ===================================================================
   FEATURE / SPLIT SECTIONS
   =================================================================== */
.ng-split img { width:100%; border-radius:4px; box-shadow:0 20px 50px rgba(22,67,77,.16); }
.ng-card-teal {
  background: var(--ng-teal); color:#fff; padding: clamp(2rem,4vw,3.4rem);
  border-radius:4px;
}
.ng-card-teal h2, .ng-card-teal h3 { color:#fff; }
.ng-card-teal p { color: #d9eaed; }

/* numbered process list */
.ng-process { list-style:none; margin:0; padding:0; counter-reset: step; }
.ng-process li {
  display:flex; gap:1.2rem; align-items:flex-start;
  padding:1.1rem 0; border-bottom:1px solid var(--ng-line);
}
.ng-process li::before {
  counter-increment: step; content: counter(step,decimal-leading-zero);
  font-family: var(--ng-serif); font-size:1.4rem; color:var(--ng-teal); min-width:2.2rem;
}
.ng-process h4 { font-size:1.2rem; margin:0 0 .2rem; }
.ng-process p { margin:0; color:var(--ng-muted); font-size:.95rem; }

/* ===================================================================
   SEO CONTENT / FAQ / ACCORDION
   =================================================================== */
.ng-prose p { color:#3c4548; margin-bottom:1.1rem; }
.ng-prose h2, .ng-prose h3 { margin-top:2rem; }

.accordion-ng .accordion-item { border:1px solid var(--ng-line); border-radius:4px !important; margin-bottom:.8rem; overflow:hidden; }
.accordion-ng .accordion-button {
  font-family: var(--ng-serif); font-size:1.25rem; font-weight:600; color:var(--ng-ink); background:#fff;
}
.accordion-ng .accordion-button:not(.collapsed) { color:var(--ng-teal); background:var(--ng-cream); box-shadow:none; }
.accordion-ng .accordion-button:focus { box-shadow:none; border-color:var(--ng-line); }
.accordion-ng .accordion-button::after { filter:none; }

/* keyword pill chips (SEO internal linking) */
.ng-chips { display:flex; flex-wrap:wrap; gap:.6rem; }
.ng-chips a {
  display:inline-block; padding:.5rem 1.1rem; border:1px solid var(--ng-line);
  border-radius:50px; font-size:.82rem; color:var(--ng-ink); background:#fff; transition:all .25s ease;
}
.ng-chips a:hover { background:var(--ng-teal); color:#fff; border-color:var(--ng-teal); transform:translateY(-2px); }
.ng-chips a:nth-child(5n+2):hover { background:var(--ng-coral); border-color:var(--ng-coral); }
.ng-chips a:nth-child(5n+3):hover { background:var(--ng-gold); border-color:var(--ng-gold); }
.ng-chips a:nth-child(5n+4):hover { background:var(--ng-green); border-color:var(--ng-green); }
.ng-chips a:nth-child(5n+5):hover { background:var(--ng-violet); border-color:var(--ng-violet); }

/* ===================================================================
   INNER PAGE BANNER
   =================================================================== */
.innerbanner {
  position:relative; min-height:320px; display:flex; align-items:center;
  background-size:cover !important; background-position:center !important;
}
.innerbanner::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(22,67,77,.82), rgba(22,67,77,.45)); }
.innerbanner .container { position:relative; z-index:2; }
.innerbanner .heading { font-family:var(--ng-serif); color:#fff; font-size:clamp(2.2rem,4vw,3.4rem); }
.innerbanner .breadcrumb { margin-top:.6rem; }
.innerbanner .breadcrumb a, .innerbanner .breadcrumb-item { color:#cfe2e6; font-size:.84rem; letter-spacing:.06em; }
.innerbanner .breadcrumb-item.active { color:#fff; }
.innerbanner .breadcrumb-item+.breadcrumb-item::before { color:#9fc4cb; }

.right_section .details_heading { font-size:clamp(1.6rem,2.6vw,2.1rem); margin-bottom:1.2rem; }
.right_section p { color:#3c4548; }

/* left panel */
.left-menu .ng-side-card { background:var(--ng-cream); border:1px solid var(--ng-line); border-radius:4px; padding:1.6rem; }
.left-menu .ng-side-card h3 { font-size:1.3rem; border-bottom:2px solid var(--ng-teal); padding-bottom:.6rem; margin-bottom:1rem; }
.left-menu .ng-side-card ul { list-style:none; padding:0; margin:0; }
.left-menu .ng-side-card li a { display:block; padding:.5rem 0; border-bottom:1px dashed var(--ng-line); color:var(--ng-ink); font-size:.92rem; }
.left-menu .ng-side-card li a:hover { color:var(--ng-teal); padding-left:.4rem; }

/* ===================================================================
   FOOTER
   =================================================================== */
.footer-icon { background: var(--ng-cream); padding: clamp(2.5rem,5vw,4rem) 0; border-top:1px solid var(--ng-line); }
.service-box { height:100%; }
.service-box .icon-bx-wraper {
  display:flex; flex-direction:column; gap:.9rem; align-items:center; text-align:center;
  background:#fff; padding:2rem 1.6rem;
  border:1px solid var(--ng-line); border-radius:8px; height:100%;
  transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.service-box .icon-bx-wraper:hover { transform:translateY(-6px); box-shadow:0 18px 40px rgba(22,67,77,.14); border-color:var(--ng-teal); }
.service-box .icon-lg {
  color:#fff; background:linear-gradient(135deg, var(--ng-teal), var(--ng-teal-dark));
  width:60px; height:60px; border-radius:14px;
  display:flex; align-items:center; justify-content:center; font-size:1.5rem; flex:0 0 60px;
  box-shadow:0 8px 20px rgba(31,138,158,.3);
}
/* varied accent colours per card */
.footer-icon [class*="col-"]:nth-child(1) .icon-lg { background:linear-gradient(135deg,#1f8a9e,#166577); box-shadow:0 8px 20px rgba(31,138,158,.3); }
.footer-icon [class*="col-"]:nth-child(2) .icon-lg { background:linear-gradient(135deg,#ef6f5b,#d64f3a); box-shadow:0 8px 20px rgba(239,111,91,.3); }
.footer-icon [class*="col-"]:nth-child(3) .icon-lg { background:linear-gradient(135deg,#f2a341,#e08827); box-shadow:0 8px 20px rgba(242,163,65,.3); }
.footer-icon [class*="col-"]:nth-child(4) .icon-lg { background:linear-gradient(135deg,#3bb978,#2a9c61); box-shadow:0 8px 20px rgba(59,185,120,.3); }
.footer-icon [class*="col-"]:nth-child(1) .icon-bx-wraper:hover { border-color:var(--ng-teal); }
.footer-icon [class*="col-"]:nth-child(2) .icon-bx-wraper:hover { border-color:var(--ng-coral); }
.footer-icon [class*="col-"]:nth-child(3) .icon-bx-wraper:hover { border-color:var(--ng-gold); }
.footer-icon [class*="col-"]:nth-child(4) .icon-bx-wraper:hover { border-color:var(--ng-green); }
.service-box .dlab-tilte { font-size:1.2rem; margin-bottom:.3rem; }
.service-box p { font-size:.88rem; color:var(--ng-muted); margin:0; line-height:1.65; }

.sectionf { background:var(--ng-cream-soft); padding: clamp(2.5rem,5vw,4rem) 0; border-top:1px solid var(--ng-line); }
.footer_menu h3 { font-size:1.1rem; margin-bottom:.9rem; padding-bottom:.5rem; border-bottom:2px solid var(--ng-line); }
footer_menu h3 a, .footer_menu h3 a { color:var(--ng-ink); }
.footer_menu h3 a:hover { color:var(--ng-teal); }
.footer_menu ul { list-style:none; padding:0; margin:0; }
.footer_menu li a { color:var(--ng-muted); font-size:.86rem; line-height:2; transition:color .2s ease, padding-left .2s ease; }
.footer_menu li a:hover { color:var(--ng-teal); padding-left:.3rem; }

footer.fullwidth {
  background:var(--ng-teal-deep); color:#bcd3d8; position:relative;
  background-image:
    radial-gradient(circle at 12% 20%, rgba(44,124,140,.35), transparent 45%),
    radial-gradient(circle at 88% 90%, rgba(44,124,140,.22), transparent 40%);
}
footer.fullwidth::before {
  content:""; position:absolute; top:0; left:0; right:0; height:4px;
  background:linear-gradient(90deg, var(--ng-teal) 0%, var(--ng-gold) 50%, var(--ng-teal) 100%);
}
footer .footer_top { padding: clamp(3rem,5vw,4.5rem) 0 clamp(2rem,4vw,3rem); border-bottom:1px solid rgba(255,255,255,.12); }
footer .footer_title {
  font-family:var(--ng-serif); color:#fff; font-size:1.3rem; margin-bottom:1.4rem;
  position:relative; padding-bottom:.7rem; font-weight:600;
}
footer .footer_title::after {
  content:""; position:absolute; left:0; bottom:0; width:42px; height:3px;
  background:var(--ng-gold); border-radius:2px;
}
footer .footer_nav ul { list-style:none; padding:0; margin:0; }
footer .footer_nav li a {
  color:#bcd3d8; font-size:.92rem; line-height:1; display:inline-flex; align-items:center;
  padding:.5rem 0; transition:color .25s ease, transform .25s ease;
}
footer .footer_nav li a .fa { color:var(--ng-gold); transition:transform .25s ease; }
footer .footer_nav li a:hover { color:#fff; transform:translateX(5px); }
footer .add_footer { display:flex; gap:.9rem; margin-bottom:1.1rem; align-items:flex-start; }
footer .add_footer .icon {
  color:var(--ng-gold); background:rgba(255,255,255,.07); width:38px; height:38px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; flex:0 0 38px; font-size:.95rem;
}
footer .add_footer .add_text { padding-top:.35rem; line-height:1.5; }
footer .add_footer a { color:#bcd3d8; transition:color .25s ease; }
footer .add_footer a:hover { color:#fff; }
.footer-social { display:flex; gap:.6rem; margin-top:1.4rem; }
.footer-social a {
  width:40px; height:40px; border-radius:50%; border:1px solid rgba(255,255,255,.2);
  display:flex; align-items:center; justify-content:center; color:#cfe2e6; transition:all .25s ease;
}
.footer-social a:hover { background:var(--ng-teal); border-color:var(--ng-teal); color:#fff; transform:translateY(-3px); }
footer .footer_end { padding:1.8rem 0; }
footer .footer_end p { font-size:.78rem; color:#8fb0b6; line-height:1.8; margin-bottom:.6rem; }
footer .footer_end strong { color:#cfe2e6; }

/* support floating fab — contact buttons always visible (bottom-right) */
.inner-fabs {
  position:fixed; right:20px; bottom:20px; z-index:1040;
  display:flex; flex-direction:column; gap:.7rem;
}
.inner-fabs a {
  width:52px; height:52px; border-radius:50%; background:var(--ng-teal); color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:1.25rem;
  box-shadow:0 6px 18px rgba(22,67,77,.28);
  transition:transform .25s ease, background .25s ease;
}
.inner-fabs a:hover { background:var(--ng-teal-deep); color:#fff; transform:translateY(-3px) scale(1.06); }
.inner-fabs a.fab-wa { background:#25d366; }
.inner-fabs a.fab-wa:hover { background:#1da851; }

/* back to top — independent, bottom-LEFT so it never overlaps the contact stack */
.returntotop {
  position:fixed; left:20px; bottom:20px; z-index:1040;
  width:46px; height:46px; border-radius:50%; background:var(--ng-ink); color:#fff;
  display:none; align-items:center; justify-content:center; font-size:1.1rem;
  box-shadow:0 6px 18px rgba(0,0,0,.25);
  transition:transform .25s ease, background .25s ease;
}
.returntotop:hover { background:#000; color:#fff; transform:translateY(-3px); }
.returntotop.show { display:flex; }
.support { display:none; } /* legacy toggle no longer used */

/* loading bar */
.loading_bar { display:none; }
.loading_page { text-align:center; padding:1.5rem; color:var(--ng-muted); letter-spacing:.1em; }

/* ---------- Reveal-on-scroll ---------- */
.reveal { opacity:0; transform:translateY(28px); transition:opacity .7s ease, transform .7s ease; }
.reveal.in { opacity:1; transform:none; }

/* ---------- Responsive ---------- */
@media (max-width: 991.98px){
  .ng-hero .hero-overlay { background: linear-gradient(180deg, rgba(22,67,77,.55), rgba(22,67,77,.75)); }
  .ng-navbar .nav-link::after { display:none; }
}
@media (max-width: 575.98px){
  .ng-trust [class*="col-"] + [class*="col-"] .stat::before { display:none; }
}

/* ===================================================================
   INNER PAGE: breadcrumb strip, sidebar menu, feature lists,
   product detail — added for products / services / tender pages
   =================================================================== */

/* breadcrumb strip below banner */
.bradiumsec { background:var(--ng-cream); border-bottom:1px solid var(--ng-line); padding:.8rem 0; }
.bradiumsec a { color:var(--ng-teal); font-size:.85rem; }
.bradiumsec a:hover { color:var(--ng-teal-deep); }

/* keyword/feature checklists (services page) */
.ng-feature-list ul { list-style:none; padding:0; margin:0; }
.ng-feature-list li {
  position:relative; padding:.45rem 0 .45rem 1.8rem; border-bottom:1px dashed var(--ng-line);
  color:#3c4548; font-size:.95rem;
}
.ng-feature-list li::before {
  content:"\f00c"; font-family:FontAwesome; position:absolute; left:0; top:.5rem;
  color:var(--ng-teal); font-size:.8rem;
}

/* sidebar category menu (left_pannel.php) */
.left_section { /* legacy wrapper, now inside .ng-side-card */ }
#cssmenu { font-family:var(--ng-sans); }
#cssmenu > ul { list-style:none; margin:0; padding:0; }
#cssmenu > ul > li { border-bottom:1px solid var(--ng-line); }
#cssmenu > ul > li > a {
  display:block; padding:.7rem .2rem; color:var(--ng-ink); font-weight:500; font-size:.95rem;
  position:relative; transition:color .2s ease;
}
#cssmenu > ul > li > a:hover,
#cssmenu > ul > li.active > a { color:var(--ng-teal); }
#cssmenu .toggle_arrow {
  position:absolute; right:.3rem; top:50%; width:8px; height:8px; margin-top:-5px;
  border-right:2px solid var(--ng-muted); border-bottom:2px solid var(--ng-muted);
  transform:rotate(45deg); transition:transform .25s ease;
}
#cssmenu > ul > li.active .toggle_arrow { transform:rotate(-135deg); border-color:var(--ng-teal); }
#cssmenu ul ul { list-style:none; margin:0; padding:.2rem 0 .6rem .2rem; display:none; }
#cssmenu ul ul li a {
  display:block; padding:.35rem 0 .35rem .9rem; color:var(--ng-muted); font-size:.88rem;
  border-left:2px solid var(--ng-line); transition:all .2s ease;
}
#cssmenu ul ul li a:hover { color:var(--ng-teal); border-left-color:var(--ng-teal); padding-left:1.1rem; }

/* product detail page */
.product-detail-img {
  background:#fff; border:1px solid var(--ng-line); border-radius:6px; padding:1rem;
  box-shadow:0 12px 30px rgba(22,67,77,.08);
}
.product-detail-img img { border-radius:4px; }
.ng-spec-box {
  background:var(--ng-cream); border:1px solid var(--ng-line); border-left:4px solid var(--ng-teal);
  border-radius:6px; padding:1.3rem 1.5rem; margin-top:1.2rem;
}
.ng-spec-box .hightlights {
  font-family:var(--ng-serif); font-weight:600; font-size:1.15rem; color:var(--ng-ink); margin-bottom:.8rem;
}
.ng-spec-box p { color:#3c4548; }
.related-products .product-card .product_name a { font-size:1rem; }

/* ===================================================================
   PRODUCT DETAIL — description & technical specification cards
   =================================================================== */
.ng-detail-blocks { margin-top:1rem; }
.ng-detail-card {
  background:#fff; border:1px solid var(--ng-line); border-radius:12px; padding:1.6rem 1.8rem; height:100%;
  border-top:3px solid var(--ng-teal); box-shadow:0 8px 24px rgba(16,63,74,.06);
}
.ng-detail-title {
  font-family:var(--ng-serif); font-size:1.35rem; font-weight:600; color:var(--ng-ink);
  margin:0 0 1rem; padding-bottom:.7rem; border-bottom:1px solid var(--ng-line);
}
.ng-detail-title .fa { color:var(--ng-teal); }
.ng-detail-body { color:#3c4548; }
.ng-detail-body p { margin-bottom:.9rem; }
.ng-detail-body table { width:100%; border-collapse:collapse; margin:1rem 0; font-size:.92rem; }
.ng-detail-body table td, .ng-detail-body table th {
  border:1px solid var(--ng-line); padding:.6rem .8rem; text-align:left; vertical-align:top;
}
.ng-detail-body table th, .ng-detail-body table tr:first-child td { background:var(--ng-cream); font-weight:600; color:var(--ng-ink); }
.ng-detail-body ul, .ng-detail-body ol { padding-left:1.3rem; margin-bottom:.9rem; }
.ng-detail-body li { margin-bottom:.35rem; }
.ng-detail-body img { max-width:100%; height:auto; border-radius:6px; }

/* ===================================================================
   PRODUCT DETAIL — SEO sections (why / applications / faq)
   =================================================================== */
.ng-why-card {
  background:#fff; border:1px solid var(--ng-line); border-radius:12px; padding:1.6rem 1.3rem; height:100%;
  text-align:center; transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.ng-why-card:hover { transform:translateY(-5px); box-shadow:0 16px 36px rgba(16,63,74,.12); border-color:var(--ng-sky); }
.ng-why-ico {
  width:58px; height:58px; border-radius:14px; display:inline-flex; align-items:center; justify-content:center;
  color:#fff; font-size:1.5rem; margin-bottom:1rem;
}
.ng-why-card h3 { font-size:1.1rem; margin-bottom:.5rem; }
.ng-why-card p { font-size:.88rem; color:var(--ng-muted); margin:0; line-height:1.6; }

.ng-app-item {
  display:flex; align-items:center; gap:.9rem; background:#fff; border:1px solid var(--ng-line);
  border-left:4px solid var(--ng-teal); border-radius:8px; padding:.9rem 1.1rem; height:100%;
  transition:transform .25s ease, box-shadow .25s ease;
}
.ng-app-item:hover { transform:translateX(4px); box-shadow:0 8px 20px rgba(16,63,74,.1); }
.ng-app-item .fa { color:var(--ng-teal); font-size:1.3rem; width:1.6rem; text-align:center; }
.ng-app-item span { font-weight:500; font-size:.95rem; color:var(--ng-ink); }

.ng-seo-why, .ng-seo-apps, .ng-seo-faq { padding-top:1rem; }
.ng-seo-apps { background:var(--ng-cream); border-radius:14px; padding:2.2rem; }

/* ===================================================================
   SEARCH / CART pages — alphabet bar, pagination, empty state, cart
   =================================================================== */
.ng-alpha-bar {
  background:#fff; border:1px solid var(--ng-line); border-radius:10px; padding:1rem 1.2rem;
  display:flex; flex-wrap:wrap; align-items:center; gap:.8rem;
}
.ng-alpha-label { font-weight:600; color:var(--ng-ink); font-size:.92rem; }
.ng-alpha-links { display:flex; flex-wrap:wrap; gap:.35rem; }
.ng-alpha-links .alpha {
  display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px;
  border-radius:8px; border:1px solid var(--ng-line); color:var(--ng-ink); font-weight:500; font-size:.85rem;
  transition:all .2s ease;
}
.ng-alpha-links .alpha:hover, .ng-alpha-links .alpha.active { background:var(--ng-teal); color:#fff; border-color:var(--ng-teal); }

/* pagination (the paginate() helper output) */
.ng-pagination { display:flex; justify-content:center; }
.ng-pagination a, .ng-pagination span {
  display:inline-block; padding:.5rem .85rem; margin:0 .2rem; border-radius:8px;
  border:1px solid var(--ng-line); color:var(--ng-ink); text-decoration:none; font-size:.9rem;
}
.ng-pagination a:hover { background:var(--ng-cream); color:var(--ng-teal); }
.ng-pagination .current, .ng-pagination strong, .ng-pagination b {
  background:var(--ng-teal); color:#fff; border-color:var(--ng-teal);
}

/* empty state */
.ng-empty-state { padding:3.5rem 1rem; }
.ng-empty-state .fa { font-size:3.2rem; color:var(--ng-line); margin-bottom:1rem; }
.ng-empty-state h1, .ng-empty-state h2 { margin-bottom:.5rem; }

/* cart table */
.ng-cart-card { background:#fff; border:1px solid var(--ng-line); border-radius:12px; padding:1.8rem; box-shadow:0 8px 24px rgba(16,63,74,.06); }
.ng-cart-table thead th {
  background:var(--ng-teal-deep); color:#fff; font-size:.78rem; letter-spacing:.06em; text-transform:uppercase;
  border:0; padding:.85rem 1rem; font-weight:600;
}
.ng-cart-table thead th:first-child { border-top-left-radius:8px; }
.ng-cart-table thead th:last-child { border-top-right-radius:8px; }
.ng-cart-table tbody td { padding:.85rem 1rem; border-bottom:1px solid var(--ng-line); vertical-align:middle; }
.ng-cart-table tbody tr:hover { background:var(--ng-cream); }

/* ===================================================================
   MOE TENDERS — country / region flag grids
   =================================================================== */
.ng-seo-countries { background:var(--ng-cream); border-radius:14px; padding:2.4rem 2rem; }
.ng-region-block { margin-bottom:1.8rem; }
.ng-region-block:last-child { margin-bottom:0; }
.ng-region-title {
  font-family:var(--ng-serif); font-size:1.2rem; font-weight:600; color:var(--ng-ink);
  margin:0 0 1rem; padding-bottom:.6rem; border-bottom:2px solid var(--ng-line);
}
.ng-region-title .fa { color:var(--ng-teal); margin-right:.4rem; }
.ng-flag-grid { display:flex; flex-wrap:wrap; gap:.6rem; }
.ng-flag-item {
  display:inline-flex; align-items:center; gap:.5rem; background:#fff;
  border:1px solid var(--ng-line); border-radius:50px; padding:.4rem .9rem .4rem .5rem;
  font-size:.85rem; font-weight:500; color:var(--ng-ink); transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.ng-flag-item:hover { transform:translateY(-2px); box-shadow:0 8px 18px rgba(16,63,74,.1); border-color:var(--ng-sky); }
.ng-flag-item img { border-radius:3px; box-shadow:0 0 0 1px rgba(0,0,0,.06); display:block; }

/* ===================================================================
   MOE TENDERS — beautified contact CTA
   =================================================================== */
.ng-tender-cta {
  position:relative; overflow:hidden; border-radius:18px; padding:2.6rem 2.4rem;
  background:linear-gradient(135deg, var(--ng-teal) 0%, var(--ng-teal-deep) 100%);
  box-shadow:0 20px 50px rgba(16,63,74,.28);
}
/* decorative glow circles */
.ng-tender-cta::before, .ng-tender-cta::after {
  content:""; position:absolute; border-radius:50%; background:rgba(255,255,255,.06);
}
.ng-tender-cta::before { width:260px; height:260px; top:-110px; right:-60px; }
.ng-tender-cta::after  { width:180px; height:180px; bottom:-90px; left:18%; background:rgba(56,182,201,.18); }
.ng-tender-cta > .row { position:relative; z-index:1; }

.ng-cta-eyebrow {
  display:inline-block; font-size:.72rem; letter-spacing:.18em; text-transform:uppercase;
  color:#bfe9f0; font-weight:600; margin-bottom:.6rem;
}
.ng-cta-title {
  font-family:var(--ng-serif); color:#fff; font-size:clamp(1.5rem,2.6vw,2rem); font-weight:700;
  margin:0 0 .7rem; letter-spacing:-.02em;
}
.ng-cta-sub { color:#dcecef; font-size:.98rem; line-height:1.7; max-width:54ch; }
.ng-cta-sub strong { color:#fff; }

.ng-cta-actions { display:flex; flex-direction:column; gap:.7rem; }
.ng-cta-btn {
  display:flex; align-items:center; gap:.9rem; background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.22); border-radius:12px; padding:.7rem .9rem;
  color:#fff; transition:transform .2s ease, background .2s ease, border-color .2s ease;
  backdrop-filter:blur(2px);
}
.ng-cta-btn:hover { transform:translateY(-3px); background:#fff; color:var(--ng-teal-deep); border-color:#fff; }
.ng-cta-ico {
  width:42px; height:42px; flex:0 0 42px; border-radius:10px; background:rgba(255,255,255,.16);
  display:flex; align-items:center; justify-content:center; font-size:1.15rem; transition:background .2s ease, color .2s ease;
}
.ng-cta-btn:hover .ng-cta-ico { background:var(--ng-teal); color:#fff; }
.ng-cta-btn--wa:hover .ng-cta-ico { background:#25d366; }
.ng-cta-txt { display:flex; flex-direction:column; font-weight:700; font-size:1rem; line-height:1.25; letter-spacing:.01em; }
.ng-cta-txt small { font-weight:500; font-size:.72rem; opacity:.8; letter-spacing:.04em; text-transform:uppercase; margin-bottom:.05rem; }

/* ===================================================================
   CONTACTS — polished contact info cards
   =================================================================== */
.ng-contact-card {
  display:flex; flex-direction:column; align-items:flex-start; height:100%;
  background:#fff; border:1px solid var(--ng-line); border-radius:14px; padding:1.4rem;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.ng-contact-card:hover { transform:translateY(-5px); box-shadow:0 16px 36px rgba(16,63,74,.12); border-color:var(--ng-sky); }
.ng-contact-ico {
  width:52px; height:52px; border-radius:13px; display:flex; align-items:center; justify-content:center;
  color:#fff; font-size:1.4rem; margin-bottom:1rem;
}
.ng-contact-ico--wa { background:linear-gradient(135deg,#25d366,#1da851); }
.ng-contact-card small {
  font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--ng-muted); font-weight:600; margin-bottom:.25rem;
}
.ng-contact-card strong {
  font-family:var(--ng-serif); font-size:.98rem; font-weight:600; color:var(--ng-ink); line-height:1.35;
  overflow-wrap:anywhere; word-break:normal;
}
a.ng-contact-card:hover strong { color:var(--ng-teal); }

/* wide variant (email / website, 2-up second row) — horizontal layout */
.ng-contact-card--wide { flex-direction:row; align-items:center; gap:1rem; }
.ng-contact-card--wide .ng-contact-ico { margin-bottom:0; flex:0 0 52px; }
.ng-contact-card--wide .ng-contact-text { display:flex; flex-direction:column; }

/* ===================================================================
   ABOUT — product range cards + light stats variant
   =================================================================== */
.ng-range-card {
  background:#fff; border:1px solid var(--ng-line); border-radius:12px; padding:1.5rem 1.3rem; height:100%;
  transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.ng-range-card:hover { transform:translateY(-5px); box-shadow:0 16px 36px rgba(16,63,74,.12); border-color:var(--ng-sky); }
.ng-range-ico {
  width:52px; height:52px; border-radius:13px; display:inline-flex; align-items:center; justify-content:center;
  color:#fff; font-size:1.35rem; margin-bottom:1rem;
}
.ng-range-card h3 { font-size:1.08rem; margin-bottom:.5rem; line-height:1.25; }
.ng-range-card p { font-size:.86rem; color:var(--ng-muted); margin:0; line-height:1.6; }

/* light stats strip (on white about page) */
.ng-trust--light { background:var(--ng-cream); border-radius:14px; padding:1.6rem 1rem; }
.ng-trust--light .stat .num, .ng-trust--light .stat .lbl { color:var(--ng-ink); }
.ng-trust--light .stat .lbl { color:var(--ng-muted); }
.ng-trust--light .stat { border-color:var(--ng-line); }
.ng-trust--light [class*="col-"]:nth-child(1) .stat .fa { color:var(--ng-teal); }
.ng-trust--light [class*="col-"]:nth-child(2) .stat .fa { color:var(--ng-coral); }
.ng-trust--light [class*="col-"]:nth-child(3) .stat .fa { color:var(--ng-gold); }
.ng-trust--light [class*="col-"]:nth-child(4) .stat .fa { color:var(--ng-green); }

/* ===================================================================
   INDEX — lab category SEO cards
   =================================================================== */
.ng-lab-card {
  display:flex; flex-direction:column; align-items:flex-start; height:100%;
  background:#fff; border:1px solid var(--ng-line); border-radius:14px; padding:1.6rem 1.4rem;
  position:relative; overflow:hidden;
  transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.ng-lab-card::before {
  content:""; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg, var(--ng-teal), var(--ng-sky));
  transform:scaleX(0); transform-origin:left; transition:transform .35s ease;
}
.ng-lab-card:hover::before { transform:scaleX(1); }
.ng-lab-card:hover { transform:translateY(-6px); box-shadow:0 18px 40px rgba(16,63,74,.14); border-color:var(--ng-sky); }
.ng-lab-ico {
  width:56px; height:56px; border-radius:14px; display:inline-flex; align-items:center; justify-content:center;
  color:#fff; font-size:1.5rem; margin-bottom:1rem;
}
.ng-lab-card h3 { font-size:1.15rem; margin-bottom:.5rem; color:var(--ng-ink); line-height:1.25; }
.ng-lab-card p { font-size:.86rem; color:var(--ng-muted); line-height:1.6; margin:0 0 1rem; }
.ng-lab-link {
  margin-top:auto; font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; font-weight:600; color:var(--ng-teal);
  display:inline-flex; align-items:center; gap:.4rem; transition:gap .25s ease;
}
.ng-lab-card:hover .ng-lab-link { gap:.7rem; color:var(--ng-teal-dark); }