.elementor-1907 .elementor-element.elementor-element-91ddfe3{--display:flex;--gap:0px 0px;--background-transition:0.3s;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1907 .elementor-element.elementor-element-ed06a78 .elementor-repeater-item-47d42fe .swiper-slide-bg{background-color:#833CA300;background-image:url(https://vieltech.vn/wp-content/uploads/2026/11/imi-norgren.jpg);background-size:contain;}.elementor-1907 .elementor-element.elementor-element-ed06a78 .elementor-repeater-item-665faba .swiper-slide-bg{background-color:#833CA300;background-image:url(https://vieltech.vn/wp-content/uploads/2026/11/bosch-hydraulic.jpg);background-size:contain;}.elementor-1907 .elementor-element.elementor-element-ed06a78 .elementor-repeater-item-9accff9 .swiper-slide-bg{background-color:#833CA300;background-image:url(https://vieltech.vn/wp-content/uploads/2026/11/hose-supplies.jpg);background-size:contain;}.elementor-1907 .elementor-element.elementor-element-ed06a78 .elementor-repeater-item-4ec2aac .swiper-slide-bg{background-color:#833CA300;background-image:url(https://vieltech.vn/wp-content/uploads/2026/11/maojwei-sinocontec.jpg);background-size:contain;}.elementor-1907 .elementor-element.elementor-element-ed06a78 .elementor-repeater-item-9512993 .swiper-slide-bg{background-color:#833CA300;background-image:url(https://vieltech.vn/wp-content/uploads/2026/11/sentech.jpg);background-size:contain;}.elementor-1907 .elementor-element.elementor-element-ed06a78 .elementor-repeater-item-5bf77ec .swiper-slide-bg{background-color:#833CA300;background-image:url(https://vieltech.vn/wp-content/uploads/2026/11/sick.jpg);background-size:contain;}.elementor-1907 .elementor-element.elementor-element-ed06a78 .swiper-slide{transition-duration:calc(5000ms*1.2);height:430px;}.elementor-1907 .elementor-element.elementor-element-ed06a78 .swiper-slide-contents{max-width:100%;}.elementor-1907 .elementor-element.elementor-element-ed06a78 .swiper-slide-inner{text-align:center;}.elementor-1907 .elementor-element.elementor-element-ed06a78 .elementor-slide-button{border-width:2px;border-radius:25px;}.elementor-1907 .elementor-element.elementor-element-ed06a78 .elementor-swiper-button{font-size:0px;}.elementor-1907 .elementor-element.elementor-element-ecc95e3{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--background-transition:0.3s;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1907 .elementor-element.elementor-element-0408d7f{--display:flex;--background-transition:0.3s;}.elementor-1907 .elementor-element.elementor-element-0408d7f.e-con{--align-self:center;}.elementor-1907 .elementor-element.elementor-element-322e493{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--background-transition:0.3s;}.elementor-1907 .elementor-element.elementor-element-cb70067{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--background-transition:0.3s;}.elementor-1907 .elementor-element.elementor-element-cb70067:not(.elementor-motion-effects-element-type-background), .elementor-1907 .elementor-element.elementor-element-cb70067 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#06152B;}.elementor-1907 .elementor-element.elementor-element-cb70067, .elementor-1907 .elementor-element.elementor-element-cb70067::before{--border-transition:0.3s;}.elementor-1907 .elementor-element.elementor-element-0ebbfca{--display:flex;--background-transition:0.3s;}.elementor-1907 .elementor-element.elementor-element-43da159{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;--background-transition:0.3s;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1907 .elementor-element.elementor-element-43da159:not(.elementor-motion-effects-element-type-background), .elementor-1907 .elementor-element.elementor-element-43da159 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F4F7F9;}.elementor-1907 .elementor-element.elementor-element-43da159, .elementor-1907 .elementor-element.elementor-element-43da159::before{--border-transition:0.3s;}.elementor-1907 .elementor-element.elementor-element-103b1eb{--display:flex;--background-transition:0.3s;}.elementor-1907 .elementor-element.elementor-element-d01ed33{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--background-transition:0.3s;}@media(max-width:1024px){.elementor-1907 .elementor-element.elementor-element-ed06a78 .swiper-slide{height:330px;}}@media(max-width:767px){.elementor-1907 .elementor-element.elementor-element-ed06a78 .swiper-slide{height:150px;}}/* Start custom CSS for html, class: .elementor-element-534e26a */.contain .hero-trust { 
   left: initial;
    transform: none;    padding: 30px 0px;
}.contain .hero-trust strong {
    color: #0a3768;
    font-size: 20px;
}.contain .hero-trust small {
    color: #526b84;
    margin-top: 5px;
    font-size: 15px;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-0408d7f */.hero-trust {position: relative !important;}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-f32d99f */.brand-group strong { 
    font-size: 18px !important;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-b7ecc52 *//* Container chính */
.featured-categories {
  max-width: 1280px;
  margin: 0 auto;
  padding: 60px 20px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  color: #0f172a;
}

/* Header Section */
.section-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 40px;
  gap: 40px;
}

.header-left {
  flex: 1;
}

.sub-title {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #0284c7;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.8px;
  margin-bottom: 12px;
}

.sub-title .line {
  width: 20px;
  height: 2px;
  background-color: #0284c7;
  display: inline-block;
}

.main-title {
  font-size: 42px;
  font-weight: 800;
  line-height: 1.15;
  color: #0b132a;
  margin: 0;
  letter-spacing: -0.5px;
}

.header-right {
  max-width: 380px;
  padding-bottom: 8px;
}

.description {
  font-size: 16px !important;
  color:#5c6675 !important;
  line-height: 1.6;
  margin: 0;
}

/* Grid layout 4 cột */
.categories-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}

/* Thẻ Card */
.category-card {
  background-color: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  overflow: hidden;
  text-decoration: none !important;
  display: flex;
  flex-direction: column;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.category-card:hover {
  transform: translateY(1px);
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.08);
}

.card-image:hover img{
     transform: scale(1.02) !important;
}
/* Phần chứa hình ảnh */
.card-image {
  background-color: #f8fafc;
  height: 200px !important;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0px;
}

.card-image img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain !important;
}

/* Phần nội dung chữ */
.card-body {
  padding: 20px 24px 24px;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}

.brand-name {
  font-size: 12px;
  font-weight: 700;
  color: #0284c7;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  margin-bottom: 8px;
}

.card-title {
  font-size: 18px;
  font-weight: 700;
  color: #0f172a;
  margin: 0 0 24px 0;
  line-height: 1.3;
}

/* Footer link trong card */
.card-footer {
  margin-top: auto;
  padding-top: 16px;
  border-top: 1px solid #f1f5f9;
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #475569;
  font-size: 14px;
  font-weight: 600;
  transition: color 0.2s ease;
}

.category-card:hover .card-footer {
  color: #0284c7;
}

.card-footer .arrow {
  transition: transform 0.2s ease;
}

.category-card:hover .card-footer .arrow {
  transform: translateX(4px);
}
.card-title {
    font-size: 16px !important;
    font-weight: 700;
    color: #1a202c;
    text-transform: capitalize !important; 
}
.brand-name {
    font-size: 9px !important;
    font-weight: 600 !important;
    
}
/* Responsive cho Tablet & Mobile */
@media (max-width: 1024px) {
  .categories-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .main-title {
    font-size: 32px;
  }
}

@media (max-width: 640px) {
  .section-header {
    flex-directio.brand-trackn: column;
    align-items: flex-start;
    gap: 16px;
  }
  .categories-grid {
    grid-template-columns: 1fr;
  }.card-image {height: 250px !important;padding: 0px !important;}
}

@media (max-width: 640px) {
    .featured-categories .section-header {
       display: block !important;
    }
    .featured-categories .main-title {
        font-size: 24px !important;
    }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-1d604bd *//* Container tổng thể màu nền xanh đen đậm */
.solutions-section {
  background-color: #06152b;
  color: #ffffff;
  padding: 80px 20px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  overflow: hidden;
}

.solutions-container {
  max-width: 1280px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 60px;
}

/* Cột bên trái */
.solutions-content {
  flex: 1;
  max-width: 540px;
}

.sub-title {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #1d70b8;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1px;
  margin-bottom: 20px;
}

.sub-title .line {
  width: 20px;
  height: 2px;
  background-color: #1d70b8;
}

.main-title {
  font-size: 44px;
  font-weight: 800;
  line-height: 1.15;
  margin: 0 0 24px 0;
  letter-spacing: -0.5px;
  color: #ffffff;
}

.highlight-blue {
  color: #1d82f5;
}

.description {
  font-size: 16px;
  color: #94a3b8;
  line-height: 1.6;
  margin-bottom: 32px;
}

/* Checklist */
.features-list {
  list-style: none;
  padding: 0;
  margin: 0 0 40px 0;
}

.features-list li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 15px;
  font-weight: 600;
  color: #e2e8f0;
  margin-bottom: 16px;
}

.check-icon {
  color: #1d82f5;
  font-size: 14px;
}

/* Nút CTA dạng viền */
.cta-button {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 14px 24px;
  border: 1px solid #1e293b;
  border-radius: 6px;
  background-color: rgba(255, 255, 255, 0.02);
  color: #ffffff;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none !important;
  transition: all 0.3s ease;
}

.cta-button:hover {
  background-color: #1d82f5;
  border-color: #1d82f5;
}

.cta-button .arrow {
  transition: transform 0.2s ease;
}

.cta-button:hover .arrow {
  transform: translateX(4px);
}

/* Cột bên phải */
.solutions-media {
  flex: 1;
  position: relative;
  display: flex;
  justify-content: flex-end;
}

/* Badge 500+ nằm đè bên trái Gallery */
.stats-badge {
  position: absolute;
  left: -40px;
  top: 50%;
  transform: translateY(-50%);
  background-color: #1677e2;
  padding: 30px 24px;
  border-radius: 4px;
  z-index: 10;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3);
  min-width: 160px;
}

.stat-number {
  font-size: 40px;
  font-weight: 800;
  color: #ffffff;
  line-height: 1;
  margin-bottom: 8px;
}

.stat-label {
  font-size: 13px;
  color: #e0f2fe;
  line-height: 1.3;
}

/* Khung Gallery ảnh bên phải */
.gallery-card {
  background-color: #030b17;
  border: 1px solid #1e293b;
  border-radius: 8px;
  padding: 16px;
  width: 100%;
  max-width: 520px;
  position: relative;
}

.gallery-grid {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  gap: 4px;
  margin-bottom: 20px;
  border-radius: 4px;
  overflow: hidden;
}

.grid-item {
  height: auto;
  overflow: hidden;
}

.grid-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Thông tin chân gallery */
.gallery-info {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  padding: 10px 8px 8px;
}

.slide-counter {
  font-size: 13px;
  color: #64748b;
  font-weight: 600;
}

.gallery-title {
  font-size: 20px;
  font-weight: 700;
  color: #ffffff;
  margin: 0;
  text-align: right;
  line-height: 1.3;
}

/* Responsive */
@media (max-width: 1024px) {
  .solutions-container {
    flex-direction: column;
    gap: 50px;
  }
  .solutions-content {
    max-width: 100%;
  }
  .solutions-media {
    width: 100%;
    justify-content: center;
  }
  .stats-badge {
    left: 0;
  }
}

@media (max-width: 640px) {
  .main-title {
    font-size: 32px;
  }
  .gallery-grid {
    grid-template-columns: repeat(1, 1fr);
  }
  .stats-badge {
    position: relative;
    left: 0;
    top: 0;
    transform: none;
    margin-bottom: 20px;
  }
  .solutions-media {
    flex-direction: column;
  }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-26af13b *//* Container tổng thể */
.sales-consultant-section {
  background-color: #f8fafc;
  padding: 60px 20px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  color: #0f172a;
}

.consultant-container {
  max-width: 1200px;
  margin: 0 auto;
}

/* Header tiêu đề */
.consultant-header {
  text-align: center;
  max-width: 600px;
  margin: 0 auto 40px auto;
}

.sub-title {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #0284c7;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.8px;
  margin-bottom: 10px;
  text-transform: uppercase;
}

.sub-title .line {
  width: 16px;
  height: 2px;
  background-color: #0284c7;
}

.main-title {
  font-size: 36px;
  font-weight: 800;
  color: #0b132a;
  margin: 0 0 12px 0;
  letter-spacing: -0.5px;
}

.consultant-header .description {
  font-size: 15px;
  color: #64748b;
  line-height: 1.5;
  margin: 0;
}

/* Layout danh sách Flexbox (Hàng 1: 4 item, Hàng 2: Item thứ 5 xuống hàng & căn giữa) */
.consultant-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center; /* Căn giữa các item trên hàng cuối */
  gap: 16px;
}

/* Thiết lập chiều rộng card để luôn có đúng 4 card trên 1 hàng ở desktop */
.consultant-card {
  flex: 0 0 calc(25% - 12px); /* Calc 4 cột có tính bớt khoảng cách gap */
  box-sizing: border-box;
  background-color: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 16px 14px;
  display: flex;
  align-items: center;
  gap: 12px;
  position: relative;
  transition: all 0.25s ease;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02);
}

/* Hiệu ứng khi Hover card */
.consultant-card:hover {
  border-color: #0284c7;
  box-shadow: 0 6px 18px rgba(2, 132, 199, 0.1);
  transform: translateY(-2px);
}

/* Avatar chữ viết tắt */
.avatar {
  width: 44px;
  height: 44px;
  background-color: #e0f2fe;
  color: #0284c7;
  font-weight: 700;
  font-size: 15px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

/* Phần nội dung tên & SĐT */
.info {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  padding-right: 18px; /* Chừa không gian cho mũi tên */
}

.name {
  font-size: 13px;
  font-weight: 700;
  color: #0f172a;
  margin: 0 0 4px 0;
  line-height: 1.35;
}

.phone {
  font-size: 12px;
  color: #64748b;
  text-decoration: none !important;
  display: flex;
  align-items: center;
  gap: 5px;
  transition: color 0.2s;
}

.phone:hover {
  color: #0284c7;
}

.phone-icon {
  font-size: 11px;
  color: #0284c7;
}

/* Mũi tên: Mặc định ẨN (opacity: 0). Khi hover vào card mới HIỆN lên */
.card-arrow {
  position: absolute;
  right: 12px;
  bottom: 12px;
  color: #0284c7;
  font-size: 14px;
  opacity: 0;
  transform: translateX(-6px);
  transition: opacity 0.25s ease, transform 0.25s ease;
}

.consultant-card:hover .card-arrow {
  opacity: 1;
  transform: translateX(0);
}

/* ==========================================
   RESPONSIVE MOBILE & TABLET
   ========================================== */

/* Màn hình Tablet (Nhỏ hơn 1024px): Chuyển thành 2 cột */
@media (max-width: 1024px) {
  .consultant-card {
    flex: 0 0 calc(50% - 8px);
  }
}

/* Màn hình Mobile (Nhỏ hơn 640px): Chuyển thành 1 cột tràn màn hình */
@media (max-width: 640px) {
  .sales-consultant-section {
    padding: 40px 16px;
  }
  
  .main-title {
    font-size: 28px;
  }
  
  .consultant-card {
    flex: 0 0 100%;
  }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-8231b79 *//* Container tổng thể */
.partner-brands-section {
  background-color: #ffffff;
  padding: 60px 20px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  border-top: 1px solid #f1f5f9;
  border-bottom: 1px solid #f1f5f9;
}

.brands-container {
  max-width: 1200px;
  margin: 0 auto;
}

/* Lưới hiển thị các logo (Chia đều thành 6 cột trên Desktop) */
.brands-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 30px;
  align-items: center;
  justify-items: center;
}

/* Từng ô chứa logo */
.brand-item {
  width: 100%;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
  transition: transform 0.3s ease, opacity 0.3s ease;
}

.brand-item a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

/* Tinh chỉnh hình ảnh logo bên trong */
.brand-item img {
  max-width: 100%;
  max-height: 85px; /* Giới hạn chiều cao đồng đều cho các logo */
  object-fit: contain;
  opacity: 0.85;
  filter: grayscale(15%); /* Tạo hiệu ứng đồng bộ nhẹ, khi hover sẽ rõ màu */
  transition: all 0.3s ease;
}

/* Hiệu ứng khi rê chuột vào từng logo */
.brand-item:hover img {
  opacity: 1;
  filter: grayscale(0%);
  transform: translateY(-3px);
}

/* ==========================================
   RESPONSIVE MOBILE & TABLET CHUẨN
   ========================================== */

/* Màn hình Tablet (Nhỏ hơn 1024px): Hiển thị 3 cột mỗi hàng */
@media (max-width: 1024px) {
  .brands-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
  }
}

/* Màn hình Mobile (Nhỏ hơn 640px): Hiển thị 2 cột, hoặc cuộn ngang mượt mà */
@media (max-width: 640px) {
  .partner-brands-section {
    padding: 40px 16px;
  }
  
  .brands-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }
  
  .brand-item {
    height: 70px;
    background-color: #f8fafc;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
  }
  
  .brand-item img {
    max-height: 35px;
  }
}/* End custom CSS */