/* ==========================================================================
   Nirgun Motor Recyclers: site theme (on top of Bootstrap 5)
   ========================================================================== */

:root{
  --nm-ink: #0a1220;
  --nm-forest-900: #0d2550;
  --nm-forest-800: #123a6b;
  --nm-forest-700: #164a30;
  --nm-green: #1f7a34;
  --nm-green-dark: #145c28;
  --nm-green-bright: #4fc94a;
  --nm-green-light: #eaf7ea;
  --nm-navy: #123f8e;
  --nm-navy-bright: #4c7fe8;
  --nm-navy-light: #eaf1fe;
  --nm-gold: #123f8e;
  --nm-gold-light: #4c7fe8;
  --nm-cream: #f8f6f0;
  --nm-paper: #ffffff;
  --nm-ink-text: #17231d;
  --nm-slate-600: #55645d;
  --nm-slate-400: #8b978f;
  --nm-border: #e7ece7;
  --nm-blue: #2563eb;
  --nm-blue-light: #eaf1fe;
  --nm-teal: #0d9488;
  --nm-teal-light: #e6f7f5;
  --nm-coral: #e2572b;
  --nm-coral-light: #fdece5;
  --nm-violet: #7c3aed;
  --nm-violet-light: #f2eafe;
  --nm-radius: 1.25rem;
  --nm-radius-lg: 1.75rem;
  --nm-shadow-soft: 0 20px 60px -25px rgba(10,30,20,.25);
  --nm-shadow-lift: 0 30px 70px -20px rgba(10,30,20,.35);
  --bs-body-font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

*{ scrollbar-width: thin; scrollbar-color: var(--nm-green) transparent; }
::-webkit-scrollbar{ width: 9px; height: 9px; }
::-webkit-scrollbar-thumb{ background: var(--nm-green); border-radius: 10px; }
::-webkit-scrollbar-track{ background: var(--nm-cream); }

html{ scroll-behavior: smooth; }

body{
  color: var(--nm-ink-text);
  background-color: var(--nm-paper);
  overflow-x: hidden;
}

h1, h2, h3, h4, h5, .display-font{
  font-family: 'Sora', 'Inter', sans-serif;
  font-weight: 600;
  letter-spacing: -0.02em;
}

::selection{ background: var(--nm-green); color: #fff; }

/* ---------- Scroll progress bar ---------- */
.scroll-progress{
  position: fixed;
  top: 0; left: 0;
  height: 3px;
  width: 0%;
  background: linear-gradient(90deg, var(--nm-gold), var(--nm-green-bright));
  z-index: 1200;
  transition: width .1s linear;
}

/* ---------- Shared bits ---------- */
.section-eyebrow{
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--nm-green-dark);
  background: var(--nm-green-light);
  padding: .4rem 1rem;
  border-radius: 50rem;
  border: 1px solid rgba(30,138,84,.15);
}
.section-eyebrow.on-dark{
  color: #d8ffe9;
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.18);
}
.section-eyebrow i{ color: var(--nm-gold); }

.text-nm-green{ color: var(--nm-green) !important; }
.text-nm-gold{ color: var(--nm-gold) !important; }
.bg-nm-green{ background-color: var(--nm-green) !important; }
.bg-nm-ink{ background-color: var(--nm-ink) !important; }
.bg-nm-cream{ background-color: var(--nm-cream) !important; }
.bg-nm-green-light{ background-color: var(--nm-green-light) !important; }

.section-py{ padding-top: 6.5rem; padding-bottom: 6.5rem; }
.section-title{ font-size: clamp(1.9rem, 3vw, 2.7rem); }

/* Gradient headline signature */
.text-gradient-nm{
  background: linear-gradient(95deg, var(--nm-green-dark) 0%, var(--nm-green) 45%, var(--nm-gold) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: var(--nm-green-dark);
}

.divider-gold{
  width: 56px; height: 3px;
  background: linear-gradient(90deg, var(--nm-gold), transparent);
  border-radius: 3px;
  display: inline-block;
}

/* Decorative blurred blobs for depth on light sections */
.mesh-blob{
  position: absolute;
  border-radius: 50%;
  filter: blur(70px);
  opacity: .35;
  pointer-events: none;
  z-index: 0;
}

/* ---------- Buttons ---------- */
.btn-nm-primary{
  background: linear-gradient(135deg, var(--nm-green) 0%, var(--nm-green-dark) 100%);
  border: none;
  color: #fff;
  font-weight: 600;
  padding: .8rem 1.8rem;
  border-radius: 50rem;
  box-shadow: 0 14px 30px -10px rgba(20,98,57,.55);
  transition: all .25s cubic-bezier(.2,.8,.2,1);
}
.btn-nm-primary:hover, .btn-nm-primary:focus{
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 18px 38px -8px rgba(20,98,57,.65);
}

.btn-nm-outline{
  border: 1.5px solid rgba(255,255,255,.45);
  color: #fff;
  font-weight: 600;
  padding: .8rem 1.8rem;
  border-radius: 50rem;
  background: rgba(255,255,255,.05);
  backdrop-filter: blur(6px);
  transition: all .25s ease;
}
.btn-nm-outline:hover{
  background: rgba(255,255,255,.15);
  color: #fff;
  border-color: #fff;
  transform: translateY(-2px);
}

.btn-nm-gold{
  background: linear-gradient(135deg, var(--nm-gold-light), var(--nm-gold));
  border: none;
  color: #ffffff;
  font-weight: 700;
  padding: .8rem 1.8rem;
  border-radius: 50rem;
  box-shadow: 0 14px 30px -10px rgba(18,63,142,.55);
  transition: all .25s cubic-bezier(.2,.8,.2,1);
}
.btn-nm-gold:hover{
  color: #ffffff;
  transform: translateY(-2px);
  box-shadow: 0 18px 38px -8px rgba(18,63,142,.65);
}

.btn-nm-ghost-dark{
  border: 1.5px solid var(--nm-border);
  color: var(--nm-ink-text);
  font-weight: 600;
  padding: .8rem 1.8rem;
  border-radius: 50rem;
  background: #fff;
  transition: all .25s ease;
}
.btn-nm-ghost-dark:hover{
  border-color: var(--nm-green);
  color: var(--nm-green-dark);
  transform: translateY(-2px);
  box-shadow: var(--nm-shadow-soft);
}

.btn-nm-primary i, .btn-nm-gold i, .btn-nm-outline i, .btn-nm-ghost-dark i{
  transition: transform .25s cubic-bezier(.2,.8,.2,1);
  display: inline-block;
}
.btn-nm-primary:hover i, .btn-nm-gold:hover i, .btn-nm-outline:hover i, .btn-nm-ghost-dark:hover i{
  transform: translateX(3px);
}

/* Compact CTA button used in navbar */
.btn-nm-gold-sm{
  background: linear-gradient(135deg, var(--nm-gold-light), var(--nm-gold));
  border: none;
  color: #ffffff;
  font-weight: 700;
  font-size: .88rem;
  padding: .55rem 1.15rem;
  border-radius: 50rem;
  box-shadow: 0 10px 22px -8px rgba(18,63,142,.55);
  transition: all .25s cubic-bezier(.2,.8,.2,1);
  display: inline-flex;
  align-items: center;
  gap: .4rem;
}
.btn-nm-gold-sm:hover{
  color: #ffffff;
  transform: translateY(-2px);
  box-shadow: 0 14px 28px -6px rgba(18,63,142,.65);
}
.btn-nm-gold-sm i{ transition: transform .25s ease; }
.btn-nm-gold-sm:hover i{ transform: translateX(3px); }

/* ---------- Navbar ---------- */
.navbar-nm{
  padding-top: 1.15rem;
  padding-bottom: 1.15rem;
  background: transparent;
  transition: all .35s cubic-bezier(.2,.8,.2,1);
}
.navbar-nm::after{
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(18,63,142,.5), rgba(52,211,153,.5), transparent);
  opacity: 0;
  transition: opacity .35s ease;
}
.navbar-nm.is-scrolled{
  background: rgba(9,19,15,.8);
  backdrop-filter: blur(18px) saturate(150%);
  -webkit-backdrop-filter: blur(18px) saturate(150%);
  padding-top: .6rem;
  padding-bottom: .6rem;
  box-shadow: 0 14px 40px -18px rgba(0,0,0,.5);
}
.navbar-nm.is-scrolled::after{ opacity: 1; }

.navbar-brand-nm{
  display: flex;
  align-items: center;
  gap: .65rem;
  font-family: 'Sora', sans-serif;
  font-weight: 700;
  font-size: 1.2rem;
  color: #fff;
}
.navbar-brand-nm .logo-badge{
  background: #fff;
  border-radius: .7rem;
  padding: .4rem .65rem;
  display: flex;
  align-items: center;
  box-shadow: 0 10px 26px -8px rgba(0,0,0,.4);
  transition: transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease;
}
.navbar-brand-nm .logo-badge img{
  height: 34px;
  width: auto;
  display: block;
  transition: height .35s cubic-bezier(.2,.8,.2,1);
}
.navbar-brand-nm:hover .logo-badge{
  transform: scale(1.04);
  box-shadow: 0 14px 32px -8px rgba(0,0,0,.5);
}
.navbar-nm.is-scrolled .navbar-brand-nm .logo-badge{ padding: .3rem .55rem; }
.navbar-nm.is-scrolled .navbar-brand-nm .logo-badge img{ height: 28px; }

.nav-link-nm{
  font-weight: 500;
  font-size: .91rem;
  color: rgba(255,255,255,.78) !important;
  padding: .55rem 1.05rem !important;
  border-radius: 50rem;
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  transition: background .25s ease, color .25s ease;
}
.nav-link-nm i{ font-size: .95rem; opacity: .85; }
.nav-link-nm:hover{
  color: #fff !important;
  background: rgba(255,255,255,.08);
}
.nav-link-nm.active{
  color: var(--nm-green-bright) !important;
  background: rgba(52,211,153,.14);
}
.nav-link-nm.active i{ opacity: 1; }

.navbar-toggler{ border-color: rgba(255,255,255,.3); }
.navbar-toggler-icon{
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255,255,255,0.9)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
.navbar-collapse.show, .navbar-collapse.collapsing{
  background: rgba(10,21,17,.97);
  backdrop-filter: blur(16px);
  border-radius: 1rem;
  padding: 1rem;
  margin-top: .75rem;
}

/* Dropdown nav (Services / Company) — animated mega panel */
.nav-link-nm.dropdown-toggle::after{ vertical-align: .15em; opacity: .6; transition: transform .25s ease; }
.nav-item.dropdown.show .dropdown-toggle::after{ transform: rotate(-180deg); }

.navbar-nm .dropdown-menu.dropdown-menu-nm{
  display: block;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-10px);
  transition: opacity .22s ease, transform .22s ease, visibility .22s;
  pointer-events: none;
}
.navbar-nm .dropdown-menu.dropdown-menu-nm.show{
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
}
.dropdown-menu-nm{
  background: rgba(9,19,15,.98);
  backdrop-filter: blur(18px);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 1.1rem;
  padding: .6rem;
  margin-top: .75rem !important;
  box-shadow: 0 30px 70px -20px rgba(0,0,0,.6);
  min-width: 320px;
}
.dropdown-item-nm{
  display: flex;
  align-items: flex-start;
  gap: .8rem;
  padding: .7rem .75rem;
  border-radius: .8rem;
  color: rgba(255,255,255,.85);
  text-decoration: none;
  transition: background .2s ease;
}
.dropdown-item-nm:hover, .dropdown-item-nm:focus{
  background: rgba(255,255,255,.07);
  color: #fff;
}
.dropdown-item-nm .dd-icon{
  width: 42px; height: 42px;
  border-radius: .7rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.05rem;
  flex-shrink: 0;
}
.dropdown-item-nm .dd-icon.c-blue{ background: rgba(37,99,235,.18); color: #8fb4ff; }
.dropdown-item-nm .dd-icon.c-teal{ background: rgba(13,148,136,.2); color: #6be0d4; }
.dropdown-item-nm .dd-icon.c-gold{ background: rgba(18,63,142,.2); color: var(--nm-gold-light); }
.dropdown-item-nm .dd-title{
  font-weight: 600;
  font-size: .92rem;
  color: #fff;
  margin-bottom: .1rem;
}
.dropdown-item-nm .dd-desc{
  font-size: .78rem;
  color: rgba(255,255,255,.5);
  line-height: 1.35;
}
@media (min-width: 992px){
  .navbar-nav .dropdown:hover > .dropdown-menu.dropdown-menu-nm{
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
  }
}
@media (max-width: 991.98px){
  .dropdown-menu-nm{
    background: rgba(255,255,255,.04);
    box-shadow: none;
    min-width: 0;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    pointer-events: auto !important;
    display: none !important;
  }
  .dropdown-menu-nm.show{ display: block !important; }
}

/* ---------- Inner page hero (non-home pages) ---------- */
.page-hero{
  position: relative;
  background: radial-gradient(1100px 500px at 85% -10%, #1f5138 0%, transparent 60%), linear-gradient(160deg, var(--nm-ink) 0%, var(--nm-forest-900) 60%, #123a6b 100%);
  color: #fff;
  padding-top: 9.5rem;
  padding-bottom: 3.5rem;
  overflow: hidden;
}
.page-hero::after{
  content: "";
  position: absolute; inset: 0;
  background-image: radial-gradient(circle at 1px 1px, rgba(255,255,255,.1) 1px, transparent 1px);
  background-size: 26px 26px;
  opacity: .4;
  pointer-events: none;
}
.page-hero > .container{ position: relative; z-index: 1; }
.page-hero h1{
  font-size: clamp(1.9rem, 3.4vw, 2.8rem);
}
.breadcrumb-nm{
  display: flex;
  align-items: center;
  gap: .5rem;
  font-size: .85rem;
  color: rgba(255,255,255,.6);
  margin-bottom: 1rem;
}
.breadcrumb-nm a{ color: rgba(255,255,255,.75); text-decoration: none; }
.breadcrumb-nm a:hover{ color: var(--nm-gold-light); }

/* ---------- Hero ---------- */
.hero-nm{
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  color: #fff;
  overflow: hidden;
  padding-top: 7rem;
  background-color: var(--nm-ink);
}
.hero-bg-img{
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: 0;
}
.hero-nm::before{
  content: "";
  position: absolute; inset: 0;
  background:
    linear-gradient(180deg, rgba(8,18,14,.75) 0%, rgba(8,18,14,.55) 35%, rgba(6,15,11,.88) 100%),
    linear-gradient(100deg, rgba(6,15,11,.92) 0%, rgba(6,15,11,.55) 45%, rgba(6,15,11,.25) 100%);
  z-index: 1;
}
.hero-nm::after{
  content: "";
  position: absolute; inset: 0;
  background-image: radial-gradient(circle at 1px 1px, rgba(255,255,255,.12) 1px, transparent 1px);
  background-size: 28px 28px;
  opacity: .35;
  z-index: 1;
  mix-blend-mode: overlay;
}
.hero-nm > .container{ position: relative; z-index: 2; }

.hero-badge{
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.2);
  backdrop-filter: blur(8px);
  color: #eafff2;
  font-size: .8rem;
  font-weight: 600;
  padding: .45rem 1.1rem;
  border-radius: 50rem;
}
.hero-badge i{ color: var(--nm-gold-light); }

.hero-nm h1{
  font-size: clamp(2.3rem, 4.4vw, 3.6rem);
  line-height: 1.1;
}
.hero-nm .lead{
  color: rgba(255,255,255,.85);
  max-width: 36rem;
  font-size: 1.15rem;
}
.hero-underline{
  background: linear-gradient(180deg, transparent 62%, rgba(18,63,142,.55) 62%);
}

.hero-stats{
  border-top: 1px solid rgba(255,255,255,.15);
  margin-top: 2.75rem;
  padding-top: 1.75rem;
}
.hero-stats .stat-num{
  font-family: 'Sora', sans-serif;
  font-weight: 700;
  font-size: 1.7rem;
  color: #fff;
}
.hero-stats .stat-label{
  font-size: .78rem;
  color: rgba(255,255,255,.6);
}

/* Pill-style hero stats (richer variant) */
.hero-stats-row{
  display: flex;
  flex-wrap: wrap;
  gap: .8rem;
  margin-top: 2.5rem;
  padding-top: 1.75rem;
  border-top: 1px solid rgba(255,255,255,.15);
}
.hero-stat-pill{
  display: flex;
  align-items: center;
  gap: .7rem;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 1rem;
  padding: .65rem 1rem;
  backdrop-filter: blur(8px);
  flex: 1 1 auto;
}
.hero-stat-pill i{ font-size: 1.25rem; color: var(--nm-gold-light); flex-shrink: 0; }
.hero-stat-pill .stat-num{
  display: block;
  font-family: 'Sora', sans-serif;
  font-weight: 700;
  font-size: 1.1rem;
  color: #fff;
  line-height: 1.15;
}
.hero-stat-pill .stat-label{
  display: block;
  font-size: .72rem;
  color: rgba(255,255,255,.6);
  white-space: nowrap;
}

/* Floating rating badge over hero */
.hero-float-badge{
  position: absolute;
  z-index: 3;
  left: -2.25rem;
  bottom: -1.75rem;
  background: #fff;
  border-radius: 1rem;
  padding: .85rem 1.15rem;
  box-shadow: 0 22px 48px -14px rgba(0,0,0,.45);
  display: flex;
  align-items: center;
  gap: .7rem;
  animation: float-badge 4.5s ease-in-out infinite;
}
@keyframes float-badge{
  0%, 100%{ transform: translateY(0); }
  50%{ transform: translateY(-10px); }
}
.hero-float-badge .fb-icon{
  width: 40px; height: 40px;
  border-radius: .7rem;
  background: var(--nm-green-light);
  color: var(--nm-green-dark);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.2rem;
  flex-shrink: 0;
}
.hero-float-badge .fb-stars{ color: #f5b400; font-size: .8rem; letter-spacing: .04rem; line-height: 1; }
.hero-float-badge .fb-num{ font-family: 'Sora', sans-serif; font-weight: 700; font-size: 1.05rem; color: var(--nm-ink-text); line-height: 1.2; }
.hero-float-badge .fb-label{ font-size: .72rem; color: var(--nm-slate-600); }

.scroll-cue{
  position: absolute;
  bottom: 1.75rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  color: rgba(255,255,255,.65);
  font-size: .75rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .5rem;
}
.scroll-cue .mouse{
  width: 22px; height: 34px;
  border: 2px solid rgba(255,255,255,.5);
  border-radius: 12px;
  position: relative;
}
.scroll-cue .mouse::before{
  content: "";
  position: absolute;
  top: 6px; left: 50%;
  width: 3px; height: 6px;
  background: var(--nm-gold-light);
  border-radius: 2px;
  transform: translateX(-50%);
  animation: scrollcue 1.8s infinite;
}
@keyframes scrollcue{
  0%{ opacity: 1; transform: translate(-50%, 0); }
  70%{ opacity: 0; transform: translate(-50%, 10px); }
  100%{ opacity: 0; }
}

/* Quote card (glass) with decorative accent shapes */
.quote-card-wrap{ position: relative; }
.quote-card-wrap::before{
  content: "";
  position: absolute;
  width: 220px; height: 220px;
  background: linear-gradient(135deg, var(--nm-gold-light), var(--nm-gold));
  border-radius: 42% 58% 65% 35% / 45% 40% 60% 55%;
  top: -50px; right: -40px;
  opacity: .5;
  filter: blur(2px);
  z-index: 0;
  animation: blob-float 9s ease-in-out infinite;
}
.quote-card-wrap::after{
  content: "";
  position: absolute;
  width: 160px; height: 160px;
  background: linear-gradient(135deg, var(--nm-green-bright), var(--nm-green));
  border-radius: 60% 40% 35% 65% / 55% 45% 55% 45%;
  bottom: -35px; left: -35px;
  opacity: .4;
  z-index: 0;
  animation: blob-float 11s ease-in-out infinite reverse;
}
@keyframes blob-float{
  0%, 100%{ transform: translate(0,0) rotate(0deg); }
  50%{ transform: translate(-8px, 10px) rotate(8deg); }
}
.quote-card{
  background: rgba(255,255,255,.97);
  color: var(--nm-ink-text);
  border-radius: var(--nm-radius-lg);
  padding: 1.9rem;
  box-shadow: 0 35px 80px -20px rgba(0,0,0,.55);
  border: 1px solid rgba(255,255,255,.5);
  position: relative;
  z-index: 1;
}
.quote-card .form-label{
  font-size: .82rem;
  font-weight: 600;
  color: #445049;
}
.quote-card .form-control,
.quote-card .form-select{
  border-radius: .7rem;
  border-color: #dde5e1;
  padding: .68rem .9rem;
}
.quote-card .form-control:focus,
.quote-card .form-select:focus{
  border-color: var(--nm-green);
  box-shadow: 0 0 0 .2rem rgba(30,138,84,.15);
}

.vehicle-type-toggle .btn{
  border-radius: .7rem;
  font-weight: 600;
  font-size: .88rem;
}
.vehicle-type-toggle .btn-check:checked + .btn-outline-success{
  background-color: var(--nm-green);
  border-color: var(--nm-green);
}

/* ---------- Trust / certification marquee ---------- */
.trust-strip{
  background: var(--nm-ink);
  border-top: 1px solid rgba(255,255,255,.08);
  padding: 1.6rem 0;
  overflow: hidden;
  position: relative;
}
.trust-marquee{
  display: flex;
  width: max-content;
  animation: marquee 28s linear infinite;
  gap: 1rem;
  align-items: center;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
}
.trust-strip:hover .trust-marquee{ animation-play-state: paused; }
@keyframes marquee{
  0%{ transform: translateX(0); }
  100%{ transform: translateX(-50%); }
}
.trust-item{
  display: flex;
  align-items: center;
  gap: .55rem;
  color: rgba(255,255,255,.75);
  font-weight: 600;
  font-size: .85rem;
  white-space: nowrap;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 50rem;
  padding: .5rem 1.1rem;
}
.trust-item i{ color: var(--nm-gold-light); font-size: 1.05rem; }

/* ---------- Impact counters ---------- */
.counter-section{
  background: var(--nm-cream);
  position: relative;
  overflow: hidden;
}
.counter-section .mesh-blob{ width: 320px; height: 320px; background: var(--nm-green-bright); opacity: .12; }
.counter-card{
  text-align: center;
  padding: 2.25rem 1.25rem;
  background: #fff;
  border: 1px solid var(--nm-border);
  border-radius: var(--nm-radius);
  height: 100%;
  position: relative;
  z-index: 1;
  transition: transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s ease;
}
.counter-card:hover{
  transform: translateY(-6px);
  box-shadow: var(--nm-shadow-lift);
}
.counter-card .counter-icon{
  width: 52px; height: 52px;
  border-radius: .9rem;
  background: var(--nm-green-light);
  color: var(--nm-green-dark);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.3rem;
  margin: 0 auto 1.1rem;
}
.counter-num{
  font-family: 'Sora', sans-serif;
  font-weight: 700;
  font-size: clamp(2rem, 4vw, 2.6rem);
  color: var(--nm-green-dark);
  line-height: 1;
}
.counter-num .suffix{ color: var(--nm-gold); }
.counter-label{
  color: var(--nm-slate-600);
  font-size: .9rem;
  margin-top: .6rem;
}

/* ---------- Who should scrap cards ---------- */
.who-card{
  background: #fff;
  border: 1px solid var(--nm-border);
  border-radius: var(--nm-radius);
  padding: 1.9rem;
  height: 100%;
  position: relative;
  overflow: hidden;
  transition: transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s ease, border-color .3s ease;
}
.who-card::before{
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(140deg, var(--nm-green-light), transparent 55%);
  opacity: 0;
  transition: opacity .3s ease;
}
.who-card:hover{
  transform: translateY(-6px);
  box-shadow: var(--nm-shadow-lift);
  border-color: transparent;
}
.who-card:hover::before{ opacity: 1; }
.who-card > *{ position: relative; z-index: 1; }
.who-card .icon-box{
  width: 54px;
  height: 54px;
  border-radius: .9rem;
  background: var(--nm-green-light);
  color: var(--nm-green-dark);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  margin-bottom: 1.1rem;
  transition: all .3s ease;
}
.who-card:hover .icon-box{
  background: var(--nm-green);
  color: #fff;
  transform: scale(1.08) rotate(-4deg);
}

/* Color variants for icon badges (adds visual variety across cards) */
.icon-box.c-blue{ background: var(--nm-blue-light); color: var(--nm-blue); }
.icon-box.c-teal{ background: var(--nm-teal-light); color: var(--nm-teal); }
.icon-box.c-coral{ background: var(--nm-coral-light); color: var(--nm-coral); }
.icon-box.c-violet{ background: var(--nm-violet-light); color: var(--nm-violet); }
.icon-box.c-gold{ background: #eaf1fe; color: #123f8e; }
.who-card:hover .icon-box.c-blue{ background: var(--nm-blue); color: #fff; }
.who-card:hover .icon-box.c-teal{ background: var(--nm-teal); color: #fff; }
.who-card:hover .icon-box.c-coral{ background: var(--nm-coral); color: #fff; }
.who-card:hover .icon-box.c-violet{ background: var(--nm-violet); color: #fff; }
.who-card:hover .icon-box.c-gold{ background: var(--nm-gold); color: #fff; }
.who-card.accent-blue::before{ background: linear-gradient(140deg, var(--nm-blue-light), transparent 55%); }
.who-card.accent-teal::before{ background: linear-gradient(140deg, var(--nm-teal-light), transparent 55%); }
.who-card.accent-coral::before{ background: linear-gradient(140deg, var(--nm-coral-light), transparent 55%); }
.who-card.accent-violet::before{ background: linear-gradient(140deg, var(--nm-violet-light), transparent 55%); }
.who-card.accent-gold::before{ background: linear-gradient(140deg, #eaf1fe, transparent 55%); }

/* ---------- Why us icon features ---------- */
.feature-item{
  text-align: center;
  padding: 2.1rem 1.25rem;
  border-radius: var(--nm-radius);
  background: #fff;
  border: 1px solid var(--nm-border);
  height: 100%;
  transition: transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s ease, border-color .3s ease;
}
.feature-item:hover{
  transform: translateY(-6px);
  box-shadow: var(--nm-shadow-lift);
  border-color: transparent;
}
.feature-item .icon-circle{
  width: 78px;
  height: 78px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--nm-green-light), #fff);
  border: 1px solid #dcefe3;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2rem;
  color: var(--nm-green-dark);
  margin: 0 auto 1.2rem;
  transition: all .3s ease;
}
.feature-item:hover .icon-circle{
  background: var(--nm-green);
  color: #fff;
  transform: translateY(-4px);
  box-shadow: 0 18px 30px -12px rgba(20,98,57,.5);
}
.icon-circle.c-blue{ background: linear-gradient(135deg, var(--nm-blue-light), #fff); border-color: #d6e4fd; color: var(--nm-blue); }
.icon-circle.c-coral{ background: linear-gradient(135deg, var(--nm-coral-light), #fff); border-color: #fbd9c9; color: var(--nm-coral); }
.icon-circle.c-violet{ background: linear-gradient(135deg, var(--nm-violet-light), #fff); border-color: #e2d1fc; color: var(--nm-violet); }
.feature-item:hover .icon-circle.c-blue{ background: var(--nm-blue); color: #fff; box-shadow: 0 18px 30px -12px rgba(37,99,235,.5); }
.feature-item:hover .icon-circle.c-coral{ background: var(--nm-coral); color: #fff; box-shadow: 0 18px 30px -12px rgba(226,87,43,.5); }
.feature-item:hover .icon-circle.c-violet{ background: var(--nm-violet); color: #fff; box-shadow: 0 18px 30px -12px rgba(124,58,237,.5); }

/* ---------- Vehicle type grid ---------- */
.vehicle-tile{
  background: #fff;
  border: 1px solid var(--nm-border);
  border-radius: var(--nm-radius);
  padding: 1.6rem 1rem;
  text-align: center;
  height: 100%;
  transition: all .3s cubic-bezier(.2,.8,.2,1);
  text-decoration: none;
  color: inherit;
  display: block;
}
.vehicle-tile:hover{
  background: linear-gradient(160deg, var(--nm-green), var(--nm-green-dark));
  color: #fff;
  transform: translateY(-5px) scale(1.02);
  box-shadow: 0 22px 40px -18px rgba(20,98,57,.55);
  border-color: transparent;
}
.vehicle-tile .v-icon{
  font-size: 2.2rem;
  color: var(--nm-green-dark);
  margin-bottom: .6rem;
  transition: color .3s ease;
}
.vehicle-tile:hover .v-icon{ color: var(--nm-gold-light); }

/* Medallion-style vehicle type row (home page variant) */
.vtype-row{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 2.25rem 2.5rem;
}
.vtype-medallion{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .85rem;
  text-decoration: none;
  color: inherit;
  width: 116px;
}
.vtype-icon{
  width: 84px; height: 84px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2rem;
  box-shadow: 0 14px 30px -16px rgba(10,30,20,.35);
  transition: transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s ease;
  position: relative;
}
.vtype-icon::after{
  content: "";
  position: absolute;
  inset: -6px;
  border-radius: 50%;
  border: 1.5px dashed currentColor;
  opacity: 0;
  transition: opacity .3s ease, transform .3s ease;
  transform: scale(.85);
}
.vtype-medallion:hover .vtype-icon{ transform: translateY(-8px); }
.vtype-medallion:hover .vtype-icon::after{ opacity: .35; transform: scale(1); }
.vtype-label{
  font-weight: 600;
  font-size: .9rem;
  color: var(--nm-ink-text);
}
.vtype-icon.c-green{ background: var(--nm-green-light); color: var(--nm-green-dark); }
.vtype-icon.c-blue{ background: var(--nm-blue-light); color: var(--nm-blue); }
.vtype-icon.c-teal{ background: var(--nm-teal-light); color: var(--nm-teal); }
.vtype-icon.c-coral{ background: var(--nm-coral-light); color: var(--nm-coral); }
.vtype-icon.c-violet{ background: var(--nm-violet-light); color: var(--nm-violet); }
.vtype-icon.c-navy{ background: var(--nm-navy-light); color: var(--nm-navy); }

/* ---------- Buy Recycled Spares ---------- */
.spares-banner{
  border-radius: var(--nm-radius-lg);
  background: linear-gradient(115deg, var(--nm-green-light) 0%, #fff 55%);
  border: 1px solid #dcefe3;
  padding: 2.5rem;
  position: relative;
  overflow: hidden;
}
.spares-banner .mesh-blob{
  width: 260px; height: 260px;
  background: var(--nm-gold);
  right: -60px;
  bottom: -80px;
  opacity: .18;
}
.spares-icon-badge{
  width: 64px; height: 64px;
  border-radius: 1rem;
  background: #fff;
  border: 1px solid #dcefe3;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.7rem;
  color: var(--nm-green-dark);
  box-shadow: var(--nm-shadow-soft);
}
.spares-tag{
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  background: #fff;
  border: 1px solid #dcefe3;
  border-radius: 50rem;
  padding: .4rem .9rem;
  font-size: .82rem;
  font-weight: 600;
  color: var(--nm-green-dark);
}

/* ---------- Estimator widget ---------- */
.estimator-panel{
  background: linear-gradient(160deg, var(--nm-forest-900) 0%, var(--nm-ink) 100%);
  border-radius: var(--nm-radius-lg);
  padding: 2.75rem;
  color: #fff;
  position: relative;
  overflow: hidden;
}
.estimator-panel::before{
  content: "";
  position: absolute;
  width: 380px; height: 380px;
  background: radial-gradient(circle, rgba(52,211,153,.28), transparent 70%);
  right: -100px; top: -120px;
  border-radius: 50%;
}
.estimator-panel::after{
  content: "";
  position: absolute;
  width: 300px; height: 300px;
  background: radial-gradient(circle, rgba(18,63,142,.18), transparent 70%);
  left: -80px; bottom: -100px;
  border-radius: 50%;
}
.estimator-panel > *{ position: relative; z-index: 1; }

.estimator-field label{
  font-size: .82rem;
  font-weight: 600;
  color: rgba(255,255,255,.75);
  margin-bottom: .5rem;
  display: block;
}
.estimator-panel .form-select{
  background-color: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.18);
  color: #fff;
  border-radius: .7rem;
  padding: .7rem 1rem;
}
.estimator-panel .form-select:focus{
  border-color: var(--nm-green-bright);
  box-shadow: 0 0 0 .2rem rgba(52,211,153,.18);
}
.estimator-panel .form-select option{ color: #111; }

.range-nm{
  width: 100%;
  accent-color: var(--nm-gold-light);
  height: 6px;
}
.estimator-age-value{
  font-family: 'Sora', sans-serif;
  font-weight: 700;
  color: var(--nm-gold-light);
}

.estimate-result{
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 1.1rem;
  padding: 1.75rem;
  text-align: center;
  backdrop-filter: blur(10px);
}
.estimate-result .range-value{
  font-family: 'Sora', sans-serif;
  font-weight: 700;
  font-size: clamp(1.7rem, 3vw, 2.3rem);
  color: var(--nm-green-bright);
}
.estimate-result .label{
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: rgba(255,255,255,.6);
}

/* ---------- Savings / COD section ---------- */
.savings-panel{
  background: linear-gradient(160deg, var(--nm-forest-900), var(--nm-ink));
  border-radius: var(--nm-radius-lg);
  color: #fff;
  padding: 2.75rem;
  position: relative;
  overflow: hidden;
}
.savings-panel::after{
  content:"";
  position: absolute;
  width: 320px; height: 320px;
  background: radial-gradient(circle, rgba(30,138,84,.5), transparent 70%);
  right: -80px; top: -80px;
  border-radius: 50%;
}
.savings-panel > *{ position: relative; z-index: 1; }
.savings-stat{
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: .9rem;
  padding: 1.3rem;
}
.savings-stat .num{
  font-family: 'Sora', sans-serif;
  font-weight: 700;
  font-size: clamp(1.35rem, 5vw, 1.8rem);
  color: var(--nm-green-bright);
  white-space: nowrap;
}
@media (max-width: 575.98px){
  .savings-stat{ padding: .85rem .5rem; }
}

.table-compare{
  border-radius: 1.1rem;
  overflow: hidden;
  box-shadow: var(--nm-shadow-soft);
}
.table-compare thead th{
  background: linear-gradient(135deg, var(--nm-green), var(--nm-green-dark));
  color: #fff;
  font-weight: 600;
  border: none;
}
.table-compare td, .table-compare th{
  vertical-align: middle;
  padding: .9rem 1.1rem;
}
.table-compare tbody tr:nth-child(odd){ background: var(--nm-cream); }
.table-compare td.col-nm{
  background: linear-gradient(135deg, rgba(30,138,84,.1), rgba(30,138,84,.04));
  font-weight: 700;
}

/* ---------- Maximum value hero card (CERO-style benefit summary) ---------- */
.value-hero-card{
  border-radius: var(--nm-radius-lg);
  background: linear-gradient(120deg, #0f6e52 0%, #1e8a54 45%, #1a6e8f 100%);
  color: #fff;
  padding: 2.25rem;
  position: relative;
  overflow: hidden;
  box-shadow: var(--nm-shadow-lift);
}
.value-hero-card::before{
  content: "";
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle at 1px 1px, rgba(255,255,255,.15) 1px, transparent 1px);
  background-size: 22px 22px;
  opacity: .3;
}
.value-hero-card > *{ position: relative; z-index: 1; }
.value-hero-card .vh-label{
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: rgba(255,255,255,.75);
}
.value-hero-card .vh-vehicle{
  font-family: 'Sora', sans-serif;
  font-weight: 700;
  font-size: 1.4rem;
}
.value-hero-inner{
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.22);
  backdrop-filter: blur(6px);
  border-radius: 1.1rem;
  padding: 1.5rem;
  margin-top: 1.25rem;
}
.value-hero-inner .vh-total{
  font-family: 'Sora', sans-serif;
  font-weight: 800;
  font-size: clamp(2rem, 4vw, 2.6rem);
  line-height: 1;
}
.value-hero-inner ul{
  list-style: none;
  padding: 0;
  margin: 1rem 0 0;
}
.value-hero-inner ul li{
  display: flex;
  align-items: center;
  gap: .6rem;
  padding: .55rem 0;
  border-top: 1px solid rgba(255,255,255,.15);
  font-size: .92rem;
}
.value-hero-inner ul li:first-child{ border-top: none; }
.value-hero-inner ul li i{
  width: 22px; height: 22px;
  border-radius: 50%;
  background: rgba(255,255,255,.2);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: .7rem;
  flex-shrink: 0;
}

/* ---------- Process timeline ---------- */
.process-wrap{ position: relative; }
.process-step{
  background: #fff;
  border-radius: var(--nm-radius);
  border: 1px solid var(--nm-border);
  padding: 1.9rem;
  height: 100%;
  position: relative;
  transition: all .3s ease;
}
.process-step:hover{
  border-color: transparent;
  box-shadow: var(--nm-shadow-lift);
  transform: translateY(-4px);
}
.process-step .step-num{
  font-family: 'Sora', sans-serif;
  font-weight: 700;
  font-size: 2.4rem;
  color: transparent;
  -webkit-text-stroke: 1.5px var(--nm-green);
  line-height: 1;
  margin-bottom: .8rem;
}
.process-step .step-icon{
  position: absolute;
  top: 1.6rem; right: 1.6rem;
  font-size: 1.4rem;
  color: var(--nm-gold);
  opacity: .8;
}
@media (min-width: 992px){
  .process-step.has-connector::after{
    content: "";
    position: absolute;
    top: 50%;
    right: -1.6rem;
    width: 1.6rem;
    height: 2px;
    background: repeating-linear-gradient(90deg, var(--nm-green) 0 6px, transparent 6px 12px);
    z-index: 2;
  }
}

/* ---------- Explore Hub (home page site map cards) ---------- */
.hub-card{
  position: relative;
  border-radius: var(--nm-radius-lg);
  overflow: hidden;
  display: flex;
  align-items: flex-end;
  min-height: 300px;
  text-decoration: none;
  color: #fff;
  isolation: isolate;
  box-shadow: var(--nm-shadow-soft);
  transition: transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease;
}
.hub-card:hover{
  transform: translateY(-6px);
  box-shadow: var(--nm-shadow-lift);
  color: #fff;
}
.hub-card img{
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: -2;
  transition: transform .6s cubic-bezier(.2,.8,.2,1);
}
.hub-card:hover img{ transform: scale(1.09); }
.hub-card::before{
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(10,18,32,.15) 0%, rgba(10,18,32,.55) 55%, rgba(10,18,32,.95) 100%);
  z-index: -1;
}
.hub-card-body{ position: relative; padding: 1.75rem; width: 100%; }
.hub-card .hub-icon{
  width: 48px; height: 48px;
  border-radius: .8rem;
  background: rgba(255,255,255,.16);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,.25);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.3rem;
  margin-bottom: 1rem;
  color: #fff;
}
.hub-card h5{ color: #fff; margin-bottom: .4rem; }
.hub-card p{ color: rgba(255,255,255,.75); font-size: .88rem; margin-bottom: 1.1rem; }
.hub-card .hub-link{
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  font-weight: 600;
  font-size: .88rem;
  color: #fff;
}
.hub-card .hub-link i{ transition: transform .25s ease; }
.hub-card:hover .hub-link i{ transform: translateX(4px); }

/* ---------- Mini process teaser (home page) ---------- */
.mini-process{ text-align: center; position: relative; }
.mini-process-icon{
  width: 68px; height: 68px;
  border-radius: 50%;
  background: var(--nm-green-light);
  color: var(--nm-green-dark);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.6rem;
  margin: 0 auto .9rem;
  position: relative;
  z-index: 1;
  border: 3px solid #fff;
  box-shadow: 0 0 0 1px var(--nm-border);
}
.mini-process .step-tag{
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--nm-green);
}
.mini-process h6{ margin: .3rem 0 .3rem; }
.mini-process p{ font-size: .84rem; }
@media (min-width: 992px){
  .mini-process.has-connector::after{
    content: "";
    position: absolute;
    top: 34px;
    left: 50%;
    width: 100%;
    height: 2px;
    background: repeating-linear-gradient(90deg, var(--nm-green) 0 6px, transparent 6px 12px);
    z-index: 0;
  }
}

/* ---------- Flow panel: dark unified process + benefits (home page) ---------- */
.flow-panel{
  background: linear-gradient(160deg, var(--nm-forest-900) 0%, var(--nm-ink) 100%);
  border-radius: var(--nm-radius-lg);
  padding: 2.75rem;
  color: #fff;
  position: relative;
  overflow: hidden;
  box-shadow: var(--nm-shadow-lift);
}
.flow-panel::before{
  content: "";
  position: absolute;
  width: 340px; height: 340px;
  background: radial-gradient(circle, rgba(52,211,153,.28), transparent 70%);
  right: -100px; top: -120px;
  border-radius: 50%;
}
.flow-panel::after{
  content: "";
  position: absolute;
  width: 280px; height: 280px;
  background: radial-gradient(circle, rgba(76,127,232,.22), transparent 70%);
  left: -80px; bottom: -100px;
  border-radius: 50%;
}
.flow-panel > *{ position: relative; z-index: 1; }
.flow-steps{ display: flex; flex-direction: column; }
.flow-step{
  display: flex;
  align-items: flex-start;
  gap: 1.15rem;
  padding: 1.1rem 0;
  border-bottom: 1px solid rgba(255,255,255,.1);
}
.flow-step:first-child{ padding-top: 0; }
.flow-step:last-child{ border-bottom: none; padding-bottom: 0; }
.flow-num{
  font-family: 'Sora', sans-serif;
  font-weight: 800;
  font-size: 1.6rem;
  color: transparent;
  -webkit-text-stroke: 1.5px rgba(255,255,255,.4);
  min-width: 2.6rem;
  line-height: 1.3;
}
.flow-step h6{ color: #fff; margin-bottom: .25rem; }
.flow-step p{ color: rgba(255,255,255,.6); font-size: .86rem; margin: 0; }

.flow-stats{ display: flex; flex-direction: column; gap: .85rem; }
.flow-stat{
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 1rem;
  padding: 1.05rem 1.3rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  backdrop-filter: blur(6px);
}
.flow-stat .num{
  font-family: 'Sora', sans-serif;
  font-weight: 700;
  font-size: 1.5rem;
  color: var(--nm-green-bright);
  white-space: nowrap;
}
.flow-stat .label{
  font-size: .82rem;
  color: rgba(255,255,255,.65);
  text-align: right;
}

/* ---------- Gallery ---------- */
.gallery-item{
  position: relative;
  border-radius: var(--nm-radius);
  overflow: hidden;
  cursor: zoom-in;
  height: 100%;
  min-height: 220px;
}
.gallery-item img{
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .5s cubic-bezier(.2,.8,.2,1);
  display: block;
}
.gallery-item:hover img{ transform: scale(1.08); }
.gallery-item .gallery-overlay{
  position: absolute; inset: 0;
  background: linear-gradient(0deg, rgba(6,15,11,.85) 0%, rgba(6,15,11,.05) 55%);
  display: flex;
  align-items: flex-end;
  padding: 1.1rem;
  opacity: 0;
  transition: opacity .3s ease;
}
.gallery-item:hover .gallery-overlay{ opacity: 1; }
.gallery-item .gallery-caption{
  color: #fff;
  font-weight: 600;
  font-size: .95rem;
}
.gallery-item .gallery-zoom-icon{
  position: absolute; top: 1rem; right: 1rem;
  width: 36px; height: 36px;
  border-radius: 50%;
  background: rgba(255,255,255,.15);
  backdrop-filter: blur(6px);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  opacity: 0;
  transform: scale(.7);
  transition: all .3s ease;
}
.gallery-item:hover .gallery-zoom-icon{ opacity: 1; transform: scale(1); }

.gallery-lightbox{
  position: fixed; inset: 0;
  background: rgba(6,10,8,.92);
  backdrop-filter: blur(6px);
  z-index: 1400;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem;
  opacity: 0;
  visibility: hidden;
  transition: opacity .25s ease, visibility .25s ease;
}
.gallery-lightbox.show{ opacity: 1; visibility: visible; }
.gallery-lightbox img{
  max-width: min(92vw, 1100px);
  max-height: 85vh;
  border-radius: 1rem;
  box-shadow: 0 40px 100px -20px rgba(0,0,0,.7);
}
.gallery-lightbox-close{
  position: absolute; top: 1.5rem; right: 1.75rem;
  width: 44px; height: 44px;
  border-radius: 50%;
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.25);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.3rem;
}

/* ---------- Coverage chips ---------- */
.city-chip{
  display: inline-block;
  background: #fff;
  border: 1px solid var(--nm-border);
  border-radius: 50rem;
  padding: .42rem 1.05rem;
  font-size: .85rem;
  font-weight: 500;
  color: #33433d;
  margin: .25rem;
  transition: all .2s ease;
}
.city-chip:hover{
  background: var(--nm-green);
  color: #fff;
  border-color: var(--nm-green);
  transform: translateY(-2px);
}
.city-chip.is-match{
  background: var(--nm-green);
  color: #fff;
  border-color: var(--nm-green);
  box-shadow: 0 0 0 3px rgba(30,138,84,.2);
}

/* ---------- City availability checker ---------- */
.availability-checker{
  background: #fff;
  border-radius: var(--nm-radius);
  padding: 1.75rem;
  border: 1px solid var(--nm-border);
  box-shadow: var(--nm-shadow-soft);
}
.availability-checker .form-control{
  border-radius: .7rem .7rem 0 0;
  padding: .85rem 1.1rem;
}
@media (min-width: 576px){
  .availability-checker .form-control{ border-radius: .7rem 0 0 .7rem; }
  .availability-checker .btn{ border-radius: 0 .7rem .7rem 0; }
}
.availability-result{
  border-radius: .8rem;
  padding: .9rem 1.1rem;
  font-size: .92rem;
  font-weight: 600;
  margin-top: 1rem;
  display: none;
}
.availability-result.show{ display: flex; align-items: center; gap: .6rem; }
.availability-result.is-yes{ background: var(--nm-green-light); color: var(--nm-green-dark); }
.availability-result.is-no{ background: #fdf1e6; color: #9a5b12; }

/* ---------- Testimonials (Swiper) ---------- */
.testimonial-card{
  background: #fff;
  border-radius: var(--nm-radius);
  border: 1px solid var(--nm-border);
  padding: 2.1rem;
  height: 100%;
  box-shadow: var(--nm-shadow-soft);
  position: relative;
  overflow: hidden;
  transition: transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s ease;
}
.testimonial-card:hover{
  transform: translateY(-6px);
  box-shadow: var(--nm-shadow-lift);
}
.testimonial-card::after{
  content: "\201D";
  position: absolute;
  top: -0.5rem; right: 1.25rem;
  font-family: Georgia, serif;
  font-size: 6rem;
  line-height: 1;
  color: var(--nm-green-light);
  z-index: 0;
  pointer-events: none;
}
.testimonial-card > *{ position: relative; z-index: 1; }
.testimonial-card .stars{ color: #f5b400; letter-spacing: .1rem; }
.testimonial-card .t-title{
  font-family: 'Sora', sans-serif;
  font-weight: 700;
  font-size: 1.05rem;
  margin-bottom: .6rem;
}
.avatar-circle{
  width: 48px; height: 48px;
  border-radius: 50%;
  background: var(--nm-green-light);
  color: var(--nm-green-dark);
  display: flex; align-items: center; justify-content: center;
  font-weight: 700;
  font-family: 'Sora', sans-serif;
  flex-shrink: 0;
}
#testimonialSwiper{ padding-bottom: 3.5rem; }
#testimonialSwiper .swiper-pagination-bullet{
  background: var(--nm-green);
  opacity: .3;
}
#testimonialSwiper .swiper-pagination-bullet-active{ opacity: 1; }
.swiper-nav-btn{
  width: 46px; height: 46px;
  border-radius: 50%;
  border: 1px solid var(--nm-border);
  background: #fff;
  display: flex; align-items: center; justify-content: center;
  color: var(--nm-green-dark);
  transition: all .2s ease;
}
.swiper-nav-btn:hover{ background: var(--nm-green); color: #fff; border-color: var(--nm-green); }

/* ---------- FAQ ---------- */
.accordion-nm .accordion-button{
  font-weight: 600;
  color: var(--nm-ink-text);
  border-radius: .9rem !important;
  padding: 1.1rem 1.3rem;
}
.accordion-nm .accordion-button:not(.collapsed){
  background-color: var(--nm-green-light);
  color: var(--nm-green-dark);
  box-shadow: none;
}
.accordion-nm .accordion-item{
  border: 1px solid var(--nm-border);
  border-radius: .9rem !important;
  overflow: hidden;
  margin-bottom: .85rem;
}
.accordion-nm .accordion-body{ padding: 0 1.3rem 1.2rem; }
.accordion-nm .accordion-button:focus{ box-shadow: none; }

/* ---------- CTA banner ---------- */
.cta-banner{
  border-radius: var(--nm-radius-lg);
  color: #fff;
  padding: 3.25rem;
  position: relative;
  overflow: hidden;
  isolation: isolate;
  box-shadow: var(--nm-shadow-lift);
}
.cta-banner img{
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: -2;
}
.cta-banner::before{
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(110deg, rgba(10,18,32,.96) 15%, rgba(18,63,142,.75) 100%);
  z-index: -1;
}
.cta-banner::after{
  content: "";
  position: absolute;
  width: 380px; height: 380px;
  background: radial-gradient(circle, rgba(79,201,74,.35), transparent 70%);
  right: -100px; top: -140px;
  border-radius: 50%;
  z-index: -1;
  pointer-events: none;
}

/* ---------- Contact ---------- */
.contact-info-item{
  display: flex;
  gap: 1.1rem;
  align-items: flex-start;
  padding: 1.15rem 0;
  border-bottom: 1px dashed var(--nm-border);
}
.contact-info-item .icon-box{
  width: 46px; height: 46px;
  border-radius: .8rem;
  background: var(--nm-green-light);
  color: var(--nm-green-dark);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.map-placeholder{
  border-radius: var(--nm-radius);
  overflow: hidden;
  min-height: 220px;
  border: 1px solid var(--nm-border);
}

/* ---------- Footer ---------- */
.footer-nm{
  background: var(--nm-ink);
  color: rgba(255,255,255,.72);
  position: relative;
}
.footer-nm h6{
  color: #fff;
  font-weight: 600;
  margin-bottom: 1.15rem;
  font-family: 'Sora', sans-serif;
}
.footer-nm a{
  color: rgba(255,255,255,.62);
  text-decoration: none;
  transition: color .2s ease;
}
.footer-nm a:hover{ color: var(--nm-green-bright); }
.footer-social a{
  width: 40px; height: 40px;
  border-radius: 50%;
  background: rgba(255,255,255,.08);
  display: inline-flex; align-items: center; justify-content: center;
  margin-right: .5rem;
  border: 1px solid rgba(255,255,255,.08);
  transition: all .25s ease;
}
.footer-social a:hover{
  background: var(--nm-green);
  color: #fff;
  transform: translateY(-3px);
  box-shadow: 0 10px 22px -8px rgba(30,138,84,.6);
}
.footer-bottom{
  border-top: 1px solid rgba(255,255,255,.08);
  font-size: .85rem;
  color: rgba(255,255,255,.45);
}
.footer-cert-row img, .footer-cert-row .cert-badge{
  opacity: .8;
}
.cert-badge{
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  font-size: .78rem;
  color: rgba(255,255,255,.55);
  border: 1px solid rgba(255,255,255,.12);
  padding: .35rem .8rem;
  border-radius: 50rem;
}

/* ---------- Sticky mobile action bar ---------- */
.mobile-action-bar{
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 1100;
  background: rgba(10,21,17,.97);
  backdrop-filter: blur(14px);
  border-top: 1px solid rgba(255,255,255,.1);
  display: none;
  padding: .6rem .8rem;
  box-shadow: 0 -12px 30px -10px rgba(0,0,0,.35);
}
.mobile-action-bar .row > div{ padding: 0 .3rem; }
.mobile-action-bar .btn{
  border-radius: .7rem;
  font-size: .82rem;
  font-weight: 600;
  padding: .6rem .4rem;
}
@media (max-width: 767.98px){
  .mobile-action-bar{ display: block; }
  body{ padding-bottom: 4.2rem; }
}

/* Back to top */
.btn-back-top{
  position: fixed;
  right: 1.5rem;
  bottom: 1.5rem;
  width: 48px; height: 48px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--nm-green), var(--nm-green-dark));
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 14px 30px -8px rgba(20,98,57,.6);
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: all .25s ease;
  z-index: 1050;
  border: none;
}
.btn-back-top.show{
  opacity: 1; visibility: visible; transform: translateY(0);
}
@media (max-width: 767.98px){
  .btn-back-top{ bottom: 5.2rem; }
}

/* ---------- WhatsApp floating button ---------- */
.whatsapp-float{
  position: fixed;
  left: 1.5rem;
  bottom: 1.5rem;
  width: 56px; height: 56px;
  border-radius: 50%;
  background: #25D366;
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.6rem;
  box-shadow: 0 14px 30px -8px rgba(37,211,102,.6);
  z-index: 1050;
  animation: pulse-wa 2.4s infinite;
}
@keyframes pulse-wa{
  0%{ box-shadow: 0 0 0 0 rgba(37,211,102,.55), 0 14px 30px -8px rgba(37,211,102,.6); }
  70%{ box-shadow: 0 0 0 14px rgba(37,211,102,0), 0 14px 30px -8px rgba(37,211,102,.6); }
  100%{ box-shadow: 0 0 0 0 rgba(37,211,102,0), 0 14px 30px -8px rgba(37,211,102,.6); }
}
@media (max-width: 767.98px){
  .whatsapp-float{ bottom: 5.2rem; width: 50px; height: 50px; font-size: 1.4rem; }
}

/* ---------- AOS fallback tuning ---------- */
[data-aos]{ pointer-events: auto; }

@media (max-width: 991.98px){
  .section-py{ padding-top: 4rem; padding-bottom: 4rem; }
  .hero-nm{ padding-top: 6.5rem; min-height: auto; }
}

/* ==========================================================================
   Additions for the content rebuild (October 2026)
   ========================================================================== */

/* Headings moved from h5/h6 to h3 for a clean outline */
.hub-card h3{ color: #fff; margin-bottom: .4rem; }
.flow-step h3{ color: #fff; margin-bottom: .25rem; font-size: 1rem; }
.feature-item h3, .who-card h3, .process-step h3, .doc-card h3, .price-factor h3, .contact-info-item h3{ font-family: 'Sora', 'Inter', sans-serif; }
.cta-banner h2{ color: #fff; }
.footer-title{
  color: #fff;
  font-weight: 600;
  margin-bottom: 1.15rem;
  font-family: 'Sora', sans-serif;
  font-size: 1rem;
}

/* Text link at the bottom of a card */
.card-link-nm{
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  margin-top: 1rem;
  font-weight: 600;
  font-size: .9rem;
  color: var(--nm-green-dark);
  text-decoration: none;
}
.card-link-nm:hover{ color: var(--nm-navy); }
.card-link-nm i{ transition: transform .2s ease; }
.card-link-nm:hover i{ transform: translateX(3px); }
.who-card a:not(.card-link-nm), .doc-card a, .accordion-body a, .note-box a, .prose a, main p a{ color: var(--nm-green-dark); font-weight: 500; }

/* Tick list */
.checklist{ list-style: none; padding: 0; margin: 0 0 1.25rem; }
.checklist li{
  display: flex;
  gap: .7rem;
  align-items: flex-start;
  padding: .45rem 0;
  color: var(--nm-slate-600);
  line-height: 1.55;
}
.checklist li i{ color: var(--nm-green); font-size: 1.05rem; margin-top: .12rem; flex-shrink: 0; }
.checklist li strong{ color: var(--nm-ink-text); }

/* Callout box */
.note-box{
  display: flex;
  gap: .9rem;
  align-items: flex-start;
  padding: 1.1rem 1.25rem;
  border-radius: 1rem;
  background: var(--nm-navy-light);
  border: 1px solid #d7e3fb;
  color: #2c3b55;
  line-height: 1.6;
}
.note-box > i{ font-size: 1.3rem; color: var(--nm-navy); flex-shrink: 0; margin-top: .05rem; }
.note-box.note-warn{ background: #fff6e8; border-color: #f5dfb8; color: #5b4317; }
.note-box.note-warn > i{ color: #c77d0a; }

/* Price up / down cards */
.price-factor{
  background: #fff;
  border: 1px solid var(--nm-border);
  border-radius: var(--nm-radius);
  padding: 1.5rem;
}
.price-factor h3{ display: flex; align-items: center; gap: .5rem; margin-bottom: .8rem; }
.price-factor.up h3 i{ color: var(--nm-green); }
.price-factor.down h3 i{ color: var(--nm-coral); }
.price-factor h3 i{ color: var(--nm-navy); }
.price-factor ul{ padding-left: 1.1rem; margin: 0; color: var(--nm-slate-600); }
.price-factor li{ padding: .2rem 0; }

/* Document cards and panels */
.doc-card, .doc-panel{
  background: #fff;
  border: 1px solid var(--nm-border);
  border-radius: var(--nm-radius);
  padding: 1.75rem;
}
.doc-panel{ box-shadow: var(--nm-shadow-soft); }
.doc-card .icon-box{ width: 3rem; height: 3rem; font-size: 1.25rem; }
.doc-card .checklist{ margin-bottom: .75rem; }
.step-list{ padding-left: 1.2rem; color: var(--nm-slate-600); margin: 0; }
.step-list li{ padding: .35rem 0; line-height: 1.55; }

/* On-page jump links */
.jump-links{
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  align-items: center;
  padding: 1rem 1.25rem;
  background: var(--nm-cream);
  border: 1px solid var(--nm-border);
  border-radius: 1rem;
}
.jump-links .jump-label{ font-weight: 600; font-size: .85rem; margin-right: .25rem; color: var(--nm-ink-text); }
.jump-links a{
  font-size: .85rem;
  text-decoration: none;
  color: var(--nm-green-dark);
  background: #fff;
  border: 1px solid var(--nm-border);
  border-radius: 50rem;
  padding: .3rem .85rem;
  transition: all .2s ease;
}
.jump-links a:hover{ background: var(--nm-green); color: #fff; border-color: var(--nm-green); }

/* Anchored sections clear the fixed navbar */
[id]{ scroll-margin-top: 96px; }

/* FAQ page groups */
.faq-group{ padding: 3.5rem 0; }
.faq-group-title{
  display: flex;
  align-items: center;
  gap: .6rem;
  font-size: 1.5rem;
  margin-bottom: 1.5rem;
}
.faq-group-title i{ color: var(--nm-green); }

/* Parts chips */
.parts-chips .city-chip{ font-size: .95rem; padding: .55rem 1.2rem; }

/* Long-form text (legal pages) */
.prose h2{ font-size: 1.35rem; margin: 2rem 0 .75rem; }
.prose h2:first-child{ margin-top: 0; }
.prose p, .prose li{ color: var(--nm-slate-600); line-height: 1.7; }
.prose ul{ padding-left: 1.2rem; }

/* Map embed */
.map-embed{ border-radius: 1rem; overflow: hidden; border: 1px solid var(--nm-border); aspect-ratio: 4 / 3; }
.map-embed iframe{ width: 100%; height: 100%; border: 0; display: block; }

/* Contact info rows: allow a link under the text */
.contact-info-item > div:last-child{ min-width: 0; }

/* Gallery items are focusable */
.gallery-item:focus-visible{ outline: 3px solid var(--nm-green-bright); outline-offset: 3px; }

/* Breadcrumb is a nav element now */
nav.breadcrumb-nm{ flex-wrap: wrap; }

/* Hero stat pills hold short phrases now */
.hero-stat-pill .stat-label{ text-transform: none; }

@media (max-width: 575.98px){
  .doc-card, .doc-panel, .price-factor{ padding: 1.25rem; }
  .faq-group{ padding: 2.5rem 0; }
}
.text-uppercase::placeholder{ text-transform: none; }
.doc-card .icon-box{
  width: 48px; height: 48px;
  border-radius: .85rem;
  background: var(--nm-green-light);
  color: var(--nm-green-dark);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.25rem;
  flex-shrink: 0;
}
.estimate-result .range-value{ font-size: clamp(1.35rem, 2.2vw, 1.9rem); }

/* ==========================================================================
   Navbar clean-up and hero images (October 2026)
   ========================================================================== */
/* Bigger logo */
.navbar-brand-nm .logo-badge{ padding: .35rem .75rem; border-radius: .9rem; }
.navbar-brand-nm .logo-badge img{ height: 52px; }
.navbar-nm.is-scrolled .navbar-brand-nm .logo-badge{ padding: .3rem .6rem; }
.navbar-nm.is-scrolled .navbar-brand-nm .logo-badge img{ height: 42px; }
.footer-nm .logo-badge img{ height: 56px; width: auto; }

/* Menu: one line per item, even spacing, no clutter */
.navbar-nm .navbar-nav{ gap: .25rem; }
.nav-link-nm{ white-space: nowrap; font-size: .95rem; font-weight: 500; padding: .55rem .95rem !important; }
.nav-link-nm.dropdown-toggle::after{ margin-left: .35rem; }
.nav-cta{ gap: .5rem; }
.btn-nm-gold-sm{ white-space: nowrap; padding: .7rem 1.4rem; font-size: .92rem; }
@media (min-width: 992px) and (max-width: 1199.98px){
  .nav-link-nm{ padding: .5rem .65rem !important; font-size: .9rem; }
  .navbar-brand-nm .logo-badge img{ height: 44px; }
  .btn-nm-gold-sm{ padding: .6rem 1.1rem; }
}
@media (max-width: 991.98px){
  .navbar-brand-nm .logo-badge img{ height: 44px; }
  .navbar-nm .navbar-nav{ gap: .1rem; }
  .nav-link-nm{ width: 100%; }
  .nav-cta .btn-nm-gold-sm{ width: 100%; justify-content: center; }
}

/* Inner page hero with a picture beside the heading */
.page-hero.has-image{ padding-bottom: 4.5rem; }
.page-hero-img{
  position: relative;
  border-radius: var(--nm-radius-lg);
  overflow: hidden;
  box-shadow: 0 30px 60px -25px rgba(0,0,0,.6);
  border: 1px solid rgba(255,255,255,.12);
  aspect-ratio: 3 / 2;
  background: rgba(255,255,255,.05);
}
.page-hero-img img{ width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 991.98px){
  .page-hero.has-image{ padding-bottom: 3rem; }
  .page-hero-img{ margin-top: .5rem; }
}

.btn-nm-gold-sm, .btn-nm-gold-sm:hover{ text-decoration: none; }

/* Inner page hero: picture as full background, dark shade, white text */
.page-hero.has-bg{ background: #05080c; padding-top: 10.5rem; padding-bottom: 6rem; min-height: 560px; display: flex; align-items: center; }
.page-hero.has-bg > .container{ z-index: 2; }
.page-hero-bg{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.page-hero.has-bg::before{
  content: ""; position: absolute; inset: 0; z-index: 1;
  background:
    linear-gradient(90deg, rgba(0,0,0,.88) 0%, rgba(0,0,0,.68) 45%, rgba(0,0,0,.35) 100%),
    linear-gradient(180deg, rgba(0,0,0,.6) 0%, rgba(0,0,0,.15) 40%, rgba(0,0,0,.65) 100%);
}
.page-hero.has-bg::after{ z-index: 1; opacity: .25; }
.page-hero-text{ max-width: 46rem; }
.page-hero.has-bg h1{ color: #fff; text-shadow: 0 2px 18px rgba(0,0,0,.45); }
.page-hero.has-bg .lead{ color: rgba(255,255,255,.92); }
.page-hero.has-bg .breadcrumb-nm, .page-hero.has-bg .breadcrumb-nm a{ color: rgba(255,255,255,.85); }
@media (max-width: 991.98px){ .page-hero.has-bg{ padding-top: 8.5rem; padding-bottom: 4rem; min-height: 0; } }

/* Dropdown: keep it open while the mouse moves from the menu name down into the list */
@media (min-width: 992px){
  .dropdown-menu-nm::before{ content: ""; position: absolute; left: 0; right: 0; top: -1.1rem; height: 1.1rem; }
  .navbar-nm .dropdown-menu.dropdown-menu-nm{ transition: opacity .2s ease .15s, transform .2s ease .15s, visibility 0s linear .35s; }
  .navbar-nav .dropdown:hover > .dropdown-menu.dropdown-menu-nm{ transition-delay: 0s, 0s, 0s; }
}

/* Phones and tablets: slide-in blocks only fade, so nothing starts off-screen and the page can't pan sideways */
@media (max-width: 991.98px){
  [data-aos="fade-left"], [data-aos="fade-right"]{ transform: none !important; }
  .spares-banner{ overflow: hidden; }
}
@media (max-width: 575.98px){
  .row.g-5{ --bs-gutter-x: 1.5rem; }
  .flow-stat{ flex-direction: column-reverse; align-items: flex-start; gap: .2rem; }
  .flow-stat .label{ text-align: left; }
}

/* Logo: transparent artwork straight on the dark header and footer, no white box */
.navbar-brand-nm .logo-badge,
.navbar-nm.is-scrolled .navbar-brand-nm .logo-badge,
.footer-nm .logo-badge{ background: transparent; padding: 0; border-radius: 0; box-shadow: none; }
.navbar-brand-nm:hover .logo-badge{ box-shadow: none; }
.navbar-brand-nm .logo-badge img{ height: 68px; }
.navbar-nm.is-scrolled .navbar-brand-nm .logo-badge img{ height: 54px; }
.footer-nm .logo-badge img{ height: 72px; }
@media (min-width: 992px) and (max-width: 1199.98px){ .navbar-brand-nm .logo-badge img{ height: 58px; } }
@media (max-width: 991.98px){ .navbar-brand-nm .logo-badge img{ height: 56px; } .navbar-nm.is-scrolled .navbar-brand-nm .logo-badge img{ height: 48px; } }

/* Home hero: text and form line up, heading fits in about three lines, no blobs behind the form */
.hero-nm h1{ font-size: clamp(2.2rem, 3.5vw, 3.25rem); line-height: 1.12; }
.hero-nm .lead{ font-size: 1.06rem; max-width: 40rem; }
.hero-underline{ background: none; color: var(--nm-green-bright); }
.hero-stats-row{ margin-top: 1.75rem; padding-top: 1.25rem; }
.quote-card{ padding: 1.6rem 1.6rem 1.35rem; }
.quote-card h2{ font-size: 1.35rem; }
.quote-card-wrap::before, .quote-card-wrap::after{ display: none; }
.quote-card-wrap{ display: flex; flex-direction: column; }
.hero-float-badge{ order: 2; position: relative; left: auto; bottom: auto; margin: 1rem auto 0; width: fit-content; animation: none; }
@media (min-width: 992px){ .hero-nm{ padding-top: 8.5rem; padding-bottom: 3.5rem; } }

/* Logo a step bigger */
.navbar-brand-nm .logo-badge img{ height: 90px; }
.navbar-nm.is-scrolled .navbar-brand-nm .logo-badge img{ height: 69px; }
@media (min-width: 992px) and (max-width: 1199.98px){ .navbar-brand-nm .logo-badge img{ height: 76px; } }
@media (max-width: 991.98px){ .navbar-brand-nm .logo-badge img{ height: 62px; } .navbar-nm.is-scrolled .navbar-brand-nm .logo-badge img{ height: 52px; } }

/* Tablets in landscape too: slide-in blocks only fade */
@media (max-width: 1199.98px){ [data-aos="fade-left"], [data-aos="fade-right"]{ transform: none !important; } }

/* Hero info boxes: three even boxes in one row at every width */
.hero-stats-row{ display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.hero-stat-pill{ min-width: 0; }
.hero-stat-pill .stat-label{ white-space: normal; line-height: 1.25; }
@media (max-width: 575.98px){
  .hero-stats-row{ gap: .5rem; }
  .hero-stat-pill{ flex-direction: column; align-items: flex-start; gap: .35rem; padding: .7rem .75rem; }
  .hero-stat-pill .stat-num{ font-size: 1rem; }
  .hero-stat-pill .stat-label{ font-size: .68rem; }
}

/* All sizes: slide-in blocks only fade, so nothing ever sits outside the page */
[data-aos="fade-left"], [data-aos="fade-right"]{ transform: none !important; }

/* ---------- Home: how we work out your price (mobile first) ---------- */
.factor-list{ list-style: none; margin: 0; padding: 0; display: grid; gap: .75rem; }
.factor{ display: flex; gap: .9rem; align-items: flex-start; background: #fff; border: 1px solid var(--nm-border); border-radius: 1rem; padding: 1rem 1.1rem; box-shadow: 0 8px 22px -16px rgba(10,30,20,.3); }
.factor-icon{ flex: 0 0 2.6rem; height: 2.6rem; border-radius: .8rem; display: grid; place-items: center; background: var(--nm-green-light); color: var(--nm-green); font-size: 1.15rem; }
.factor-title{ font-size: 1rem; font-weight: 700; margin: .15rem 0 .2rem; color: var(--nm-ink-text); }
.factor p{ margin: 0; color: var(--nm-slate-600); font-size: .93rem; line-height: 1.5; }
.price-sides{ display: grid; gap: .75rem; }
.price-side{ border-radius: 1rem; padding: 1.1rem 1.2rem; border: 1px solid; }
.price-side.up{ background: #effaf3; border-color: #cdebd8; }
.price-side.down{ background: #fff4f1; border-color: #f6d6cc; }
.price-side h3{ font-size: .98rem; font-weight: 700; display: flex; align-items: center; gap: .45rem; margin: 0 0 .65rem; color: var(--nm-ink-text); }
.price-side.up h3 i{ color: var(--nm-green); }
.price-side.down h3 i{ color: var(--nm-coral); }
.price-side ul{ list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; }
.price-side li{ position: relative; padding-left: 1.15rem; font-size: .92rem; line-height: 1.45; color: var(--nm-ink-text); }
.price-side li::before{ content: ""; position: absolute; left: .15rem; top: .55em; width: .45rem; height: .45rem; border-radius: 50%; }
.price-side.up li::before{ background: var(--nm-green-bright); }
.price-side.down li::before{ background: var(--nm-coral); }
.price-promise{ display: flex; gap: .8rem; align-items: flex-start; background: var(--nm-ink); border-radius: 1rem; padding: 1rem 1.15rem; margin-top: .75rem; }
.price-promise i{ font-size: 1.35rem; color: var(--nm-green-bright); line-height: 1; margin-top: .1rem; }
.price-promise p{ margin: 0; font-size: .92rem; line-height: 1.55; color: rgba(255,255,255,.88); }
.price-cta{ display: flex; justify-content: center; width: 100%; margin-top: 1rem; }
@media (min-width: 576px){
  .factor-list{ grid-template-columns: 1fr 1fr; }
  .factor:last-child{ grid-column: 1 / -1; }
  .price-cta{ display: inline-flex; width: auto; }
}
@media (min-width: 576px) and (max-width: 991.98px){ .price-sides{ grid-template-columns: 1fr 1fr; } }

/* ---------- Home: registered facility vs scrap dealer (cards on phones, grid on desktop) ---------- */
.vs-board{ display: grid; gap: .75rem; max-width: 980px; margin: 0 auto; }
.vs-row{ display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; background: #fff; border: 1px solid var(--nm-border); border-radius: 1rem; padding: .85rem; box-shadow: 0 8px 22px -16px rgba(10,30,20,.3); }
.vs-head{ display: none; }
.vs-label{ grid-column: 1 / -1; font-weight: 700; font-size: .95rem; color: var(--nm-ink-text); padding: 0 .15rem .1rem; }
.vs-cell{ display: flex; flex-direction: column; gap: .3rem; padding: .65rem .7rem; border-radius: .75rem; font-size: .88rem; line-height: 1.4; }
.vs-who{ display: inline-flex; align-items: center; gap: .35rem; font-size: .68rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.vs-who i{ font-size: .95rem; }
.vs-cell.vs-us{ background: #effaf3; color: var(--nm-ink-text); }
.vs-cell.vs-us .vs-who{ color: var(--nm-green); }
.vs-cell.vs-them{ background: #f5f6f8; color: var(--nm-slate-600); }
.vs-cell.vs-them .vs-who{ color: #8a94a0; }
.vs-cell.vs-them.no .vs-who i{ color: var(--nm-coral); }
.vs-cell.vs-them.warn .vs-who i{ color: #d99a1e; }
@media (min-width: 992px){
  .vs-board{ gap: 0; background: #fff; border: 1px solid var(--nm-border); border-radius: 1.25rem; overflow: hidden; box-shadow: var(--nm-shadow-soft); }
  .vs-row{ grid-template-columns: 1.1fr 1.3fr 1fr; gap: 0; border: 0; border-top: 1px solid var(--nm-border); border-radius: 0; padding: 0; box-shadow: none; }
  .vs-head{ display: grid; border-top: 0; background: var(--nm-ink); color: #fff; font-weight: 700; font-size: .9rem; }
  .vs-head > span{ padding: 1rem 1.25rem; }
  .vs-head .vs-us{ background: var(--nm-green); }
  .vs-label{ grid-column: auto; display: flex; align-items: center; padding: .95rem 1.25rem; font-size: .93rem; }
  .vs-cell{ flex-direction: row; align-items: center; gap: .55rem; border-radius: 0; padding: .95rem 1.25rem; font-size: .92rem; }
  .vs-who b{ display: none; }
  .vs-row:not(.vs-head):hover{ background: #fbfdfb; }
}

/* ---------- Header hides while scrolling down, comes back on scroll up ---------- */
.navbar-nm{ transition: transform .35s cubic-bezier(.2,.8,.2,1), background-color .35s ease, padding .35s ease, box-shadow .35s ease; will-change: transform; }
.navbar-nm.nav-hidden{ transform: translateY(-110%); box-shadow: none; }

/* =========== Design refresh, 5 Oct 2026: full-screen photo heroes and calmer sections =========== */

/* Inner page heroes fill the screen with their photo */
.page-hero.has-bg{ min-height: 100vh; min-height: 100svh; padding-top: 9rem; padding-bottom: 5rem; }
@media (max-width: 991.98px){ .page-hero.has-bg{ min-height: 100vh; min-height: 100svh; padding-top: 7.5rem; padding-bottom: 3.5rem; } }

/* Tick lists: one tidy card per item, two columns automatically when there is room */
.checklist{ display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 290px), 1fr)); gap: .6rem; margin: 0 0 1.25rem; }
.checklist li{ align-items: center; gap: .8rem; padding: .8rem 1rem; background: #fff; border: 1px solid var(--nm-border); border-radius: .9rem; color: var(--nm-ink-text); line-height: 1.45; font-size: .96rem; box-shadow: 0 6px 18px -14px rgba(10,30,20,.28); }
.checklist li i{ display: grid; place-items: center; width: 1.85rem; height: 1.85rem; border-radius: 50%; background: var(--nm-navy-light); color: var(--nm-navy); font-size: 1rem; margin-top: 0; }
.checklist li i::before{ line-height: 1; }
.doc-card .checklist, .doc-panel .checklist, .who-card .checklist, .note-box .checklist, .info-panel .checklist{ grid-template-columns: 1fr; gap: .15rem; }
.doc-card .checklist li, .doc-panel .checklist li, .who-card .checklist li, .note-box .checklist li, .info-panel .checklist li{ background: none; border: 0; box-shadow: none; padding: .45rem 0; }
.doc-card .checklist li i, .doc-panel .checklist li i{ width: 1.6rem; height: 1.6rem; font-size: .9rem; }

/* Headings that sit in a half-width column are a size smaller */
.mb-4 > .section-title{ font-size: clamp(1.6rem, 2.4vw, 2.2rem); }

/* Raises / lowers boxes on the vehicle pages match the home page */
.price-factor{ border-radius: 1rem; padding: 1.15rem 1.25rem; border: 1px solid var(--nm-border); background: #fff; box-shadow: none; }
.price-factor.up{ background: #effaf3; border-color: #cdebd8; }
.price-factor.down{ background: #fff4f1; border-color: #f6d6cc; }
.price-factor ul{ list-style: none; padding: 0; margin: 0; display: grid; gap: .45rem; }
.price-factor li{ position: relative; padding-left: 1.15rem; font-size: .93rem; line-height: 1.45; color: var(--nm-ink-text); }
.price-factor li::before{ content: ""; position: absolute; left: .15rem; top: .55em; width: .45rem; height: .45rem; border-radius: 50%; background: var(--nm-green-bright); }
.price-factor.down li::before{ background: var(--nm-coral); }

/* Text-only columns sit in a calm white panel */
.info-panel{ background: #fff; border: 1px solid var(--nm-border); border-radius: 1.1rem; padding: 1.25rem 1.35rem; box-shadow: 0 10px 28px -18px rgba(10,30,20,.3); }
.info-panel p{ color: var(--nm-slate-600); line-height: 1.7; }
.info-panel p:last-child{ margin-bottom: 0; }

/* Two icon tiles: side by side on tablets, stacked in a half-width desktop column */
.factor-list.duo{ grid-template-columns: 1fr; }
@media (min-width: 576px){ .factor-list.duo .factor:last-child{ grid-column: auto; } .factor-list.duo{ grid-template-columns: 1fr; } }
@media (min-width: 768px) and (max-width: 991.98px){ .factor-list.duo{ grid-template-columns: 1fr 1fr; } }
@media (min-width: 992px){ .factor-list.duo{ grid-template-columns: 1fr; } }
.factor-icon.c-blue{ background: var(--nm-navy-light); color: var(--nm-navy); }

/* Phones: a little less height everywhere */
@media (max-width: 575.98px){
  .section-py{ padding-top: 3.75rem; padding-bottom: 3.75rem; }
  .section-title{ font-size: 1.8rem; }
  .mb-4 > .section-title{ font-size: 1.6rem; }
  .checklist li{ font-size: .94rem; padding: .75rem .9rem; }
}

/* Plain tick lists only: two columns of blue checkbox items, no boxes (after the Scrapcar template) */
.checklist{ grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap: .6rem 1.6rem; }
.checklist li{ background: none; border: 0; box-shadow: none; padding: .15rem 0; align-items: flex-start; font-weight: 500; color: var(--nm-ink-text); font-size: .96rem; }
.checklist li i{ width: 1.3rem; height: 1.3rem; border-radius: .3rem; background: var(--nm-navy-bright); color: #fff; font-size: .8rem; margin-top: .15rem; }
.doc-card .checklist li i, .doc-panel .checklist li i{ width: 1.2rem; height: 1.2rem; font-size: .75rem; }
@media (max-width: 575.98px){ .checklist li{ font-size: .94rem; padding: .1rem 0; } }

/* Footer social icons take each app's own colour on hover */
.footer-social a{ color: #fff; }
.footer-social a.soc-facebook:hover{ background: #1877f2; border-color: #1877f2; box-shadow: 0 10px 22px -8px rgba(24,119,242,.6); }
.footer-social a.soc-instagram:hover{ background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%); border-color: #d6249f; box-shadow: 0 10px 22px -8px rgba(214,36,159,.6); }
.footer-social a.soc-youtube:hover{ background: #ff0000; border-color: #ff0000; box-shadow: 0 10px 22px -8px rgba(255,0,0,.55); }
.footer-social a.soc-x:hover{ background: #000; border-color: #444; box-shadow: 0 10px 22px -8px rgba(0,0,0,.7); }
.footer-social a.soc-linkedin:hover{ background: #0a66c2; border-color: #0a66c2; box-shadow: 0 10px 22px -8px rgba(10,102,194,.6); }
.footer-social a.soc-whatsapp:hover{ background: #25d366; border-color: #25d366; box-shadow: 0 10px 22px -8px rgba(37,211,102,.6); }
.footer-social a:hover i{ color: #fff; }

/* Icon tiles: short bold title + one line, used where long lists and paragraph panels were */
.tile-grid{ display: grid; gap: .8rem; grid-template-columns: 1fr; margin-bottom: 1rem; }
@media (min-width: 576px) and (max-width: 991.98px){ .tile-grid{ grid-template-columns: 1fr 1fr; } }
@media (min-width: 992px){ .tile-grid.tile-cols-2{ grid-template-columns: 1fr 1fr; } .tile-grid.tile-cols-3{ grid-template-columns: repeat(3, 1fr); } }
.tile{ display: flex; gap: .85rem; align-items: flex-start; background: #fff; border: 1px solid var(--nm-border); border-radius: 1rem; padding: 1rem 1.1rem; box-shadow: 0 8px 22px -16px rgba(10,30,20,.3); }
.tile-icon{ flex: 0 0 2.5rem; height: 2.5rem; border-radius: .75rem; display: grid; place-items: center; background: var(--nm-navy-light); color: var(--nm-navy); font-size: 1.1rem; }
.tile-title{ font-family: 'Sora', 'Inter', sans-serif; font-size: .98rem; font-weight: 700; margin: .1rem 0 .2rem; color: var(--nm-ink-text); line-height: 1.3; }
.tile p{ margin: 0; font-size: .9rem; line-height: 1.5; color: var(--nm-slate-600); }
.tile p a{ color: var(--nm-green-dark); font-weight: 500; }
.doc-card .tile-grid{ grid-template-columns: 1fr; gap: .2rem; margin-bottom: 0; }
.doc-card .tile{ background: none; border: 0; box-shadow: none; padding: .55rem 0; }
.doc-card .tile-icon{ flex-basis: 2.2rem; height: 2.2rem; font-size: 1rem; }

/* Document chips: icon + document name, condition in small text */
.doc-chips{ list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: .6rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr)); }
.doc-chips li{ display: flex; align-items: center; gap: .75rem; background: #fff; border: 1px solid var(--nm-border); border-radius: .9rem; padding: .7rem .9rem; box-shadow: 0 6px 18px -14px rgba(10,30,20,.28); }
.doc-chips li > i{ flex: 0 0 2.1rem; height: 2.1rem; border-radius: .6rem; display: grid; place-items: center; background: var(--nm-navy-light); color: var(--nm-navy); font-size: 1rem; }
.doc-chips span{ font-weight: 600; font-size: .93rem; color: var(--nm-ink-text); line-height: 1.3; }
.doc-chips small{ display: block; font-weight: 400; font-size: .8rem; color: var(--nm-slate-600); margin-top: .15rem; line-height: 1.35; }
.doc-chips.two{ grid-template-columns: 1fr 1fr; }
.doc-panel .doc-chips li{ background: var(--nm-cream); border-color: transparent; box-shadow: none; }

/* Chips inside the special-case cards sit on a soft background */
.doc-card .doc-chips{ grid-template-columns: 1fr; gap: .45rem; }
.doc-card .doc-chips li{ background: var(--nm-cream); border-color: transparent; box-shadow: none; padding: .6rem .8rem; }

/* Introducing section on Home (client text, 12 Oct 2026): big plant photo with a second photo and a badge, short text and a quote beside it, four cards below */
.intro-nm{ padding-top: 2.5rem; }
.intro-media{ position: relative; padding-bottom: 3.5rem; margin-right: 1rem; }
.intro-media .gallery-item{ height: auto; min-height: 0; aspect-ratio: 4 / 3; }
.intro-media .intro-main{ box-shadow: var(--nm-shadow-soft); }
.intro-media .intro-second{ position: absolute; right: -1rem; bottom: 0; width: 46%; border: 6px solid var(--nm-cream); box-shadow: var(--nm-shadow-lift); }
.intro-badge{ position: absolute; left: 1rem; top: 1rem; z-index: 2; display: flex; align-items: center; gap: .75rem; max-width: 75%; background: var(--nm-forest-900); color: #fff; border-radius: 1rem; padding: .85rem 1.1rem; box-shadow: var(--nm-shadow-lift); }
.intro-badge i{ font-size: 1.5rem; color: var(--nm-green-bright); }
.intro-badge .ib-num{ display: block; font-family: 'Sora', 'Inter', sans-serif; font-weight: 700; font-size: 1.15rem; line-height: 1.15; }
.intro-badge .ib-label{ display: block; margin-top: .15rem; font-size: .78rem; line-height: 1.3; color: rgba(255,255,255,.75); }
.intro-text{ color: var(--nm-slate-600); line-height: 1.75; margin-bottom: 1rem; }
/* Desktop: the photo group stretches to the height of the text beside it, so tops and bottoms line up */
@media (min-width: 992px){
  .intro-top > .col-lg-6:first-child{ display: flex; }
  .intro-top .intro-media{ flex: 1; display: flex; flex-direction: column; }
  .intro-top .intro-media .intro-main{ flex: 1; aspect-ratio: auto; min-height: 320px; }
  .intro-top .intro-media .intro-main img{ position: absolute; inset: 0; }
}
@media (max-width: 991.98px){ .intro-media{ margin-right: 0; } .intro-media .intro-second{ right: 0; } }
@media (max-width: 575.98px){
  .intro-media{ padding-bottom: 3rem; }
  .intro-media .intro-second{ width: 52%; border-width: 4px; }
  .intro-badge{ left: .6rem; top: .6rem; max-width: 80%; gap: .5rem; padding: .6rem .75rem; }
  .intro-badge i{ font-size: 1.2rem; }
  .intro-badge .ib-num{ font-size: 1rem; }
  .intro-badge .ib-label{ font-size: .72rem; }
}

/* Facility photos: slider on Home, photo grid on the Our Facility page. Captions always show, so they work on phones too. */
.facility-slider .swiper{ padding: .25rem; }
.facility-tile{ height: auto; min-height: 0; aspect-ratio: 4 / 3; }
.facility-tile .gallery-overlay, .gallery-grid .gallery-overlay, .intro-media .gallery-overlay{ opacity: 1; background: linear-gradient(0deg, rgba(6,15,11,.78) 0%, rgba(6,15,11,0) 45%); }
/* 13 photos: 3 columns on desktop with the first and last tile two columns wide (5 full rows); 2 columns below 992px with the first tile full width (7 full rows) */
.gallery-grid{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; }
.gallery-grid .gallery-item{ height: auto; min-height: 0; aspect-ratio: 4 / 3; }
.gallery-grid .g-wide{ grid-column: span 2; }
@media (min-width: 576px){ .gallery-grid{ gap: 1rem; } }
@media (min-width: 992px){
  .gallery-grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .gallery-grid .g-wide-lg{ grid-column: span 2; aspect-ratio: auto; }
  .gallery-grid .g-wide-lg img{ position: absolute; inset: 0; }
}
@media (max-width: 575.98px){
  .gallery-grid .gallery-overlay{ padding: .6rem; }
  .gallery-grid .gallery-caption{ font-size: .8rem; }
}


/* Footer contact list: same row spacing as the other footer columns (small text, gap-2), so every line sits level
   with the links beside it. The round icon badge is 24px but its negative margins keep the row at the text height. */
.footer-contact li{ display: flex; align-items: flex-start; gap: .6rem; line-height: 1.5; }
.footer-contact li > i{ flex: 0 0 24px; width: 24px; height: 24px; margin: -1.5px 0; border-radius: 50%; display: grid; place-items: center; background: rgba(79,201,74,.14); border: 1px solid rgba(79,201,74,.28); color: var(--nm-green-bright); font-size: .78rem; }
.footer-contact li > a, .footer-contact li > span{ min-width: 0; overflow-wrap: break-word; }
.footer-contact a[href^="tel:"]{ white-space: nowrap; }
.footer-contact li:hover > i{ background: var(--nm-green-bright); color: var(--nm-ink); }

/* Home price section, even layout: five factor cards in one row on wide screens (3 + 2 centred on tablets),
   the raises and lowers panels side by side, then the promise and the button in one band */
.price-how .factor-row{ display: flex; flex-wrap: wrap; justify-content: center; gap: 1rem; }
.price-how .factor-row .factor{ flex: 0 1 100%; }
.price-how .price-side{ padding: 1.4rem 1.5rem; }
.price-how .price-side h3{ font-size: 1.05rem; margin-bottom: .9rem; }
.price-how .price-side li{ font-size: .95rem; }
.price-band{ align-items: center; flex-wrap: wrap; gap: 1rem 1.25rem; margin-top: 1.5rem; padding: 1.25rem 1.5rem; }
.price-band i{ font-size: 1.6rem; margin-top: 0; }
.price-band p{ flex: 1 1 300px; font-size: .95rem; }
.price-band .price-cta{ margin-top: 0; flex: 0 0 auto; }
@media (min-width: 576px){ .price-how .factor-row .factor{ flex-basis: calc(50% - .5rem); } }
@media (min-width: 768px){
  .price-how .factor-row .factor{ flex-basis: calc((100% - 2rem) / 3); flex-direction: column; gap: .8rem; padding: 1.25rem; }
  .price-how .factor-row .factor-icon{ flex: 0 0 auto; width: 2.8rem; height: 2.8rem; }
}
@media (min-width: 1200px){ .price-how .factor-row .factor{ flex-basis: calc((100% - 4rem) / 5); } }
@media (max-width: 575.98px){ .price-band{ padding: 1.1rem; } .price-band .price-cta{ width: 100%; justify-content: center; } }

/* Intro cards on Home: icon on the left, text left-aligned, two per row */
.intro-card{ display: flex; gap: 1.1rem; align-items: flex-start; text-align: left; padding: 1.6rem 1.5rem; }
.intro-card .icon-circle{ flex: 0 0 auto; width: 58px; height: 58px; font-size: 1.45rem; margin: 0; }
.intro-card h3{ margin: .35rem 0 .45rem; }
.intro-card p{ line-height: 1.65; }
@media (max-width: 575.98px){ .intro-card{ padding: 1.25rem 1.1rem; gap: .9rem; } .intro-card .icon-circle{ width: 48px; height: 48px; font-size: 1.2rem; } }

/* ---------- Spare parts catalogue (managed in Admin > Spare parts) ---------- */
.part-card { display: flex; flex-direction: column; background: #fff; border: 1px solid rgba(13, 37, 80, .1); border-radius: 1rem; overflow: hidden; box-shadow: var(--nm-shadow-soft); transition: transform .2s ease, box-shadow .2s ease; }
.part-card:hover { transform: translateY(-3px); box-shadow: 0 14px 30px rgba(13, 37, 80, .14); }
.part-card-img { aspect-ratio: 4 / 3; background: #eef2fa; }
.part-card-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.part-card-body { display: flex; flex-direction: column; flex: 1; padding: 1rem; }
.part-card-cat { font-size: .72rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--nm-green, #1b7f5c); margin-bottom: .25rem; }
.part-card-price { color: #0d2550; font-size: 1.05rem; }