
.vdd-site{--vdd-primary:#ff6412;--vdd-dark:#0b2f53;--vdd-light:#f2f5f8;color:#1e2933;background:#fff;overflow:hidden;font-family:inherit}.vdd-site *{box-sizing:border-box}.vdd-site h1,.vdd-site h2,.vdd-site h3,.vdd-site p,.vdd-site a,.vdd-site li,.vdd-site table{font-family:inherit}.vdd-container{width:min(1280px,calc(100% - 48px));margin:auto}.vdd-eyebrow{display:block;color:var(--vdd-primary);font-weight:800;letter-spacing:.14em;font-size:13px;margin-bottom:18px}.vdd-site h1{font-size:clamp(44px,5.4vw,82px);line-height:.98;letter-spacing:-.04em;margin:0;max-width:950px;color:#fff;font-weight:800}.vdd-site h2{font-size:clamp(30px,3.3vw,52px);line-height:1.07;margin:10px 0 28px;color:var(--vdd-dark);letter-spacing:-.025em}.vdd-site h3{color:var(--vdd-dark)}.vdd-site p{font-size:17px;line-height:1.75}.vdd-home-hero,.vdd-hero{position:relative;min-height:620px;background:linear-gradient(120deg,#061d33,var(--vdd-dark));display:flex;align-items:center}.vdd-home-hero{min-height:720px}.vdd-hero-bg,.vdd-hero-shade{position:absolute;inset:0}.vdd-hero-bg img{width:100%;height:100%;object-fit:cover}.vdd-hero-shade{background:linear-gradient(90deg,rgba(4,24,43,.93),rgba(9,48,83,.74),rgba(9,48,83,.35))}.vdd-hero-inner,.vdd-home-copy{position:relative;z-index:2;padding-top:75px;padding-bottom:60px}.vdd-hero-inner p{color:#dce7ef;max-width:760px;font-size:18px}.vdd-btn{display:inline-flex;align-items:center;justify-content:center;background:var(--vdd-primary);color:#fff!important;text-decoration:none!important;padding:18px 28px;font-weight:800;margin-top:28px;border-radius:0}.vdd-btn.small{padding:13px 18px;font-size:13px}.vdd-hero-phone{position:absolute;right:0;bottom:0;border-left:3px solid var(--vdd-primary);padding-left:20px;color:#fff}.vdd-hero-phone small{display:block;letter-spacing:.13em;opacity:.75}.vdd-hero-phone b{font-size:24px}.vdd-section{padding:92px 0}.vdd-light{background:var(--vdd-light)}.vdd-dark{background:var(--vdd-dark);color:#e8f0f6}.vdd-dark h2,.vdd-dark h3{color:#fff}.vdd-two{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center}.vdd-photo{min-height:420px;background:#e9edf0;display:flex;align-items:center;justify-content:center;overflow:hidden}.vdd-photo img{width:100%;height:100%;min-height:420px;object-fit:cover}.vdd-ph{display:flex;min-height:180px;width:100%;align-items:center;justify-content:center;background:#e7ebee;color:#7c8792}.vdd-product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.vdd-product{background:#fff;box-shadow:0 10px 30px rgba(17,36,53,.07);overflow:hidden}.vdd-product-img{display:block;height:270px;background:#e9edf0;overflow:hidden}.vdd-product-img img{width:100%;height:100%;object-fit:cover;transition:.35s}.vdd-product:hover .vdd-product-img img{transform:scale(1.035)}.vdd-product>div{padding:24px}.vdd-product h2,.vdd-product h3{font-size:22px;margin:0 0 12px}.vdd-product p{font-size:15px;line-height:1.65}.vdd-more{font-weight:800;color:var(--vdd-primary)!important;text-decoration:none!important}.vdd-reasons{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,.13);margin-top:35px}.vdd-reasons>div{padding:38px;background:var(--vdd-dark)}.vdd-reasons>div>b{font-size:36px;color:var(--vdd-primary)}.vdd-reasons p{font-size:15px;color:#ccd8e1}.vdd-stats{background:#fff;padding:44px 0;border-bottom:1px solid #e9edf0}.vdd-stats-grid{display:grid;grid-template-columns:repeat(4,1fr);text-align:center}.vdd-stats-grid b{display:block;font-size:42px;color:var(--vdd-primary)}.vdd-stats-grid span{font-weight:700;color:#536170}.vdd-check{padding:0;list-style:none}.vdd-check li{padding:14px 0;border-bottom:1px solid #dce2e7}.vdd-check li:before{content:'✓';color:var(--vdd-primary);font-weight:900;margin-right:12px}.vdd-post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.vdd-post{border:1px solid #e1e6ea;background:#fff}.vdd-post-img{height:240px;display:block;overflow:hidden}.vdd-post-img img{width:100%;height:100%;object-fit:cover}.vdd-post-body{padding:22px}.vdd-post-body small{color:#7a8793}.vdd-post-body h2{font-size:21px;margin:8px 0 12px}.vdd-post-body h2 a{color:var(--vdd-dark);text-decoration:none}.vdd-post-body p{font-size:15px}.vdd-about-box{border-left:4px solid var(--vdd-primary);padding-left:26px;margin-top:28px}.vdd-about-box h3{margin-top:25px}.vdd-quote-note{background:var(--vdd-light);padding:24px 30px;border-left:4px solid var(--vdd-primary);margin-bottom:28px}.vdd-table-wrap{overflow:auto}.vdd-table{width:100%;border-collapse:collapse;margin:0 0 24px}.vdd-table th,.vdd-table td{padding:18px;border:1px solid #dfe4e8;text-align:left}.vdd-table th{background:var(--vdd-dark);color:#fff}.vdd-contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:54px}.vdd-map{min-height:420px;background:#e7ebee}.vdd-map iframe{width:100%;height:420px;border:0}.vdd-footer{background:#061d33;color:#dce6ee;padding:68px 0}.vdd-footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:60px}.vdd-footer a{display:block;color:#dce6ee!important;text-decoration:none;margin:10px 0}.vdd-footer b{color:#fff}.vdd-footer h3{color:#fff}.vdd-footer-brand{font-size:34px;font-weight:900;color:var(--vdd-primary);letter-spacing:.04em}.vdd-footer img{max-height:70px;width:auto}.vdd-hide-absolute~*{}body:has(.vdd-hide-absolute) .absolute-footer{display:none!important;height:0!important;padding:0!important;margin:0!important;border:0!important}.vdd-overlay-header{margin-top:0}.vdd-site.vdd-overlay-header{position:relative;margin-top:0}.vdd-site.vdd-overlay-header .vdd-home-hero,.vdd-site.vdd-overlay-header>.vdd-hero{margin-top:0}body:has(.vdd-overlay-header) #header{position:absolute!important;top:0;left:0;right:0;z-index:999;background:transparent!important}body.admin-bar:has(.vdd-overlay-header) #header{top:32px}body:has(.vdd-overlay-header) #header .header-wrapper,body:has(.vdd-overlay-header) #header .header-main{background:transparent!important}body:has(.vdd-overlay-header) #header .nav>li>a{color:#fff!important}body:has(.vdd-overlay-header) #header .nav>li.active>a,body:has(.vdd-overlay-header) #header .nav>li>a:hover{color:var(--vdd-primary,#ff6412)!important}body:has(.vdd-site) .page-wrapper,body:has(.vdd-site) .page-inner,body:has(.vdd-site) .entry-content,body:has(.vdd-site) .entry-content.single-page{padding-top:0!important;margin-top:0!important}body:has(.vdd-site) .vdd-site{width:100vw;max-width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}
@media(max-width:900px){.vdd-container{width:min(100% - 30px,1280px)}.vdd-home-hero,.vdd-hero{min-height:570px}.vdd-site h1{font-size:44px}.vdd-two,.vdd-contact-grid{grid-template-columns:1fr;gap:35px}.vdd-product-grid,.vdd-post-grid{grid-template-columns:repeat(2,1fr)}.vdd-reasons{grid-template-columns:repeat(2,1fr)}.vdd-footer-grid{grid-template-columns:1fr 1fr}.vdd-section{padding:65px 0}}
@media(max-width:600px){.vdd-site h1{font-size:37px}.vdd-site h2{font-size:30px}.vdd-home-hero,.vdd-hero{min-height:520px}.vdd-hero-inner,.vdd-home-copy{padding-top:90px}.vdd-hero-phone{right:auto;left:0;bottom:-75px;color:var(--vdd-dark)}.vdd-product-grid,.vdd-post-grid,.vdd-reasons,.vdd-stats-grid,.vdd-footer-grid{grid-template-columns:1fr}.vdd-product-img{height:230px}.vdd-section{padding:55px 0}.vdd-stats-grid>div{padding:12px}.vdd-footer{padding:48px 0}body.admin-bar:has(.vdd-overlay-header) #header{top:46px}}

/* Quote rating */
.vdd-quote-bottom{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-top:8px}.vdd-quote-bottom .vdd-btn{margin-top:28px}.vdd-rating{margin-top:28px;display:flex;align-items:center;justify-content:flex-end;gap:7px;white-space:nowrap;font-size:13px;color:#7b8289}.vdd-stars{color:#ffd400;font-size:18px;letter-spacing:1px;line-height:1;text-shadow:0 0 0 #ffd400}.vdd-rating-text{font-size:13px;color:#7b8289}.vdd-rating:hover .vdd-stars{filter:brightness(.96)}
@media(max-width:600px){.vdd-quote-bottom{align-items:flex-start}.vdd-rating{width:100%;justify-content:flex-start;margin-top:2px}.vdd-quote-bottom .vdd-btn{margin-top:20px}}

/* Animated scaffolding image on homepage hero */
.vdd-scaffold-motion{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden;opacity:var(--vdd-motion-opacity,.65)}
.vdd-scaffold-motion img{position:absolute;right:0;bottom:0;width:var(--vdd-motion-width,46vw);max-width:none;height:auto;object-fit:contain;will-change:transform;animation:vddScaffoldRun var(--vdd-motion-speed,16s) linear infinite;filter:drop-shadow(0 12px 22px rgba(0,0,0,.13))}
@keyframes vddScaffoldRun{0%{transform:translate3d(115%,0,0)}100%{transform:translate3d(calc(-100vw - 115%),0,0)}}
@media(max-width:600px){.vdd-scaffold-motion.vdd-motion-hide-mobile{display:none}.vdd-scaffold-motion img{width:max(68vw,var(--vdd-motion-width,46vw));bottom:4%}}
@media(prefers-reduced-motion:reduce){.vdd-scaffold-motion img{animation:none;transform:translate3d(0,0,0);right:3%}}

/* v3.0.3 - Header transparent at top, background only after scroll */
body:has(.vdd-overlay-header) #header,
body:has(.vdd-overlay-header) #header .header-wrapper,
body:has(.vdd-overlay-header) #header .header-main{
  background:transparent!important;
  box-shadow:none!important;
  border:0!important;
  transition:background-color .28s ease,box-shadow .28s ease,backdrop-filter .28s ease;
}
body:has(.vdd-overlay-header) #header .nav>li>a{color:#fff!important;transition:color .2s ease}
body:has(.vdd-overlay-header) #header .header-bg{background:transparent!important;opacity:0!important}

/* Class is added by plugin JS only after scrolling */
body.vdd-header-scrolled:has(.vdd-overlay-header) #header{
  position:fixed!important;
}
body.vdd-header-scrolled:has(.vdd-overlay-header) #header .header-wrapper,
body.vdd-header-scrolled:has(.vdd-overlay-header) #header .header-main{
  background:rgba(255,255,255,.96)!important;
  box-shadow:0 3px 18px rgba(0,0,0,.10)!important;
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
}
body.vdd-header-scrolled:has(.vdd-overlay-header) #header .header-bg{background:#fff!important;opacity:.96!important}
body.vdd-header-scrolled:has(.vdd-overlay-header) #header .nav>li>a{color:#4d4d4d!important}
body.vdd-header-scrolled:has(.vdd-overlay-header) #header .nav>li.active>a,
body.vdd-header-scrolled:has(.vdd-overlay-header) #header .nav>li>a:hover{color:var(--vdd-primary,#ff6412)!important}

/* Vietnamese-safe font only for large hero heading to avoid broken accent glyphs */
.vdd-home-copy h1,.vdd-hero-inner h1{
  font-family:system-ui,-apple-system,"Segoe UI",Arial,"Helvetica Neue",sans-serif!important;
  font-feature-settings:"kern" 1;
}

/* Keep scaffold visible and moving continuously instead of spending time off-screen */
.vdd-scaffold-motion img{
  right:-4vw!important;
  animation:vddScaffoldFloat var(--vdd-motion-speed,16s) ease-in-out infinite alternate!important;
}
@keyframes vddScaffoldFloat{
  0%{transform:translate3d(0,0,0)}
  100%{transform:translate3d(-14vw,-1.5%,0)}
}
@media(prefers-reduced-motion:reduce){.vdd-scaffold-motion img{animation:none!important;transform:none!important}}

/* v3.1.0 - Real hero slideshow + cleaner transparent header */
.vdd-hero-slider{position:absolute;inset:0;z-index:0;overflow:hidden;background:linear-gradient(120deg,#061d33,var(--vdd-dark))}
.vdd-hero-slide{position:absolute;inset:0;opacity:0;transition:opacity 1.1s ease;transform:scale(1.015)}
.vdd-hero-slide.is-active{opacity:1}
.vdd-hero-slide img{width:100%;height:100%;object-fit:cover;display:block}
.vdd-empty-slide{background:linear-gradient(120deg,#061d33,var(--vdd-dark))}
.vdd-home-hero .vdd-hero-shade{z-index:1;background:linear-gradient(90deg,rgba(4,24,43,.78) 0%,rgba(9,48,83,.50) 48%,rgba(9,48,83,.24) 100%)}
.vdd-home-copy{z-index:2}

/* old moving scaffold layer is disabled: slideshow is the motion */
.vdd-scaffold-motion{display:none!important}

/* At page top the Flatsome header must be truly transparent, no milky strip */
body:has(.vdd-overlay-header):not(.vdd-header-scrolled) #header,
body:has(.vdd-overlay-header):not(.vdd-header-scrolled) #header .header-wrapper,
body:has(.vdd-overlay-header):not(.vdd-header-scrolled) #header .header-main,
body:has(.vdd-overlay-header):not(.vdd-header-scrolled) #header .header-inner,
body:has(.vdd-overlay-header):not(.vdd-header-scrolled) #header .header-bg,
body:has(.vdd-overlay-header):not(.vdd-header-scrolled) #header .header-bg-container,
body:has(.vdd-overlay-header):not(.vdd-header-scrolled) #header .header-main::before,
body:has(.vdd-overlay-header):not(.vdd-header-scrolled) #header .header-main::after{
  background:transparent!important;
  background-color:transparent!important;
  box-shadow:none!important;
  border:0!important;
  opacity:1!important;
}
body:has(.vdd-overlay-header):not(.vdd-header-scrolled) #header .header-bg{opacity:0!important}
body:has(.vdd-overlay-header):not(.vdd-header-scrolled) #header .nav>li>a{color:#fff!important;text-shadow:0 1px 2px rgba(0,0,0,.18)}
body:has(.vdd-overlay-header):not(.vdd-header-scrolled) #header .nav>li.active>a,
body:has(.vdd-overlay-header):not(.vdd-header-scrolled) #header .nav>li>a:hover{color:var(--vdd-primary,#ff6412)!important}

/* Hero begins behind header like the reference site */
body:has(.vdd-site.vdd-overlay-header) .vdd-home-hero{min-height:760px}

/* cleaner headline, similar scale to reference */
.vdd-home-copy h1{font-weight:800!important;letter-spacing:-.035em!important;max-width:930px}
@media(max-width:900px){body:has(.vdd-site.vdd-overlay-header) .vdd-home-hero{min-height:640px}}
@media(max-width:600px){body:has(.vdd-site.vdd-overlay-header) .vdd-home-hero{min-height:560px}.vdd-hero-slide{transform:none}.vdd-home-copy h1{font-size:38px!important;line-height:1.03!important}}


/* v3.1.1 - hard transparent Flatsome header at page top */
body:has(.vdd-overlay-header):not(.vdd-header-scrolled) #header,
body:has(.vdd-overlay-header):not(.vdd-header-scrolled) #header #masthead,
body:has(.vdd-overlay-header):not(.vdd-header-scrolled) #header .header-wrapper,
body:has(.vdd-overlay-header):not(.vdd-header-scrolled) #header .header-main,
body:has(.vdd-overlay-header):not(.vdd-header-scrolled) #header .header-inner,
body:has(.vdd-overlay-header):not(.vdd-header-scrolled) #header .header-bg,
body:has(.vdd-overlay-header):not(.vdd-header-scrolled) #header .header-bg-container {
  background:none!important;
  background-color:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  border-color:transparent!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  filter:none!important;
}


/* v3.1.2 - Flatsome true overlay header: transparent at top, white only after scroll */
body:has(.vdd-site.vdd-overlay-header) #header{
  position:absolute!important;
  top:0!important;
  left:0!important;
  right:0!important;
  width:100%!important;
  z-index:9999!important;
  margin:0!important;
  padding:0!important;
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  border:0!important;
}
body.admin-bar:has(.vdd-site.vdd-overlay-header) #header{top:32px!important}
body:has(.vdd-site.vdd-overlay-header):not(.vdd-header-scrolled) #header .header-wrapper,
body:has(.vdd-site.vdd-overlay-header):not(.vdd-header-scrolled) #header .header-main,
body:has(.vdd-site.vdd-overlay-header):not(.vdd-header-scrolled) #header .header-inner,
body:has(.vdd-site.vdd-overlay-header):not(.vdd-header-scrolled) #header .header-bg,
body:has(.vdd-site.vdd-overlay-header):not(.vdd-header-scrolled) #header .header-bg-container,
body:has(.vdd-site.vdd-overlay-header):not(.vdd-header-scrolled) #header .header-bg-color,
body:has(.vdd-site.vdd-overlay-header):not(.vdd-header-scrolled) #header .header-bg-image,
body:has(.vdd-site.vdd-overlay-header):not(.vdd-header-scrolled) #header .header-top,
body:has(.vdd-site.vdd-overlay-header):not(.vdd-header-scrolled) #header .header-bottom,
body:has(.vdd-site.vdd-overlay-header):not(.vdd-header-scrolled) #header .fill,
body:has(.vdd-site.vdd-overlay-header):not(.vdd-header-scrolled) #header [class*="header-bg"]{
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  border:0!important;
  opacity:1!important;
  filter:none!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}
body:has(.vdd-site.vdd-overlay-header):not(.vdd-header-scrolled) #header .header-bg,
body:has(.vdd-site.vdd-overlay-header):not(.vdd-header-scrolled) #header .header-bg-color,
body:has(.vdd-site.vdd-overlay-header):not(.vdd-header-scrolled) #header .header-bg-image,
body:has(.vdd-site.vdd-overlay-header):not(.vdd-header-scrolled) #header [class*="header-bg"]::before,
body:has(.vdd-site.vdd-overlay-header):not(.vdd-header-scrolled) #header [class*="header-bg"]::after{
  background:none!important;
  opacity:0!important;
  content:none!important;
}
body:has(.vdd-site.vdd-overlay-header):not(.vdd-header-scrolled) #header .header-wrapper,
body:has(.vdd-site.vdd-overlay-header):not(.vdd-header-scrolled) #header .header-main{
  position:relative!important;
}
body:has(.vdd-site.vdd-overlay-header):not(.vdd-header-scrolled) #header .nav>li>a{
  color:#fff!important;
  text-shadow:0 1px 2px rgba(0,0,0,.28)!important;
}
body:has(.vdd-site.vdd-overlay-header):not(.vdd-header-scrolled) #header .nav>li.active>a,
body:has(.vdd-site.vdd-overlay-header):not(.vdd-header-scrolled) #header .nav>li>a:hover{
  color:var(--vdd-primary,#ff6412)!important;
}

/* After scroll: make the whole Flatsome header solid and sticky */
body.vdd-header-scrolled:has(.vdd-site.vdd-overlay-header) #header{
  position:fixed!important;
  background:rgba(255,255,255,.97)!important;
  box-shadow:0 3px 16px rgba(0,0,0,.10)!important;
}
body.vdd-header-scrolled:has(.vdd-site.vdd-overlay-header) #header .header-wrapper,
body.vdd-header-scrolled:has(.vdd-site.vdd-overlay-header) #header .header-main,
body.vdd-header-scrolled:has(.vdd-site.vdd-overlay-header) #header .header-inner,
body.vdd-header-scrolled:has(.vdd-site.vdd-overlay-header) #header .header-bg,
body.vdd-header-scrolled:has(.vdd-site.vdd-overlay-header) #header .header-bg-container,
body.vdd-header-scrolled:has(.vdd-site.vdd-overlay-header) #header .header-bg-color{
  background:rgba(255,255,255,.97)!important;
  opacity:1!important;
}
body.vdd-header-scrolled:has(.vdd-site.vdd-overlay-header) #header .nav>li>a{color:#555!important;text-shadow:none!important}
body.vdd-header-scrolled:has(.vdd-site.vdd-overlay-header) #header .nav>li.active>a,
body.vdd-header-scrolled:has(.vdd-site.vdd-overlay-header) #header .nav>li>a:hover{color:var(--vdd-primary,#ff6412)!important}

/* Ensure hero begins at the very top under the overlay header */
body:has(.vdd-site.vdd-overlay-header) main#main,
body:has(.vdd-site.vdd-overlay-header) #main,
body:has(.vdd-site.vdd-overlay-header) .page-wrapper,
body:has(.vdd-site.vdd-overlay-header) .page-inner,
body:has(.vdd-site.vdd-overlay-header) .entry-content,
body:has(.vdd-site.vdd-overlay-header) .entry-content.single-page{
  margin-top:0!important;
  padding-top:0!important;
}
@media(max-width:782px){body.admin-bar:has(.vdd-site.vdd-overlay-header) #header{top:46px!important}}
