/* ==========================================================================
   NIWCI Public Site - Corporate Design Overlay
   Loaded LAST (after orange.css + responsive.css) so it overrides the
   default ImmiEx template skin with a clean corporate brand look that
   matches the NIWCI admin panels (indigo/violet identity).
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');

:root {
  --nw-primary: #6d5efc;
  --nw-primary-dark: #5a4af0;
  --nw-violet: #a855f7;
  --nw-gradient: linear-gradient(135deg, #6d5efc 0%, #a855f7 100%);
  --nw-gradient-blue: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  --nw-dark: #1e1b4b;
  --nw-dark-2: #312e81;
  --nw-text: #334155;
  --nw-heading: #1e293b;
  --nw-border: #e8eaf0;
  --nw-bg-soft: #f4f5fb;
  --nw-shadow: 0 10px 30px rgba(16, 24, 40, 0.08);
  --nw-radius: 14px;
}

html, body {
  font-family: 'Inter', 'Muli', 'Roboto', sans-serif !important;
  color: var(--nw-text);
  scroll-behavior: smooth;
}

body {
  background: #ffffff;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Inter', 'Muli', sans-serif !important;
  letter-spacing: -0.3px;
}

p {
  font-family: 'Inter', sans-serif !important;
  line-height: 1.7;
}

/* ==========================================================================
   BRAND COLOR OVERRIDES (orange -> indigo/violet)
   ========================================================================== */
.orange-color,
.orange-color h2, .orange-color h3, .orange-color h4, .orange-color h5,
.orange-color h6, .orange-color p, .orange-color a, .orange-color li,
.orange-color i, .orange-color span,
.white-color .orange-color,
.white-color .orange-color span {
  color: var(--nw-primary) !important;
}

.bg-orange { background-color: var(--nw-primary) !important; background-image: var(--nw-gradient) !important; }

.darkblue-color,
.darkblue-color h2, .darkblue-color h3, .darkblue-color h4, .darkblue-color h5,
.darkblue-color h6, .darkblue-color p, .darkblue-color a, .darkblue-color li,
.darkblue-color i, .darkblue-color span,
.white-color .darkblue-color {
  color: var(--nw-heading) !important;
}

.bg-darkblue { background-color: var(--nw-dark) !important; }

/* ==========================================================================
   BUTTONS
   ========================================================================== */
.btn {
  border-radius: 10px !important;
  font-weight: 600 !important;
  letter-spacing: 0.2px;
  transition: all 0.25s ease !important;
}

.btn-primary,
.white-color .btn-primary {
  color: #fff !important;
  background-image: var(--nw-gradient) !important;
  border: 0 !important;
  box-shadow: 0 6px 18px rgba(109, 94, 252, 0.35) !important;
}

.btn-primary:hover,
.btn-primary:focus,
.white-color .btn-primary:hover {
  background-image: linear-gradient(135deg, #5a4af0 0%, #9333ea 100%) !important;
  box-shadow: 0 10px 24px rgba(109, 94, 252, 0.45) !important;
  transform: translateY(-2px);
  color: #fff !important;
}

.btn-orange,
.white-color .btn-orange {
  color: #fff !important;
  background-image: var(--nw-gradient) !important;
  border-color: transparent !important;
}

.btn.orange-hover:hover,
.btn.orange-hover:focus {
  background-image: var(--nw-gradient) !important;
  border-color: transparent !important;
  color: #fff !important;
}

/* ==========================================================================
   HEADER
   ========================================================================== */
#header-2.white-menu .header-wrapper {
  background: #ffffff;
  box-shadow: 0 2px 20px rgba(30, 27, 75, 0.08);
}

/* Top strip */
.headtoppart {
  background: linear-gradient(90deg, var(--nw-dark) 0%, var(--nw-dark-2) 100%) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.headertopleft .header-info span {
  font-size: 13px;
  letter-spacing: 0.3px;
  color: rgba(255, 255, 255, 0.85);
}

.headertopright a {
  font-weight: 600;
  font-size: 13.5px;
}

/* Main navigation */
.wsmainfull.menu {
  border-bottom: 1px solid var(--nw-border);
}

.wsmenu > .wsmenu-list > li > a {
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  font-size: 14.5px !important;
  color: var(--nw-heading) !important;
  letter-spacing: 0.2px;
  transition: color 0.2s ease;
}

.wsmenu > .wsmenu-list > li > a:hover,
.wsmenu > .wsmenu-list > li > a:focus {
  color: var(--nw-primary) !important;
}

.wsmenu > .wsmenu-list > li > ul.sub-menu {
  border-radius: 12px;
  box-shadow: 0 18px 40px rgba(30, 27, 75, 0.14) !important;
  border: 1px solid var(--nw-border);
}

.wsmenu > .wsmenu-list > li > ul.sub-menu > li > a {
  font-family: 'Inter', sans-serif !important;
  font-size: 14px !important;
  font-weight: 500;
  color: var(--nw-text) !important;
}

.wsmenu > .wsmenu-list > li > ul.sub-menu > li > a:hover {
  color: var(--nw-primary) !important;
  background: #f4f5fb !important;
}

/* Header CTA button (Centre Login) */
.wsmenu > .wsmenu-list > li a.header-btn {
  border-radius: 50px !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 700 !important;
  padding: 10px 24px !important;
  letter-spacing: 0.3px;
}

.wsmenu > .wsmenu-list > li a.header-btn.btn-primary {
  background-image: var(--nw-gradient) !important;
  box-shadow: 0 6px 16px rgba(109, 94, 252, 0.35);
}

.wsmenu > .wsmenu-list > li a.header-btn.primary-hover:hover {
  background-image: linear-gradient(135deg, #5a4af0 0%, #9333ea 100%) !important;
  box-shadow: 0 10px 22px rgba(109, 94, 252, 0.45);
  transform: translateY(-2px);
}

/* ==========================================================================
   HERO SLIDER
   ========================================================================== */
#hero-2 .caption-txt h3 {
  font-family: 'Inter', sans-serif !important;
  font-weight: 700 !important;
  font-size: 16px !important;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: var(--nw-primary) !important;
}

#hero-2 .caption-txt h2 {
  font-family: 'Inter', sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.5px;
  color: #16233c !important;
}

#hero-2 .caption-txt h4 {
  font-family: 'Inter', sans-serif !important;
  color: #334155 !important;
}

/* ==========================================================================
   SECTION TITLES
   ========================================================================== */
.section-title h2,
.section-title h3 {
  font-weight: 800 !important;
  letter-spacing: -0.4px;
  position: relative;
}

.section-title.center h2:after {
  content: "";
  display: block;
  width: 60px;
  height: 4px;
  border-radius: 4px;
  background: var(--nw-gradient);
  margin: 16px auto 0;
}

.section-title p {
  color: var(--nw-text) !important;
}

/* ==========================================================================
   SECTION BACKGROUNDS
   ========================================================================== */
.bg-lightgrey { background-color: var(--nw-bg-soft) !important; }
.wide-100, .wide-80, .wide-60, .wide-40 { background-color: #ffffff; }
.bg-lightgrey.wide-100, .bg-lightgrey.wide-80, .bg-lightgrey.wide-60, .bg-lightgrey.wide-40 { background-color: var(--nw-bg-soft) !important; }

/* ==========================================================================
   SERVICE / COURSE CARDS
   ========================================================================== */
.sbox-6,
.sbox-9,
.review-1 {
  background: #ffffff !important;
  border: 1px solid var(--nw-border);
  border-radius: var(--nw-radius) !important;
  box-shadow: var(--nw-shadow) !important;
  transition: transform 0.28s ease, box-shadow 0.28s ease !important;
}

.sbox-6:hover,
.sbox-9:hover,
.review-1:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px rgba(16, 24, 40, 0.12) !important;
}

.sbox-9 {
  overflow: hidden;
}

.sbox-9 img.img-fluid {
  border-radius: var(--nw-radius) var(--nw-radius) 0 0;
}

.sbox-9-pos {
  position: relative;
}

.nw-course-badge {
  position: absolute;
  top: 14px;
  left: 14px;
  background: var(--nw-gradient);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  padding: 6px 14px;
  border-radius: 50px;
  box-shadow: 0 6px 16px rgba(109, 94, 252, 0.35);
  letter-spacing: 0.2px;
}

.sbox-9-txt h5,
.sbox-6 h5 {
  font-weight: 700 !important;
}

.sbox-6 a,
.sbox-9-txt a {
  color: var(--nw-primary) !important;
  font-weight: 600;
  text-decoration: none !important;
}

.sbox-6 a:hover,
.sbox-9-txt a:hover {
  color: var(--nw-primary-dark) !important;
}

/* Review/testimonial cards */
.review-1 {
  border-radius: 18px !important;
  padding: 28px !important;
}

.review-author h5 {
  font-weight: 700 !important;
  color: var(--nw-heading) !important;
}

/* ==========================================================================
   FORMS
   ========================================================================== */
.form-control {
  border: 1.5px solid #dfe3ec !important;
  border-radius: 10px !important;
  font-family: 'Inter', sans-serif !important;
  transition: all 0.2s ease !important;
}

.form-control:focus {
  border-color: var(--nw-primary) !important;
  box-shadow: 0 0 0 3px rgba(109, 94, 252, 0.15) !important;
}

/* ==========================================================================
   BREADCRUMB
   ========================================================================== */
#breadcrumb {
  background: linear-gradient(135deg, var(--nw-dark) 0%, var(--nw-dark-2) 100%) !important;
}

#breadcrumb .breadcrumb-item,
#breadcrumb .breadcrumb-item a {
  font-family: 'Inter', sans-serif !important;
  letter-spacing: 0.3px;
}

#breadcrumb .breadcrumb-item a:hover {
  color: #c7cdf4 !important;
}

#breadcrumb .breadcrumb-item.active {
  color: #a5b4fc !important;
  font-weight: 600;
}

#breadcrumb .breadcrumb-item a { color: rgba(255, 255, 255, 0.9) !important; }
#breadcrumb .breadcrumb-item + .breadcrumb-item::before { color: rgba(255, 255, 255, 0.5) !important; }

/* ==========================================================================
   FOOTER
   ========================================================================== */
#footer-1 {
  background: linear-gradient(150deg, var(--nw-dark) 0%, #2e1065 100%) !important;
}

#footer-1 .footer-info p,
#footer-1 .footer-box p {
  color: rgba(255, 255, 255, 0.72) !important;
}

#footer-1 h5 {
  color: #ffffff !important;
  font-weight: 700;
  letter-spacing: 0.3px;
  position: relative;
  padding-bottom: 12px;
}

#footer-1 h5:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 34px;
  height: 3px;
  border-radius: 3px;
  background: var(--nw-gradient);
}

.foo-links > li > a {
  color: rgba(255, 255, 255, 0.72) !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 14px;
  transition: all 0.2s ease !important;
}

.foo-links > li > a:hover {
  color: #c4b5fd !important;
  padding-left: 6px;
}

.foo-email a { color: #c4b5fd !important; }

.bottom-footer {
  border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.footer-copyright {
  color: rgba(255, 255, 255, 0.7) !important;
}

.footer-copyright span { color: #c4b5fd !important; }

.foo-socials li a {
  border-radius: 50% !important;
  border-color: rgba(255, 255, 255, 0.25) !important;
  color: rgba(255, 255, 255, 0.8) !important;
  transition: all 0.25s ease !important;
}

.foo-socials li a:hover {
  background: var(--nw-gradient) !important;
  border-color: transparent !important;
  color: #fff !important;
  transform: translateY(-3px);
}

/* ==========================================================================
   GREY BORDER DIVIDER
   ========================================================================== */
.grey-border {
  border-color: var(--nw-border) !important;
}

/* ==========================================================================
   WHY CHOOSE NIWCI CARDS (short about section)
   ========================================================================== */
.nw-why-card {
  background: #ffffff;
  border: 1px solid var(--nw-border);
  border-radius: 16px;
  box-shadow: var(--nw-shadow);
  padding: 36px 30px;
  text-align: center;
  height: 100%;
  margin-bottom: 24px;
  transition: transform 0.28s ease, box-shadow 0.28s ease, border-color 0.28s ease;
}

.nw-why-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px rgba(109, 94, 252, 0.14);
  border-color: rgba(109, 94, 252, 0.35);
}

.nw-why-icon {
  width: 76px;
  height: 76px;
  margin: 0 auto 22px;
  border-radius: 20px;
  background: var(--nw-gradient);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 30px;
  box-shadow: 0 10px 24px rgba(109, 94, 252, 0.35);
}

.nw-why-title {
  font-weight: 700;
  font-size: 18px;
  color: var(--nw-heading);
  margin-bottom: 12px;
}

.nw-why-text {
  color: var(--nw-text);
  font-size: 14.5px;
  line-height: 1.7;
  margin: 0;
}

/* ==========================================================================
   ABOUT SECTION (image + text)
   ========================================================================== */
.nw-about-media {
  position: relative;
  margin-bottom: 40px;
}

.nw-about-media img {
  border-radius: 20px;
  box-shadow: var(--nw-shadow);
  width: 100%;
}

.nw-about-badge {
  position: absolute;
  left: -14px;
  bottom: 26px;
  background: #ffffff;
  border: 1px solid var(--nw-border);
  border-radius: 14px;
  box-shadow: 0 14px 30px rgba(16, 24, 40, 0.14);
  padding: 14px 20px;
  display: inline-flex;
  align-items: center;
  gap: 12px;
}

.nw-about-badge i {
  font-size: 26px;
  color: var(--nw-primary);
}

.nw-about-badge .b-txt b {
  display: block;
  font-size: 14px;
  color: var(--nw-heading);
}

.nw-about-badge .b-txt span {
  font-size: 12px;
  color: var(--nw-text-muted, #64748b);
}

.nw-about-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 26px;
}

.nw-stat-chip {
  flex: 1;
  min-width: 130px;
  background: var(--nw-bg-soft);
  border: 1px solid var(--nw-border);
  border-radius: 12px;
  padding: 16px 18px;
  text-align: center;
}

.nw-stat-chip b {
  display: block;
  font-size: 20px;
  font-weight: 800;
  color: var(--nw-primary);
  margin-bottom: 2px;
}

.nw-stat-chip span {
  font-size: 12.5px;
  color: var(--nw-text);
  font-weight: 500;
}

/* ==========================================================================
   SERVICE BOX ICONS (services section)
   ========================================================================== */
.sbox-6 {
  position: relative;
  padding: 32px 26px;
}

.nw-service-icon {
  width: 64px;
  height: 64px;
  border-radius: 16px;
  background: var(--nw-gradient);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  margin-bottom: 20px;
  box-shadow: 0 8px 20px rgba(109, 94, 252, 0.3);
}

.sbox-6 h5 { margin-bottom: 10px; }
.sbox-6 p { margin-bottom: 14px; }

/* ==========================================================================
   KEY BENEFITS / FACILITY SECTION
   ========================================================================== */
.nw-benefit-list {
  padding: 0;
  margin: 0;
  list-style: none;
}

.nw-benefit-list li {
  position: relative;
  padding: 9px 0 9px 38px;
  font-size: 14.5px;
  color: var(--nw-text);
  font-weight: 500;
}

.nw-benefit-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 11px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--nw-gradient);
}

.nw-benefit-list li::after {
  content: "\2713";
  position: absolute;
  left: 0;
  top: 10px;
  width: 24px;
  text-align: center;
  color: #fff;
  font-size: 13px;
  font-weight: 700;
}

.nw-facility-img {
  border-radius: 20px;
  box-shadow: var(--nw-shadow);
  max-width: 100%;
  height: auto;
}

/* ==========================================================================
   BLOG POST CARDS
   ========================================================================== */
.blog-post {
  background: #ffffff !important;
  border: 1px solid var(--nw-border) !important;
  border-radius: 16px !important;
  box-shadow: var(--nw-shadow) !important;
  overflow: hidden;
  margin-bottom: 30px;
  transition: transform 0.28s ease, box-shadow 0.28s ease;
}

.blog-post:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px rgba(16, 24, 40, 0.12) !important;
}

.blog-post-img img {
  border-radius: 0 !important;
}

.blog-post-txt {
  padding: 0 24px 26px;
}

.blog-post-txt h5 a:hover {
  color: var(--nw-primary) !important;
}

.blog-post-txt .post-meta {
  display: inline-block;
  background: var(--nw-bg-soft);
  color: var(--nw-primary) !important;
  font-size: 12px;
  font-weight: 600;
  border-radius: 50px;
  padding: 4px 14px;
  margin-top: 18px;
}

.blog-post-txt .post-data {
  color: var(--nw-text-muted, #64748b);
  font-size: 13px;
  margin-top: 10px;
}

/* ==========================================================================
   VERIFICATION FORM CARD (public check pages)
   ========================================================================== */
.nw-verify-card {
  max-width: 640px;
  margin: 0 auto;
  background: #ffffff;
  border: 1px solid var(--nw-border);
  border-radius: 20px;
  box-shadow: var(--nw-shadow);
  padding: 42px 36px 36px;
  text-align: center;
}

.nw-verify-icon {
  width: 84px;
  height: 84px;
  margin: 0 auto 20px;
  border-radius: 22px;
  background: var(--nw-gradient);
  color: #fff;
  font-size: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 12px 26px rgba(109, 94, 252, 0.35);
}

.nw-verify-card h4 {
  font-weight: 800;
  color: var(--nw-heading);
  margin-bottom: 6px;
  font-size: 20px;
}

.nw-verify-card > p {
  color: #64748b;
  font-size: 14.5px;
  margin-bottom: 26px;
}

.nw-verify-form {
  display: flex;
  gap: 10px;
}

.nw-verify-form input {
  flex: 1;
  height: 52px;
  min-width: 0;
  border: 1.5px solid #dfe3ec;
  border-radius: 12px;
  padding: 0 18px;
  font-size: 14px;
  color: var(--nw-text);
  font-family: 'Inter', sans-serif;
  transition: all 0.2s ease;
}

.nw-verify-form input:focus {
  border-color: var(--nw-primary);
  box-shadow: 0 0 0 3px rgba(109, 94, 252, 0.15);
  outline: none;
}

.nw-verify-btn {
  background: var(--nw-gradient);
  color: #fff;
  border: 0;
  border-radius: 12px;
  height: 52px;
  padding: 0 26px;
  font-weight: 700;
  font-size: 14px;
  cursor: pointer;
  white-space: nowrap;
  font-family: 'Inter', sans-serif;
  box-shadow: 0 8px 20px rgba(109, 94, 252, 0.35);
  transition: all 0.2s ease;
}

.nw-verify-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 26px rgba(109, 94, 252, 0.45);
}

.nw-verify-examples {
  margin-top: 22px;
}

.nw-verify-examples > span {
  font-size: 12.5px;
  color: #64748b;
}

.nw-verify-chip {
  display: inline-block;
  margin: 8px 4px 0;
  padding: 7px 16px;
  cursor: pointer;
  user-select: none;
  background: var(--nw-bg-soft);
  border: 1px solid var(--nw-border);
  border-radius: 50px;
  font-size: 12.5px;
  color: var(--nw-primary);
  font-weight: 600;
  transition: all 0.2s ease;
}

.nw-verify-chip:hover {
  background: #ede9fe;
  border-color: rgba(109, 94, 252, 0.4);
}

.nw-verify-info {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 14px;
  margin-top: 40px;
}

.nw-verify-info-item {
  flex: 1;
  min-width: 150px;
  background: var(--nw-bg-soft);
  border: 1px solid var(--nw-border);
  border-radius: 14px;
  padding: 18px 14px;
  text-align: center;
}

.nw-verify-info-item i {
  font-size: 24px;
  color: var(--nw-primary);
  margin-bottom: 8px;
}

.nw-verify-info-item strong {
  display: block;
  font-size: 14px;
  color: var(--nw-heading);
  margin-bottom: 3px;
}

.nw-verify-info-item span {
  font-size: 12.5px;
  color: #64748b;
}

/* ==========================================================================
   RESPONSIVE TWEAKS
   ========================================================================== */
@media (max-width: 1024px) {
  .wsmobileheader {
    background: #ffffff !important;
    box-shadow: 0 2px 12px rgba(30, 27, 75, 0.08);
  }
  .wsmenu {
    background: #ffffff !important;
  }
  .wsmenu > .wsmenu-list > li > a {
    border-bottom: 1px solid var(--nw-border) !important;
  }
  .wsmenu > .wsmenu-list > li a.header-btn {
    margin: 12px 20px;
  }
}

@media (max-width: 576px) {
  .nw-verify-card { padding: 32px 20px 28px; }
  .nw-verify-form { flex-direction: column; }
  .nw-verify-btn { width: 100%; }
  .nw-verify-info { flex-direction: column; }
}

/* ==========================================================================
   NIWCI MODERN UPGRADE - Crystal / Glass / Animation Layer
   ========================================================================== */

:root {
  --nw-glow: rgba(109, 94, 252, 0.35);
}

/* ---------- Custom scrollbar ---------- */
::-webkit-scrollbar { width: 11px; height: 11px; }
::-webkit-scrollbar-track { background: #eef1f8; }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #6d5efc, #a855f7);
  border-radius: 20px;
  border: 2px solid #eef1f8;
}
::-webkit-scrollbar-thumb:hover { background: linear-gradient(180deg, #5a4af0, #9333ea); }
html { scrollbar-width: thin; scrollbar-color: #6d5efc #eef1f8; }

::selection { background: rgba(109, 94, 252, 0.22); color: #1e1b4b; }

/* ---------- Preloader ---------- */
.nw-preloader {
  position: fixed; inset: 0; z-index: 999999;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(140deg, #0d0a24 0%, #1e1b4b 50%, #341a6b 100%);
  transition: opacity 0.5s ease, visibility 0.5s ease;
}
.nw-preloader.nw-hide { opacity: 0; visibility: hidden; }
.nw-pre-inner { text-align: center; color: #fff; }
.nw-pre-ring {
  width: 72px; height: 72px; margin: 0 auto 20px; border-radius: 50%;
  border: 3px solid rgba(255, 255, 255, 0.14);
  border-top-color: #a78bfa;
  border-right-color: #ec4899;
  animation: nwSpin 0.85s linear infinite;
}
.nw-pre-logo { font-size: 27px; font-weight: 800; letter-spacing: 3px; }
.nw-pre-logo b { color: #a78bfa; font-weight: 800; }
.nw-pre-txt {
  font-size: 11px; letter-spacing: 5px; text-transform: uppercase;
  color: rgba(255, 255, 255, 0.55); margin-top: 10px;
}
@keyframes nwSpin { to { transform: rotate(360deg); } }

/* ---------- Scroll progress bar ---------- */
.nw-progress {
  position: fixed; top: 0; left: 0; height: 4px; width: 0; z-index: 99999;
  background: linear-gradient(90deg, #6d5efc, #a855f7, #ec4899, #f59e0b, #6d5efc);
  background-size: 300% 100%;
  border-radius: 0 6px 6px 0;
  box-shadow: 0 0 12px rgba(109, 94, 252, 0.6);
  animation: nwProgShift 5s linear infinite;
}
@keyframes nwProgShift {
  0% { background-position: 0% 50%; }
  100% { background-position: 300% 50%; }
}

/* ---------- Back to top ---------- */
.nw-top {
  position: fixed; right: 22px; bottom: 26px; z-index: 9998;
  width: 50px; height: 50px; border: 0; border-radius: 50%; cursor: pointer;
  color: #fff; font-size: 17px; line-height: 50px; text-align: center;
  background: var(--nw-gradient);
  box-shadow: 0 10px 24px rgba(109, 94, 252, 0.45);
  opacity: 0; visibility: hidden; transform: translateY(18px);
  transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s ease;
}
.nw-top.nw-show { opacity: 1; visibility: visible; transform: translateY(0); }
.nw-top:hover { transform: translateY(-4px); box-shadow: 0 16px 30px rgba(109, 94, 252, 0.55); }

/* ---------- Glass navbar on scroll ---------- */
.nw-js #header-2 .wsmainfull.menu {
  background-color: rgba(255, 255, 255, 0.78) !important;
  backdrop-filter: saturate(180%) blur(18px);
  -webkit-backdrop-filter: saturate(180%) blur(18px);
  transition: background-color 0.3s ease;
}
.nw-js #header-2.nw-scrolled .wsmainfull.menu {
  background-color: rgba(255, 255, 255, 0.9) !important;
  box-shadow: 0 6px 28px rgba(30, 27, 75, 0.12);
}

/* ---------- Scroll reveal ---------- */
.nw-js .nw-reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}
.nw-js .nw-reveal.nw-in { opacity: 1; transform: none; }

/* ---------- Animated section title underline ---------- */
.section-title.center h2:after {
  width: 78px;
  background-image: linear-gradient(90deg, #6d5efc, #a855f7, #ec4899, #6d5efc);
  background-size: 250% 100%;
  animation: nwFlow 4s linear infinite;
}
@keyframes nwFlow {
  0% { background-position: 0% 50%; }
  100% { background-position: 250% 50%; }
}

/* ---------- Button shine sweep ---------- */
.btn-primary, .btn-orange, .btn.orange-hover,
.wsmenu > .wsmenu-list > li a.header-btn.btn-primary,
.nw-verify-btn {
  position: relative; overflow: hidden;
}
.btn-primary::after, .btn-orange::after, .btn.orange-hover::after,
.wsmenu > .wsmenu-list > li a.header-btn.btn-primary::after,
.nw-verify-btn::after {
  content: ""; position: absolute; top: 0; left: -160%; width: 55%; height: 100%;
  background: linear-gradient(105deg, transparent, rgba(255, 255, 255, 0.5), transparent);
  transform: skewX(-22deg);
  transition: left 0.6s ease;
  pointer-events: none;
}
.btn-primary:hover::after, .btn-orange:hover::after, .btn.orange-hover:hover::after,
.wsmenu > .wsmenu-list > li a.header-btn.btn-primary:hover::after,
.nw-verify-btn:hover::after { left: 160%; }

/* ---------- Fix template dark hover (white text on white card) ---------- */
.sb-box:hover { background-color: #ffffff !important; }
.sb-box:hover .sbox-6 h5,
.sb-box:hover .sbox-6 p,
.sb-box:hover .sbox-6 a { color: #1e293b !important; }

/* ---------- Advanced card hovers ---------- */
.sbox-6, .sbox-9, .nw-why-card, .blog-post { position: relative; }
.sbox-6::before, .sbox-9::before, .nw-why-card::before, .blog-post::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px;
  border-radius: 14px 14px 0 0;
  background: var(--nw-gradient);
  transform: scaleX(0); transform-origin: 0 50%;
  transition: transform 0.35s ease;
  z-index: 2;
}
.sbox-6:hover::before, .sbox-9:hover::before, .nw-why-card:hover::before, .blog-post:hover::before {
  transform: scaleX(1);
}

.sbox-6, .sbox-9 { transition: transform 0.28s ease, box-shadow 0.28s ease; }
.sbox-6:hover, .sbox-9:hover { transform: translateY(-8px); }

.sbox-9 img.img-fluid, .blog-post-img img { transition: transform 0.5s ease; }
.sbox-9:hover img.img-fluid, .blog-post:hover .blog-post-img img { transform: scale(1.07); }

.nw-why-icon, .nw-service-icon, .nw-verify-icon {
  transition: transform 0.35s ease, box-shadow 0.35s ease;
}
.nw-why-card:hover .nw-why-icon,
.sbox-6:hover .nw-service-icon,
.nw-verify-card:hover .nw-verify-icon {
  transform: scale(1.08) rotate(-6deg);
  box-shadow: 0 14px 30px rgba(109, 94, 252, 0.45);
}

.nw-stat-chip { transition: transform 0.25s ease, box-shadow 0.25s ease; }
.nw-stat-chip:hover { transform: translateY(-4px); box-shadow: 0 12px 26px rgba(109, 94, 252, 0.16); }

/* ---------- Crystal verify card (gradient border + sheen) ---------- */
.nw-verify-card {
  border: 1px solid transparent;
  background:
    linear-gradient(#ffffff, #ffffff) padding-box,
    linear-gradient(135deg, #6d5efc, #a855f7, #ec4899, #6d5efc) border-box;
  position: relative;
  overflow: hidden;
}
.nw-verify-card::after {
  content: ""; position: absolute; top: 0; left: -60%; width: 40%; height: 100%;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.55), transparent);
  transform: skewX(-20deg);
  animation: nwSheen 6s ease-in-out infinite;
  pointer-events: none;
}
@keyframes nwSheen {
  0%, 55% { left: -60%; }
  85%, 100% { left: 130%; }
}
.nw-verify-card:hover { box-shadow: 0 24px 60px rgba(109, 94, 252, 0.2); }

/* ---------- Floating gradient orbs (light sections) ---------- */
section.bg-lightgrey { position: relative; overflow: hidden; }
section.bg-lightgrey > .container { position: relative; z-index: 1; }
section.bg-lightgrey::before,
section.bg-lightgrey::after {
  content: ""; position: absolute; border-radius: 50%;
  filter: blur(70px); pointer-events: none; z-index: 0;
}
section.bg-lightgrey::before {
  width: 360px; height: 360px; top: -110px; left: -120px;
  background: rgba(109, 94, 252, 0.18);
  animation: nwFloat 12s ease-in-out infinite;
}
section.bg-lightgrey::after {
  width: 320px; height: 320px; bottom: -120px; right: -110px;
  background: rgba(168, 85, 247, 0.15);
  animation: nwFloat 15s ease-in-out infinite reverse;
}
@keyframes nwFloat {
  0%, 100% { transform: translate(0, 0) scale(1); }
  50% { transform: translate(34px, -28px) scale(1.06); }
}

/* ---------- Counter strip ---------- */
.nw-counters {
  position: relative;
  background: linear-gradient(135deg, #14102e 0%, #1e1b4b 45%, #341a6b 100%);
  padding: 66px 0;
  overflow: hidden;
}
.nw-counters::before, .nw-counters::after {
  content: ""; position: absolute; border-radius: 50%;
  filter: blur(90px); pointer-events: none;
}
.nw-counters::before {
  width: 420px; height: 420px; top: -160px; right: -80px;
  background: rgba(168, 85, 247, 0.35);
  animation: nwFloat 14s ease-in-out infinite;
}
.nw-counters::after {
  width: 380px; height: 380px; bottom: -170px; left: -100px;
  background: rgba(99, 102, 241, 0.3);
  animation: nwFloat 16s ease-in-out infinite reverse;
}
.nw-counters .container { position: relative; z-index: 2; }
.nw-counter { text-align: center; color: #fff; padding: 24px 14px 6px; }
.nw-counter-icon {
  width: 64px; height: 64px; margin: 0 auto 18px; border-radius: 18px;
  display: flex; align-items: center; justify-content: center; font-size: 24px;
  color: #c4b5fd;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.18);
  box-shadow: inset 0 8px 24px rgba(0, 0, 0, 0.25);
  backdrop-filter: blur(6px);
  transition: transform 0.3s ease;
}
.nw-counter:hover .nw-counter-icon { transform: translateY(-5px) scale(1.06); }
.nw-counter-num {
  font-size: 44px; font-weight: 800; line-height: 1.1;
  background: linear-gradient(180deg, #ffffff, #c4b5fd);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.nw-counter-label {
  margin-top: 12px; font-size: 13px; font-weight: 600;
  letter-spacing: 1.6px; text-transform: uppercase;
  color: rgba(255, 255, 255, 0.7);
}

/* ---------- Footer accent line ---------- */
#footer-1 { border-top: 4px solid transparent; border-image: linear-gradient(90deg, #6d5efc, #a855f7, #ec4899) 1; }

/* ---------- Modern responsive tweaks ---------- */
@media (max-width: 768px) {
  .nw-counter-num { font-size: 34px; }
  .nw-counters { padding: 46px 0; }
  .nw-top { right: 16px; bottom: 18px; width: 44px; height: 44px; line-height: 44px; }
}

@media (prefers-reduced-motion: reduce) {
  .nw-js .nw-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
  .nw-pre-ring, .nw-progress, .section-title.center h2:after, .nw-verify-card::after,
  section.bg-lightgrey::before, section.bg-lightgrey::after,
  .nw-counters::before, .nw-counters::after { animation: none !important; }
}

/* ==========================================================================
   NIWCI MODERN UPGRADE - FIXES (services height, carousels, counters, blogs)
   ========================================================================== */

/* ---------- Services cards: template forces 200px height, clip content ---------- */
.services-section .sb-box { display: flex; }
.services-section .sbox-6 { height: auto !important; min-height: 0 !important; width: 100%; }

/* ---------- Counter numbers: robust gradient text ---------- */
.nw-counter-num { -webkit-text-fill-color: transparent; }
.nw-counters { padding: 76px 0; }

/* ---------- Carousel nav arrows (courses + blogs) ---------- */
.services-carousel.owl-carousel,
.blog-carousel.owl-carousel { position: relative; }
.services-carousel.owl-carousel .owl-nav [class*='owl-'],
.blog-carousel.owl-carousel .owl-nav [class*='owl-'] {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 44px; height: 44px; border-radius: 50%;
  background: #ffffff !important;
  border: 1px solid #e5e7ef;
  box-shadow: 0 8px 20px rgba(16, 24, 40, 0.12);
  color: #6d5efc !important;
  font-size: 18px !important; line-height: 1;
  margin: 0;
  display: inline-flex; align-items: center; justify-content: center;
  transition: all 0.25s ease;
  z-index: 3;
}
.services-carousel.owl-carousel .owl-nav .owl-prev { left: -54px; }
.services-carousel.owl-carousel .owl-nav .owl-next { right: -54px; }
.blog-carousel.owl-carousel .owl-nav .owl-prev { left: -54px; }
.blog-carousel.owl-carousel .owl-nav .owl-next { right: -54px; }
.services-carousel.owl-carousel .owl-nav [class*='owl-']:hover,
.blog-carousel.owl-carousel .owl-nav [class*='owl-']:hover {
  background: var(--nw-gradient) !important;
  color: #fff !important;
  border-color: transparent;
  box-shadow: 0 12px 26px rgba(109, 94, 252, 0.4);
  transform: translateY(-50%) scale(1.08);
}

/* ---------- Course carousel slides equal height ---------- */
.services-carousel .sbox-9 { height: 100%; }
.services-carousel .owl-item { padding: 6px 10px; }
.services-carousel .sbox-9-pos img { height: 200px; object-fit: cover; width: 100%; }

/* ---------- Blog carousel ---------- */
.blog-carousel .owl-item { padding: 6px 10px; }
.blog-carousel .blog-post {
  height: 100%;
  display: flex; flex-direction: column;
  margin-bottom: 0;
}
.blog-carousel .blog-post-img { overflow: hidden; }
.blog-carousel .blog-post-img a { display: block; cursor: zoom-in; }
.blog-carousel .blog-post-img img {
  height: 220px; object-fit: cover; width: 100%;
  transition: transform 0.5s ease;
}
.blog-carousel .blog-post:hover .blog-post-img img { transform: scale(1.07); }
.blog-carousel .blog-post-txt { flex: 1; display: flex; flex-direction: column; }
.blog-carousel .blog-post-txt > p:last-child { margin-top: auto; }

@media (max-width: 1200px) {
  .services-carousel.owl-carousel .owl-nav .owl-prev,
  .blog-carousel.owl-carousel .owl-nav .owl-prev { left: -6px; }
  .services-carousel.owl-carousel .owl-nav .owl-next,
  .blog-carousel.owl-carousel .owl-nav .owl-next { right: -6px; }
}

@media (max-width: 576px) {
  .services-carousel.owl-carousel .owl-nav [class*='owl-'],
  .blog-carousel.owl-carousel .owl-nav [class*='owl-'] { width: 38px; height: 38px; font-size: 15px !important; }
  .services-carousel .sbox-9-pos img { height: 170px; }
  .blog-carousel .blog-post-img img { height: 180px; }
}
