/* Be Vietnam Pro self-hosted WOFF2 — see assets/fonts/OFL.txt for license. */
@font-face{font-family:'Be Vietnam Pro';src:url('./assets/fonts/be-vietnam-pro-vietnamese-400-normal.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:'Be Vietnam Pro';src:url('./assets/fonts/be-vietnam-pro-vietnamese-500-normal.woff2') format('woff2');font-style:normal;font-weight:500;font-display:swap}
@font-face{font-family:'Be Vietnam Pro';src:url('./assets/fonts/be-vietnam-pro-vietnamese-600-normal.woff2') format('woff2');font-style:normal;font-weight:600;font-display:swap}
@font-face{font-family:'Be Vietnam Pro';src:url('./assets/fonts/be-vietnam-pro-vietnamese-700-normal.woff2') format('woff2');font-style:normal;font-weight:700;font-display:swap}
@font-face{font-family:'Be Vietnam Pro';src:url('./assets/fonts/be-vietnam-pro-vietnamese-800-normal.woff2') format('woff2');font-style:normal;font-weight:800;font-display:swap}
@font-face{font-family:'Be Vietnam Pro';src:url('./assets/fonts/be-vietnam-pro-vietnamese-900-normal.woff2') format('woff2');font-style:normal;font-weight:900;font-display:swap}
:root{--navy:#062858;--deep:#031d42;--blue:#0962b5;--orange:#ff841c;--pale:#edf5fc;--ink:#0a2e61;--muted:#54677e;--border:#dbe8f2;--max:1200px;--radius:22px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;color:var(--ink);font-family:'Be Vietnam Pro',Arial,sans-serif;background:#f7fbff;font-size:14px;line-height:1.75}a{text-decoration:none;color:inherit}button{font:inherit}img{max-width:100%;height:auto}h1,h2,h3,p{margin-top:0}h1,h2,h3{line-height:1.25}p{margin-bottom:1em}.container{width:min(var(--max),calc(100% - 64px));margin-inline:auto}.center{text-align:center}.skip-link{position:absolute;left:16px;top:-100px;z-index:200;background:#fff;padding:12px}.skip-link:focus{top:16px}section[id],article[id]{scroll-margin-top:90px}
.site-header{position:fixed;top:0;left:0;right:0;z-index:50;color:#fff;background:transparent;transition:background .25s ease,box-shadow .25s ease,backdrop-filter .25s ease}.site-header.is-scrolled{background:rgba(3,29,66,.94);box-shadow:0 10px 26px rgba(0,19,47,.22);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.nav-bar{height:90px;display:flex;align-items:center;justify-content:space-between;gap:28px}.brand{display:flex;align-items:center;gap:12px;flex-shrink:0}.brand-mark{width:40px;height:40px;color:#fff;display:grid;place-items:center}.brand-mark svg{width:39px}.brand-text{font-weight:900;font-size:19px;letter-spacing:-.7px;line-height:1.12;white-space:nowrap}.brand-text small{display:block;font-size:7px;letter-spacing:1.1px;font-weight:500;margin-top:6px}.desktop-nav{display:flex;align-items:center;gap:26px;font-size:13px;font-weight:600;white-space:nowrap}.desktop-nav a{opacity:.82;position:relative;transition:opacity .2s}.desktop-nav a:hover,.desktop-nav a.is-current{opacity:1}.desktop-nav a.is-current:after,.desktop-nav a:hover:after{content:'';position:absolute;height:2px;background:var(--orange);left:0;right:0;bottom:-10px}.header-call{display:flex;align-items:center;gap:10px;background:var(--orange);padding:7px 17px 7px 7px;border-radius:99px;font-weight:800;font-size:12px;white-space:nowrap}.call-circle{background:#fff;color:var(--navy);border-radius:100%;height:29px;width:29px;display:grid;place-items:center;font-size:17px}.menu-toggle,.mobile-nav{display:none}
.hero{background:radial-gradient(circle at 68% 10%,#227ec6 0,transparent 38%),linear-gradient(111deg,#031a3a 3%,#073871 48%,#0d65ad 100%);color:#fff;position:relative;overflow:hidden;min-height:685px}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,25,55,.6),transparent 75%)}.hero-grid{position:absolute;inset:0;background-image:linear-gradient(#ffffff0a 1px,transparent 1px),linear-gradient(90deg,#ffffff0a 1px,transparent 1px);background-size:80px 80px;mask-image:linear-gradient(90deg,transparent,#000)}.hero-layout{position:relative;display:grid;grid-template-columns:53% 47%;align-items:center;min-height:670px;padding-top:85px}.hero-copy{position:relative;z-index:2;padding:55px 0 110px}.eyebrow{font-size:11px;letter-spacing:1.4px;font-weight:800;color:var(--blue);display:flex;align-items:center;gap:10px}.eyebrow>span{width:22px;height:3px;background:var(--orange);display:inline-block}.eyebrow.light{color:#d7e8ff}.hero h1{font-size:clamp(32px,4.15vw,59px);line-height:1.17;letter-spacing:-1.8px;font-weight:900;max-width:720px;margin:20px 0}.hero h1 em{font-style:normal;color:var(--orange);display:block}.hero-sub{font-size:15px;font-weight:800;margin:0 0 24px}.hero-desc{max-width:575px;color:#d4e6fb;font-size:13px;line-height:1.95}.actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}.btn{min-height:46px;border-radius:99px;display:inline-flex;justify-content:center;align-items:center;gap:14px;padding:12px 24px;font-size:11px;font-weight:800;letter-spacing:.1px;transition:transform .2s,box-shadow .2s;text-align:center}.btn:hover{transform:translateY(-2px);box-shadow:0 10px 28px #072b562a}.btn-orange{color:#fff;background:var(--orange)}.btn-blue{color:#fff;background:var(--blue)}.btn-outline{color:#fff;border:1px solid #ffffff90;background:#ffffff0b}.hero-visual{height:100%;position:relative;display:flex;align-items:flex-end}.hero-image{position:absolute;inset:50px -115px 10px -20px;background:url('assets/hero-forklift.webp') center center / cover no-repeat;mask-image:linear-gradient(90deg,transparent 0%,#000 22%,#000 100%);filter:contrast(1.06) saturate(1.06)}.hero-visual-tag{position:absolute;bottom:113px;right:0;font-size:10px;letter-spacing:1px;background:#072a57e3;border:1px solid #ffffff35;border-radius:9px;padding:12px 16px;box-shadow:0 10px 35px #0004}.pulse{display:inline-block;width:8px;height:8px;border-radius:100%;background:#50decd;margin-right:6px;box-shadow:0 0 0 4px #50decd2e}.hero-bottom{height:105px;background:linear-gradient(0deg,#f7fbff,transparent);position:absolute;bottom:0;left:0;right:0;pointer-events:none}
.value-strip{position:relative;z-index:5;display:grid;grid-template-columns:repeat(4,1fr);margin-top:-50px;padding:28px 20px;background:linear-gradient(120deg,#fff,#e9f3fc);box-shadow:0 15px 55px #16497621;border:1px solid #e3eaf5;border-radius:20px}.value{display:flex;align-items:center;gap:14px;padding:0 19px;border-right:1px solid #dce8f4}.value:last-child{border:0}.value-icon{font-size:32px;line-height:1;color:var(--navy);font-weight:800}.value strong,.value small{display:block;line-height:1.55}.value strong{font-size:10px;font-weight:900}.value small{font-size:9px;color:#647993;margin-top:4px}
.section-intro{padding:105px 0 65px;background:radial-gradient(ellipse at top,#e7f2fb,#f7fbff 68%)}.section-intro .eyebrow,.center .eyebrow{justify-content:center}.section-intro h2,.section-head h2,.why-section h2,.process-section h2{font-size:clamp(27px,3vw,39px);letter-spacing:-1px;font-weight:900;margin:10px 0 18px}.section-intro .center>p:last-child,.section-lead{max-width:650px;margin:0 auto;color:var(--muted)}
.products{display:flex;flex-direction:column;gap:55px;padding-bottom:112px}.product-row{min-height:440px;border-radius:24px;overflow:hidden;display:grid;grid-template-columns:50% 50%;background:#fff;box-shadow:0 16px 58px #1a548514;border:1px solid #e4edf6;position:relative}.product-row.reverse .product-copy{order:2}.product-copy{position:relative;z-index:2;padding:37px 37px 38px 48px}.product-num{font-size:37px;line-height:1;font-weight:800;color:var(--orange);margin:0 0 9px}.product-num span{font-size:24px}.product-copy h2{font-size:clamp(21px,2.1vw,30px);font-weight:900;margin-bottom:11px;letter-spacing:-.7px}.product-copy h3{font-size:12px;font-weight:800;margin-bottom:12px}.product-copy>p:not(.product-num){color:var(--muted);font-size:11px;line-height:1.8}.check-list{list-style:none;padding:0;margin:13px 0 22px}.check-list li{font-size:11px;line-height:1.8;padding-left:25px;position:relative}.check-list li:before{content:'✓';position:absolute;left:0;top:3px;display:grid;place-items:center;background:var(--orange);color:#fff;font-size:9px;font-weight:900;width:15px;height:15px;border-radius:50%}.product-copy .btn{font-size:10px}.product-image-area{position:relative;min-height:440px;background:linear-gradient(145deg,#d9ebfa,#f5f9fd);overflow:hidden}.product-image{position:absolute;inset:0;background-repeat:no-repeat;background-size:cover;background-position:center;transition:transform .5s}.product-row:hover .product-image{transform:scale(1.035)}.product-image-area:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#fff 0%,transparent 21%)}.reverse .product-image-area:after{background:linear-gradient(270deg,#fff 0%,transparent 21%)}.image-hangcha{background-image:url('assets/hangcha-forklift.webp')}.image-electric{background-image:url('assets/electric-forklift.webp')}.image-loader{background-image:url('assets/liugong-loader.webp')}.image-electric-loader{background-image:url('assets/electric-loader.webp')}.image-tires{background-image:url('assets/truck-tires.webp')}.product-image-label{position:absolute;right:25px;top:24px;font-weight:900;font-size:17px;color:#0b3d76;z-index:2;line-height:1.1;text-align:right;text-shadow:0 1px 12px #fff}.product-image-label small{display:block;font-size:8px;letter-spacing:1.7px;margin-top:7px}.reverse .product-image-label{right:auto;left:25px;text-align:left}.battery-art{background:radial-gradient(circle at 40% 30%,#5da5df,#0b4382 70%,#082852)}.battery-art:before{content:'';position:absolute;inset:0;background-image:linear-gradient(#ffffff12 1px,transparent 1px),linear-gradient(90deg,#ffffff12 1px,transparent 1px);background-size:35px 35px}.battery-art .product-image-label{color:#fff;text-shadow:none}.battery-illustration{position:absolute;width:235px;height:275px;left:50%;top:55%;transform:translate(-50%,-50%) rotate(-7deg);filter:drop-shadow(15px 30px 20px #031c3980)}.battery-main{width:230px;height:232px;position:absolute;bottom:0;border-radius:14px;background:linear-gradient(130deg,#123e72,#0c213e 80%);border:10px solid #173e66;box-shadow:inset 0 5px 16px #081b32,20px 15px 0 #0c2f56}.battery-handle{height:45px;width:110px;border:14px solid #1a4674;border-bottom:0;border-radius:15px 15px 0 0;position:absolute;left:60px;top:0}.battery-top{height:45px;background:#ff951d;color:#072a52;font-size:13px;font-weight:900;letter-spacing:2px;text-align:center;padding-top:8px}.battery-icon{font-size:105px;text-align:center;color:#8de9f8;line-height:1.2}.battery-bottom{text-align:center;font-size:11px;letter-spacing:2px;color:#c3eaff}.battery-spark{position:absolute;background:#47d8fc;width:9px;height:9px;border-radius:50%;box-shadow:0 0 26px 9px #5dc9ff}.battery-spark-1{right:-85px;top:85px}.battery-spark-2{left:-70px;bottom:46px}
.brands-section{background:#eef5fb;padding:100px 0}.section-head{display:flex;justify-content:space-between;align-items:end;gap:45px;margin-bottom:35px}.section-head h2{max-width:650px;margin-bottom:0}.section-head>p{max-width:355px;color:var(--muted);font-size:12px}.brand-logos{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.brand-logos span{min-height:83px;display:flex;align-items:center;justify-content:center;border:1px solid #d9e6f2;border-radius:12px;background:#fff;color:#0b407a;font-weight:900;font-size:19px;letter-spacing:.3px;box-shadow:0 8px 24px #1a4e7810}.brand-logos span:nth-child(3n){color:#e62b34}.brand-logos span:nth-child(4n){color:#1d5a9a}
.why-section{padding:110px 0;background:#fff}.why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:50px}.why-card{padding:30px 26px;border:1px solid var(--border);border-radius:16px;background:linear-gradient(150deg,#fff,#f1f7fc)}.why-card>span{font-weight:900;font-size:28px;color:var(--orange)}.why-card h3{font-size:13px;line-height:1.5;margin:15px 0 10px}.why-card p{color:var(--muted);font-size:11px;margin:0}
.process-section{padding:108px 0 115px;background:#f0f7fc}.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:55px}.step{position:relative;padding:30px 25px;border-radius:14px;background:#fff;border:1px solid #dce9f4;box-shadow:0 6px 30px #1551870d}.step b{font-size:35px;color:#b7d9f3}.step h3{font-size:13px;margin:15px 0 10px}.step p{color:var(--muted);font-size:11px;margin:0}
.contact-section{padding:92px 0;background:linear-gradient(114deg,#031d40,#06447f 78%,#07305f);color:#fff;position:relative;overflow:hidden}.contact-section:before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(122deg,transparent,transparent 50px,#ffffff06 51px,#ffffff06 52px)}.contact-layout{position:relative;display:grid;grid-template-columns:1.12fr .88fr;gap:75px;align-items:center}.contact-section h2{font-size:clamp(28px,3.5vw,47px);line-height:1.2;font-weight:900;letter-spacing:-1px}.contact-section h2 em{font-style:normal;color:var(--orange)}.contact-section p:not(.eyebrow){font-size:12px;color:#bed1e8;max-width:590px}.contact-panel{border:1px solid #ffffff62;padding:35px;border-radius:18px;background:#ffffff08;backdrop-filter:blur(4px)}.contact-panel>span{font-size:11px;letter-spacing:1px;font-weight:700}.contact-phone{display:flex;align-items:center;font-size:clamp(21px,2.9vw,36px);font-weight:900;margin:10px 0 24px;white-space:nowrap}.contact-phone span{margin-left:auto;color:var(--orange)}.contact-actions{display:flex;flex-wrap:wrap;gap:10px}.contact-actions .btn{padding-inline:19px}.contact-email{margin:17px 0 0!important}.site-footer{padding:32px 0 18px;background:#fff}.footer-main{display:flex;align-items:center;justify-content:space-between;gap:30px}.footer-brand{color:var(--navy)}.footer-brand .brand-mark{color:var(--blue);font-size:45px}.footer-main nav{display:flex;gap:26px;color:#53708d;font-size:11px}.footer-main nav a:hover{color:var(--orange)}.footer-bottom{display:flex;justify-content:space-between;gap:15px;border-top:1px solid #e5ecf4;margin-top:30px;padding-top:16px;color:#6a829b;font-size:9px}.floating-contact{display:none;position:fixed;z-index:40;bottom:24px;right:22px;background:var(--orange);width:54px;height:54px;border-radius:50%;align-items:center;justify-content:center;color:#fff;font-size:26px;box-shadow:0 7px 20px #a7521055}
@media(max-width:1100px){.desktop-nav{gap:13px;font-size:12px}.nav-bar{gap:15px}.brand-text{font-size:16px}.header-call{font-size:10px}.product-copy{padding:32px}.hero-image{inset:70px -25px 30px -15px}}
@media(max-width:860px){.container{width:min(var(--max),calc(100% - 36px))}.site-header{position:fixed}.nav-bar{height:77px}.desktop-nav,.header-call{display:none}.menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:5px;width:41px;height:41px;border:1px solid #ffffff66;border-radius:9px;background:#ffffff12;padding:10px;color:#fff}.menu-toggle span{width:100%;height:2px;background:#fff;border-radius:1px}.mobile-nav:not([hidden]){display:flex;flex-direction:column;background:#052957f5;padding:15px 24px 23px;gap:8px;box-shadow:0 14px 25px #05224d5c}.mobile-nav a{padding:8px 0;font-size:14px}.hero{min-height:auto}.hero-layout{grid-template-columns:1fr;min-height:760px;padding-top:100px;align-items:start}.hero-copy{padding:42px 0 0}.hero h1{font-size:clamp(36px,7vw,54px);max-width:670px}.hero-visual{position:absolute;right:-40px;left:24%;height:360px;top:390px;opacity:.67}.hero-image{inset:0;background-position:center}.hero-visual-tag{display:none}.value-strip{grid-template-columns:repeat(2,1fr);gap:23px;padding:24px}.value{border:0;padding:0}.section-intro{padding-top:85px}.products{gap:30px}.product-row{grid-template-columns:1fr 1fr}.product-copy{padding:27px}.product-copy h2{font-size:21px}.product-image-area{min-height:400px}.product-copy .btn{font-size:9px;padding:11px 16px}.section-head{flex-direction:column;align-items:start;gap:14px}.why-grid,.process-grid{grid-template-columns:repeat(2,1fr)}.contact-layout{grid-template-columns:1fr;gap:24px}.contact-panel{max-width:560px}.floating-contact{display:flex}}
@media(max-width:630px){html{scroll-padding-top:65px}section[id],article[id]{scroll-margin-top:65px}.brand-text{font-size:17px}.hero-layout{min-height:760px}.hero-copy{padding-top:23px}.hero h1{font-size:clamp(31px,9vw,42px);letter-spacing:-1.2px}.hero-sub{font-size:12px}.hero-desc{font-size:11px}.hero-visual{top:440px;height:280px;left:3%;right:-32px}.hero-image{mask-image:linear-gradient(0deg,transparent 0%,#000 25%)}.actions{gap:9px}.actions .btn{font-size:9px;min-height:43px;padding:11px 15px}.eyebrow{font-size:9px;letter-spacing:.8px}.value-strip{margin-top:-22px;grid-template-columns:repeat(2,1fr);border-radius:12px;padding:20px 14px;gap:22px 10px}.value{gap:7px}.value-icon{font-size:21px}.value strong{font-size:8px}.value small{font-size:8px}.section-intro{padding:72px 0 44px}.section-intro h2,.section-head h2,.why-section h2,.process-section h2{font-size:25px}.section-intro .center>p:last-child{font-size:11px}.products{gap:28px;padding-bottom:70px}.product-row{grid-template-columns:1fr;min-height:0;border-radius:15px}.product-row.reverse .product-copy{order:0}.product-copy{padding:26px 23px 29px}.product-copy h2{font-size:24px}.product-copy h3{font-size:12px}.product-copy>p:not(.product-num),.check-list li{font-size:11px}.product-image-area{min-height:270px;order:-1!important}.product-image-area:after,.reverse .product-image-area:after{background:linear-gradient(0deg,#fff 0,transparent 20%)}.product-image-label{font-size:13px}.battery-illustration{transform:translate(-50%,-50%) rotate(-7deg) scale(.8)}.brands-section,.why-section,.process-section{padding:72px 0}.brand-logos{grid-template-columns:repeat(2,1fr)}.brand-logos span{min-height:64px;font-size:16px}.why-grid,.process-grid{grid-template-columns:1fr 1fr;gap:10px;margin-top:25px}.why-card,.step{padding:20px 15px}.why-card h3,.step h3{font-size:11px}.why-card p,.step p{font-size:10px}.contact-section{padding:70px 0}.contact-section h2{font-size:29px}.contact-panel{padding:24px}.contact-phone{font-size:24px}.contact-actions .btn{flex-grow:1}.footer-main{flex-direction:column;align-items:start}.footer-main nav{gap:14px;flex-wrap:wrap}.footer-bottom{flex-direction:column;gap:4px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}

/* Sticky header and consistent font styling */
.site-header .nav-bar{transition:height .25s ease}
.site-header.is-scrolled .nav-bar{height:72px}
@media(max-width:860px){.site-header.is-scrolled .nav-bar{height:68px}}
@media(prefers-reduced-motion:reduce){.site-header,.site-header .nav-bar{transition:none}}

/* Hero image update — full-bleed user-provided industrial equipment photo. */
.hero{background:#06326e url('assets/hero-dai-xe-nang.webp') center center / cover no-repeat}
.hero:before{background:linear-gradient(90deg,rgba(3,22,54,.32) 0%,rgba(3,22,54,.14) 35%,transparent 64%)}
.hero-grid{opacity:.14}
.hero-image,.hero-visual-tag{display:none}
@media(max-width:860px){.hero{background-position:64% center}.hero:before{background:linear-gradient(180deg,rgba(2,22,54,.78) 0%,rgba(2,22,54,.42) 59%,rgba(2,22,54,.05) 100%)}}
@media(max-width:630px){.hero{background-position:67% center}.hero-desc{color:#f0f6ff}}


/* Typography readability pass: site-wide, desktop + tablet + mobile. */
body{font-size:16px;line-height:1.75}
.brand-text small{font-size:9px}
.desktop-nav{font-size:14px;gap:20px}
.header-call{font-size:13px}
.eyebrow{font-size:13px}
.hero-sub{font-size:17px}
.hero-desc{font-size:16px;line-height:1.8}
.btn{font-size:13px;min-height:48px}
.hero-visual-tag{font-size:12px}
.value strong{font-size:13px}
.value small{font-size:12px}
.section-intro .center>p:last-child,.section-lead{font-size:16px;line-height:1.8}
.product-copy h3{font-size:16px;line-height:1.45}
.product-copy>p:not(.product-num){font-size:15px;line-height:1.8}
.check-list li{font-size:14px;line-height:1.75;padding-bottom:3px}
.product-copy .btn{font-size:13px}
.product-image-label small{font-size:10px}
.section-head>p{font-size:15px;line-height:1.75}
.why-card h3,.step h3{font-size:16px}
.why-card p,.step p{font-size:14px;line-height:1.75}
.contact-section p:not(.eyebrow){font-size:15px;line-height:1.75}
.contact-panel>span{font-size:13px}
.footer-main nav{font-size:13px}
.footer-bottom{font-size:12px}
@media(max-width:1100px) and (min-width:861px){
  .desktop-nav{font-size:12.5px;gap:11px}
  .header-call{font-size:12px}
  .brand-text{font-size:16px}
}
@media(max-width:860px){
  .mobile-nav a{font-size:16px}
  .hero-sub{font-size:16px}
  .hero-desc{font-size:15px}
  .value strong{font-size:12px}
  .value small{font-size:11px}
  .product-copy h3{font-size:15px}
  .product-copy>p:not(.product-num){font-size:14px}
  .check-list li{font-size:14px}
  .product-copy .btn{font-size:12px;line-height:1.5}
}
@media(max-width:630px){
  body{font-size:15px}
  .eyebrow{font-size:11px}
  .hero-sub{font-size:15px}
  .hero-desc{font-size:14px;line-height:1.75}
  .actions .btn{font-size:12px;line-height:1.45}
  .value strong{font-size:11px}
  .value small{font-size:10px}
  .section-intro .center>p:last-child{font-size:14px}
  .product-copy h3{font-size:15px}
  .product-copy>p:not(.product-num),.check-list li{font-size:14px}
  .product-copy .btn{font-size:12px}
  .product-image-label small{font-size:9px}
  .section-head>p{font-size:14px}
  .why-card h3,.step h3{font-size:13px}
  .why-card p,.step p{font-size:12px}
  .contact-section p:not(.eyebrow){font-size:14px}
  .contact-panel>span{font-size:12px}
  .contact-actions .btn{font-size:12px}
  .footer-main nav{font-size:13px}
  .footer-bottom{font-size:12px}
}


/* Industrial angular design exploration — inspired by user reference. */
:root{--accent-industrial:#ffb900;--cut:30px;--border-industrial:#d5e2ee}
body{background:#f5f8fb}
.btn,.header-call{
  border-radius:0;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%);
  padding-inline:25px 30px;
  min-height:52px;
  text-transform:uppercase;
  letter-spacing:.25px;
  font-weight:800;
  box-shadow:none;
}
.btn-orange,.header-call{background:var(--accent-industrial);color:#062858}
.btn-blue{background:#06477f;color:#fff}
.btn-outline{background:#082c55c9;border:1px solid #b2d3ed;color:#fff}
.btn:hover,.header-call:hover{transform:translateY(-2px);filter:brightness(1.04)}
.desktop-nav a.is-current:after,.desktop-nav a:hover:after{background:var(--accent-industrial);height:3px}
.hero h1 em{color:var(--accent-industrial)}
.eyebrow>span{background:var(--accent-industrial);width:29px;height:4px}
.hero-copy{max-width:720px}
.value-strip{
  border-radius:0;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 28px),calc(100% - 28px) 100%,0 100%);
  border-top:4px solid var(--accent-industrial);
  background:#fff;
  padding:35px 25px 42px
}
.value-icon{color:#083f78}
.value strong{font-weight:900}
.product-row{
  border-radius:0;
  clip-path:polygon(0 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%);
  border:1px solid var(--border-industrial);
  border-left:5px solid #0c4a82;
  box-shadow:0 18px 45px #0b305a12
}
.product-row:nth-child(even){border-left-color:var(--accent-industrial)}
.product-copy{padding-top:43px;padding-bottom:48px}
.product-num{color:#ff9300}
.product-copy h2,.section-head h2,.section-intro h2,.why-section h2,.process-section h2{
  text-transform:uppercase;
  letter-spacing:-.65px;
  font-weight:900;
}
.product-copy h3{border-left:4px solid var(--accent-industrial);padding-left:12px;margin-top:15px}
.check-list li:before{background:var(--accent-industrial);color:#072b58}
.product-image-label{
  display:inline-block;background:#ffffffde;
  padding:12px 14px;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%);
  text-shadow:none
}
.brand-logos span{
  border-radius:0;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%);
  border-bottom:3px solid var(--accent-industrial)
}
.why-card,.step{
  position:relative;
  border-radius:0;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 23px),calc(100% - 23px) 100%,0 100%);
  border-top:4px solid var(--accent-industrial);
  padding-bottom:42px;
  background:#f3f5f7
}
.why-card:nth-child(even),.step:nth-child(even){background:#e8f2fa}
.why-card>span{color:#e89b00}
.step b{color:#0b5c9c}
.contact-panel{
  border-radius:0;
  border:2px solid #acc6df;
  border-top:5px solid var(--accent-industrial);
  clip-path:polygon(0 0,100% 0,100% calc(100% - 24px),calc(100% - 24px) 100%,0 100%)
}
.contact-section h2 em{color:var(--accent-industrial)}
.mobile-nav:not([hidden]){border-top:3px solid var(--accent-industrial)}
.floating-contact{
  border-radius:0;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 13px),calc(100% - 13px) 100%,0 100%);
  background:var(--accent-industrial);color:#062858
}
@media(max-width:860px){
  :root{--cut:19px}
  .product-copy{padding:30px}
  .value-strip{padding:25px 20px 35px}
  .btn{min-height:46px;padding:11px 23px 14px 19px}
}
@media(max-width:630px){
  :root{--cut:15px}
  .product-row{border-left-width:4px}
  .product-copy{padding:29px 22px 35px}
  .product-copy h3{padding-left:10px}
  .value-strip{padding:22px 15px 31px}
  .why-card,.step{padding:20px 16px 32px}
  .product-image-label{padding:8px 11px}
  .contact-panel{padding:27px 22px 33px}
  .actions .btn{font-size:12px}
}


/* Why choose us: large industrial split layout (reference-inspired). */
.why-section{padding:110px 0;background:#fff}
.why-layout{display:grid;grid-template-columns:minmax(270px,.83fr) minmax(0,1.9fr);gap:54px;align-items:stretch}
.why-feature{
  position:relative;min-height:645px;overflow:hidden;display:flex;align-items:end;
  background:#07254f url('assets/hero-dai-xe-nang.webp') 71% center/cover no-repeat;
  clip-path:polygon(52px 0,100% 0,100% calc(100% - 52px),calc(100% - 52px) 100%,0 100%,0 52px)
}
.why-feature:before{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#020d27ed 3%,#071c4275 72%,#04142b22)}
.why-feature-content{position:relative;z-index:1;padding:35px;color:#fff}
.why-feature .eyebrow{color:#fff;font-size:12px}
.why-feature h3{font-size:clamp(23px,2.2vw,32px);font-weight:900;line-height:1.22;margin:22px 0;letter-spacing:-.5px;border-left:4px solid #ffb900;padding-left:17px}
.why-feature h3 em{font-style:normal;color:#ffb900}
.why-feature p:not(.eyebrow){font-size:15px;line-height:1.75;color:#e2ecf7}
.why-feature .btn{margin-top:17px}
.why-detail{min-width:0;display:flex;flex-direction:column;justify-content:space-between}
.why-heading h2{font-size:clamp(29px,3vw,44px);line-height:1.2;margin:12px 0 26px;font-weight:900}
.why-heading h2 em{font-style:normal;color:#e99f00}
.why-detail .why-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:0}
.why-detail .why-card{
  min-height:232px;padding:34px 29px 42px;border:0;box-shadow:none;
  background:#ffba08;display:flex;flex-direction:column;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 32px),calc(100% - 32px) 100%,0 100%)
}
.why-detail .why-card:nth-child(even){background:#ffba08}
.why-detail .why-card:last-child{background:#06132e;color:#fff}
.why-detail .why-card>span{position:absolute;right:25px;top:20px;font-size:54px;font-weight:900;line-height:1;color:#06132e;opacity:.92}
.why-detail .why-card:last-child>span{color:#ff9d00}
.why-detail .why-card h3{font-size:19px;font-weight:900;line-height:1.32;margin:11px 61px 20px 0;min-height:50px}
.why-detail .why-card p{font-size:15px;line-height:1.7;margin:0;color:#233048;max-width:345px}
.why-detail .why-card:last-child p{color:#e3e8f1}
@media(max-width:1100px){
  .why-layout{grid-template-columns:minmax(250px,.85fr) minmax(0,1.55fr);gap:25px}
  .why-detail .why-grid{gap:15px}
  .why-detail .why-card{padding:27px 21px 35px}
  .why-detail .why-card h3{font-size:16px;margin-right:51px}
  .why-detail .why-card>span{font-size:42px;right:18px}
}
@media(max-width:860px){
  .why-layout{grid-template-columns:1fr;gap:30px}
  .why-feature{min-height:360px;background-position:67% 54%}
  .why-feature-content{max-width:570px}
  .why-detail .why-card{min-height:210px}
}
@media(max-width:630px){
  .why-section{padding:72px 0}
  .why-feature{min-height:390px;clip-path:polygon(24px 0,100% 0,100% calc(100% - 24px),calc(100% - 24px) 100%,0 100%,0 24px)}
  .why-feature-content{padding:27px}
  .why-feature h3{font-size:26px}
  .why-detail .why-grid{grid-template-columns:1fr;gap:15px}
  .why-detail .why-card{min-height:0;padding:26px 24px 32px}
  .why-detail .why-card h3{font-size:18px;margin-right:65px;min-height:0}
  .why-detail .why-card p{font-size:14px}
  .why-heading h2{font-size:29px}
}


/* Fix overlapping numbers and headings in four benefit cards. */
.why-detail .why-card{position:relative}
.why-detail .why-card>span{top:26px;right:26px;line-height:1;pointer-events:none}
.why-detail .why-card h3{
  box-sizing:border-box;
  width:100%;
  padding-right:110px;
  margin:11px 0 20px;
  min-height:65px;
  overflow-wrap:break-word;
}
@media(max-width:1100px){
  .why-detail .why-card>span{top:24px;right:20px}
  .why-detail .why-card h3{padding-right:78px;margin-right:0;min-height:64px}
}
@media(max-width:630px){
  .why-detail .why-card>span{top:23px;right:23px}
  .why-detail .why-card h3{padding-right:86px;margin-right:0;min-height:0}
}