/*
 * VAR Express modern theme — loaded after every other stylesheet.
 * 1) Typography: Poppins for headings, text, navigation and buttons.
 * 2) Shadows: the site's black/grey shadows become the soft red-orange glow of the Live Tracking card.
 *    Selector lists below were generated from the black/grey box-shadows found in
 *    style.css, home.css, the page CSS files and bootstrap.css.
 */
:root {
  /* Poppins everywhere, as natindocargo.id */
  --vx-font-heading: 'Poppins', sans-serif;
  --vx-font-body: 'Poppins', sans-serif;
  --vx-shadow-sm: 0 4px 14px rgba(234, 43, 31, 0.12), 0 1px 3px rgba(234, 43, 31, 0.08);
  --vx-shadow: 0 18px 50px rgba(234, 43, 31, 0.16), 0 2px 6px rgba(234, 43, 31, 0.08);
  --vx-shadow-hover: 0 22px 60px rgba(234, 43, 31, 0.26), 0 4px 10px rgba(234, 43, 31, 0.12);
}

/* ---------- Typography (icon fonts live on <i> and icon classes, which are left alone) ---------- */
body,
p, a, li, td, th, label, small, strong, b, em, blockquote,
input, textarea, select, button,
span:not([class*="bx"]):not([class*="ri-"]):not([class*="icofont"]):not(.fa):not([class*="fa-"]):not(.iconify) {
  font-family: var(--vx-font-body) !important;
}
h1, h2, h3, h4, h5, h6,
.btn, .btn-get-started, .btn-call-us, .btn-pricelist,
.nav-menu a, .mobile-nav a,
h1 *:not(i), h2 *:not(i), h3 *:not(i), h4 *:not(i), h5 *:not(i), h6 *:not(i) {
  font-family: var(--vx-font-heading) !important;
  letter-spacing: 0;
}
h1, h2, h3, h4, h5, h6 { font-weight: 600; }
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* ---------- Shadows ---------- */
#about iframe,
#bg-testi,
#footer.footer-top::before,
#hero .btn-get-started,
#pricelist.btn-get-started,
#selengkapnya.btn-get-started,
.blog .blog-author,
.blog .blog-comments .reply-form,
.blog .entry,
.blog .sidebar,
.carousel-control-prev, .carousel-control-next,
.nav-pills .nav-link:hover,
.shadow,
.shadow-lg,
.shadow-sm,
.toast {
  box-shadow: var(--vx-shadow-sm) !important;
}
#bg-testi .btn-get-started,
#footer,
#footer .footer-newsletter form input[type="submit"],
#header.header-scrolled, #header.header-inner-pages,
#services .container-box,
#services .container-box2,
.contact .icon-box,
.container-carousel,
.container-testi,
.features .icon-box,
.form-cek-resi,
.form-hitung,
.nav-justified > .nav-link, .nav-justified .nav-item,
.nav-pills .nav-link,
.nav-pills .nav-link.active, .nav-pills .show > .nav-link,
.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link,
.portfolio-details .portfolio-info,
.tb-resi,
.team .member,
.timeline-content-bg {
  box-shadow: var(--vx-shadow) !important;
}
#bg-testi .btn-get-started:hover,
#hero .btn-get-started:hover,
#pricelist.btn-get-started:hover,
#selengkapnya.btn-get-started:hover {
  box-shadow: var(--vx-shadow-hover) !important;
}

/* Navbar/footer span the full width: a wide glow bleeds onto the content, keep it subtle */
#header.header-scrolled, #header.header-inner-pages, #footer {
  box-shadow: 0 4px 16px rgba(234, 43, 31, 0.1) !important;
}

/* Mobile menu open: hide the floating WhatsApp widgets so nothing sits on top of the menu */
body.mnav-open .wa-teaser,
body.mnav-open .wa-chat,
body.mnav-open .wa-backdrop,
body.mnav-open .wa-fab,
body.mnav-open .back-to-top {
  display: none !important;
}

/* ---------- One container width for every page (matches the widest section: 1280px) ----------
   Only outer containers; containers nested in a column/row keep their legacy layout. */
@media (min-width: 1200px) {
  .container:not(.container .container):not(.row > .container) {
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: 1280px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
}