/* --- LIÊN KẾT TRONG VĂN BẢN (TINH TẾ & NAVY) --- */
.vlink-hero-content-left a.vlink-badge-link,
.vlink-hero-content-left a,
#strategy a {
  text-decoration: none;
  /* Màu Navy tiệp với tiêu đề, giảm độ sáng so với màu Blue */
  color: #0b2440; 
  font-weight: 700;
  position: relative;
  padding: 0 2px;
  transition: all 0.25s ease;
  /* Gạch chân mờ, cách chữ một khoảng nhỏ */
  border-bottom: 1px solid rgba(11, 36, 64, 0.2); 
}

/* Hiệu ứng khi Hover: Nền nhạt & Gạch chân đậm */
.vlink-hero-content-left a.vlink-badge-link:hover,
.vlink-hero-content-left a:hover,
#strategy a:hover {
  color: #0b2440; /* Giữ nguyên màu Navy */
  background-color: #e2e8f0; /* Màu xám xanh nhạt tiệp với nền */
  border-bottom-color: #0b2440; /* Gạch chân hiện rõ hơn */
  border-radius: 2px;
}

/* ==========================================================================
   VLINK HERO & ORBIT - CHUẨN CLASS GỐC - FIX MÀU ROYAL BLUE
   ========================================================================== */

.vlink-hero-content-left {
  max-width: 680px;
  padding: 20px 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}

/* Badge: Giữ nguyên class vlink-badge-tech */
.vlink-badge-tech {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px 6px 28px; 
  border-radius: 4px; 
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.05em;
  color: #0b2440;
  background: #f1f5f9 !important;
  border: 1px solid #e2e8f0;
  margin-bottom: 24px;
  position: relative;
}

.vlink-badge-tech::before {
  content: "";
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #10b981; 
  display: inline-block;
}

.vlink-badge-tech::after {
  content: "";
  position: absolute;
  left: 10px;
  top: 50%;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #10b981;
  animation: vlinkLivePulse 2s infinite ease-out;
}

@keyframes vlinkLivePulse {
  0%   { transform: translateY(-50%) scale(1); opacity: 0.8; }
  100% { transform: translateY(-50%) scale(3.5); opacity: 0; }
}

/* Typography */
.vlink-hero-h1 {
  color: #0f172a !important;
  font-size: clamp(2rem, 4vw, 3rem) !important;
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -0.03em;
  margin: 0 0 24px 0;
}

/* Fix Gradient: Royal Blue thay vì Sky/Green */
.vlink-glow {
  display: inline-block; 
  font-weight: 850;
  background: linear-gradient(135deg, #0b2440 30%, #3b82f6 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  filter: drop-shadow(0 0 0 transparent); 
}

.vlink-hero-p {
  color: #475569 !important;
  font-size: 1.125rem;
  line-height: 1.75;
  margin-bottom: 30px;
  font-weight: 400;
}

.vlink-hero-p strong {
  color: #0f172a;
  font-weight: 600;
}

/* Hero List */
.vlink-hero-list {
  list-style: none;
  padding: 0;
  margin: 0 0 35px 0;
}

.vlink-hero-list li {
  position: relative;
  padding: 12px 0 12px 32px;
  font-size: 16px;
  font-weight: 500;
  color: #1e293b;
  border-bottom: 1px solid #f1f5f9; 
}

.vlink-hero-list li::before {
  content: "";
  position: absolute;
  left: 4px;
  top: 18px;
  width: 10px;
  height: 5px;
  border-left: 1.5px solid #3b82f6; /* Fix màu check */
  border-bottom: 1.5px solid #3b82f6;
  transform: rotate(-45deg);
}

/* Buttons */
.vlink-hero-btns {
  display: flex;
  gap: 12px;
  margin-bottom: 30px;
}

.vlink-hero-content-left .v-btn {
  padding: 14px 24px!important; 
  border-radius: 6px;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.2s ease;
}

.vlink-hero-content-left .v-btn-dark {
  background: #0f172a !important; 
  color: #ffffff !important;
  border: 1px solid #0f172a;
}

.vlink-hero-content-left .v-btn-outline{
  background: transparent;
  color: #0f172a !important;
  border: 1px solid #e2e8f0;
}

/* Trust section */
.vlink-hero-trust {
  font-size: 13px;
  color: #94a3b8;
  display: flex;
  align-items: center;
  gap: 8px;
}

.vlink-hero-trust::before {
  content: "";
  width: 40px;
  height: 1px;
  background: #e2e8f0;
  display: inline-block;
}

/* ==========================================================================
   VLINK SEO ORBIT – GIỮ NGUYÊN CLASS GỐC
   ========================================================================== */

.vlink-seo-orbit {
  --orbit-navy: #0b2440;
  --orbit-blue: #3b82f6; /* Fix tông Royal Blue */
  --orbit-border: rgba(11, 36, 64, 0.08);
  --orbit-bg-node: #ffffff;
  
  position: relative;
  width: 100%;
  height: 550px; 
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: -apple-system, system-ui, sans-serif;
  overflow: visible;
}

.vso-visual {
  position: relative;
  width: 100%;
  max-width: 500px;
  aspect-ratio: 1/1;
}

.vso-sphere {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.vso-core {
  position: relative;
  z-index: 10;
  width: 110px;
  height: 110px;
  background: var(--orbit-navy);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #ffffff;
  box-shadow: 0 0 30px rgba(11, 36, 64, 0.15);
}

.vso-core-text {
  font-size: 11px;
  font-weight: 800;
  line-height: 1.3;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.vso-wave {
  position: absolute;
  inset: 0;
  border: 1px solid var(--orbit-blue);
  border-radius: 50%;
  opacity: 0;
  animation: vsoWave 4s infinite linear;
}
.vso-wave:nth-child(2) { animation-delay: 2s; }

@keyframes vsoWave {
  0% { transform: scale(1); opacity: 0.4; }
  100% { transform: scale(2.2); opacity: 0; }
}

.vso-orbit {
  position: absolute;
  border: 1px solid var(--orbit-border);
  border-radius: 50%;
}

.vso-orbit--inner { width: 260px; height: 260px; animation: vsoRotate 35s infinite linear; }
.vso-orbit--outer { width: 440px; height: 440px; animation: vsoRotate 55s infinite linear reverse; }

@keyframes vsoRotate {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

.vso-node {
  position: absolute;
  background: var(--orbit-bg-node);
  border: 1px solid var(--orbit-border);
  padding: 6px 12px;
  border-radius: 4px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.05);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5;
}

.vso-label {
  display: block;
  font-size: 10px;
  font-weight: 700;
  color: var(--orbit-navy);
  text-transform: uppercase;
  white-space: nowrap;
  line-height: 1;
}

/* Định vị chuẩn theo HTML của anh */
.vso-node--top    { top: 0; left: 50%; }
.vso-node--bottom { bottom: 0; left: 50%; }
.vso-node--left   { left: 0; top: 50%; }
.vso-node--right  { right: 0; top: 50%; }

/* Animation khóa chữ */
.vso-orbit--inner .vso-node { animation: vsoFixInner 35s infinite linear; }
.vso-orbit--outer .vso-node { animation: vsoFixOuter 55s infinite linear; }

@keyframes vsoFixInner {
  from { transform: translate(-50%, -50%) rotate(0deg); }
  to { transform: translate(-50%, -50%) rotate(-360deg); }
}
@keyframes vsoFixOuter {
  from { transform: translate(-50%, -50%) rotate(0deg); }
  to { transform: translate(-50%, -50%) rotate(360deg); }
}

/* Chấm xanh bám quỹ đạo - Fix màu Royal Blue Glow */
.vso-node::before {
  content: "";
  position: absolute;
  width: 6px;
  height: 6px;
  background: var(--orbit-blue);
  border-radius: 50%;
  box-shadow: 0 0 8px rgba(59, 130, 246, 0.4);
}

.vso-node--top::before    { bottom: -4px; left: 50%; transform: translateX(-50%); }
.vso-node--bottom::before { top: -4px; left: 50%; transform: translateX(-50%); }
.vso-node--left::before   { right: -4px; top: 50%; transform: translateY(-50%); }
.vso-node--right::before  { left: -4px; top: 50%; transform: translateY(-50%); }


/* ==========================================================================
   VLINK DELIVERABLES - PREMIUM & ANTI-CONFLICT CSS
   ========================================================================== */

/* Container chính - Dùng Class cha để tăng độ ưu tiên */
.vlink-deliverables-split.seo-deliverables-client {
    padding: 100px 0 !important;
    background-color: #ffffff !important;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
}

/* Header & Text */
.vlink-deliverables-split h2 {
    color: #0b2440 !important; /* Navy chuẩn */
    font-size: clamp(28px, 4vw, 42px) !important;
    font-weight: 800 !important;
    text-align: center !important;
    margin-bottom: 24px !important;
    letter-spacing: -0.03em !important;
}

.vlink-deliverables-split p {
    color: #475569 !important;
    line-height: 1.8 !important;
    text-align: center !important;
}

.vlink-deliverables-split p strong {
    color: #0b2440 !important;
    font-weight: 700 !important;
}

/* --- TABLE CUSTOM - CHUẨN QUỐC TẾ --- */
.vlink-deliverables-split .vlink-table-wrap {
    margin: 50px 0 20px 0 !important;
    border-radius: 12px !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 15px 35px rgba(11, 36, 64, 0.04) !important;
    overflow-x: auto !important;
}

.vlink-deliverables-split table.vlink-deliverables-table {
    width: 100% !important;
    border-collapse: collapse !important;
    background: #ffffff !important;
    margin: 0 !important;
}

.vlink-deliverables-split .vlink-deliverables-table thead {
    background: #f8fafc !important; /* Xám cực nhẹ */
}

.vlink-deliverables-split .vlink-deliverables-table th {
    padding: 20px 25px !important;
    text-align: left !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #0b2440 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    border-bottom: 2px solid #e2e8f0 !important;
}

.vlink-deliverables-split .vlink-deliverables-table td {
    padding: 22px 25px !important;
    border-bottom: 1px solid #f1f5f9 !important;
    font-size: 15px !important;
    color: #334155 !important;
    vertical-align: top !important;
}

/* Cột mốc thời gian */
.vlink-deliverables-split .vlink-deliverables-table td:first-child {
    font-weight: 800 !important;
    color: #0b2440 !important;
    width: 140px !important;
}

.vlink-deliverables-split .vlink-deliverables-table tr:hover {
    background: #fcfcfd !important;
}

.vlink-deliverables-split .vlink-note {
    font-size: 13px !important;
    color: #94a3b8 !important;
    font-style: italic !important;
}

/* --- CARDS SECTION --- */
.vlink-deliverables-split .vlink-deliverables-cards {
    margin-top: 60px !important;
}

.vlink-deliverables-split .vlink-card {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    padding: 40px !important;
    border-radius: 16px !important;
    height: 100% !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 6px rgba(0,0,0,0.02) !important;
}

.vlink-deliverables-split .vlink-card:hover {
    border-color: #0b2440 !important;
    transform: translateY(-5px) !important;
    box-shadow: 0 20px 40px rgba(11, 36, 64, 0.08) !important;
}

.vlink-deliverables-split .vlink-card h3 {
    font-size: 20px !important;
    font-weight: 800 !important;
    color: #0b2440 !important;
    margin-bottom: 25px !important;
}

.vlink-deliverables-split .vlink-card ul {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.vlink-deliverables-split .vlink-card li {
    position: relative !important;
    padding-left: 30px !important;
    margin-bottom: 16px !important;
    font-size: 15px !important;
    color: #475569 !important;
}

/* Bullet Point: Dùng nét vẽ đơn giản, sang trọng */
.vlink-deliverables-split .vlink-card li::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 10px !important;
    width: 12px !important;
    height: 2px !important;
    background: #0b2440 !important; /* Dấu gạch ngang tối giản */
    opacity: 0.4 !important;
}

/* --- CTA BUTTON --- */
.vlink-deliverables-split .vlink-deliverables-cta {
    text-align: center !important;
    margin-top: 60px !important;
}

.vlink-deliverables-split a.button.primary {
    background-color: #0b2440 !important;
    color: #ffffff !important;
    padding: 22px 45px !important;
    border-radius: 6px !important; /* Bo góc vuông vức, sang trọng */
    font-size: 15px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    text-decoration: none !important;
    display: inline-block !important;
    transition: all 0.3s ease !important;
}

.vlink-deliverables-split a.button.primary:hover {
    background-color: #1e293b !important;
    box-shadow: 0 10px 30px rgba(11, 36, 64, 0.2) !important;
}

/* Fix mobile cho table */
@media (max-width: 768px) {
    .vlink-deliverables-split table.vlink-deliverables-table {
        min-width: 600px !important;
    }
}


/* ==========================================================================
   VLINK SEO PREMIUM - ANTI-CONFLICT & GRID SYSTEM
   ========================================================================== */

/* 1. KHÓA VÙNG HIỂN THỊ - Ngăn chặn theme can thiệp */
#vlink-seo-wrapper {
  all: initial; /* Reset nhẹ để tránh kế thừa rác */
  display: block;
  width: 100%;
  clear: both;
  box-sizing: border-box;
  background-color: #ffffff;
}

#vlink-seo-wrapper * {
  box-sizing: border-box !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  margin: 0;
  padding: 0;
}

/* 2. LAYOUT CHÍNH */
#vlink-seo-wrapper .vlink-fit-block {
  padding: 100px 20px !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
}

/* 3. HEADER - Căn giữa và khoảng cách chuẩn */
#vlink-seo-wrapper .vlink-fit-head {
  text-align: center !important;
  margin-bottom: 60px !important;
}

#vlink-seo-wrapper .vlink-fit-head h2 {
  color: #0b2440 !important;
  font-size: clamp(28px, 4vw, 38px) !important;
  font-weight: 850 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.04em !important;
  margin-bottom: 20px !important;
  text-transform: none !important;
}

#vlink-seo-wrapper .vlink-fit-head p {
  color: #64748b !important;
  font-size: 1.1rem !important;
  line-height: 1.7 !important;
  max-width: 750px !important;
  margin: 0 auto !important;
}

/* 4. HỆ THỐNG GRID - Khắc phục lỗi nhảy cột */
#vlink-seo-wrapper .vlink-fit-grid {
  display: grid !important;
  /* Cố định 2 cột bằng nhau, không dùng float của theme */
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 30px !important;
  margin-bottom: 50px !important;
}

/* 5. CARD DESIGN - Sang trọng & Lì */
#vlink-seo-wrapper .vlink-fit-card {
  padding: 45px !important;
  border-radius: 16px !important;
  border: 1px solid #e2e8f0 !important;
  display: flex !important;
  flex-direction: column !important;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
}

#vlink-seo-wrapper .vlink-fit-card:hover {
  transform: translateY(-8px) !important;
  box-shadow: 0 25px 50px rgba(11, 36, 64, 0.06) !important;
  border-color: #0b2440 !important;
}

#vlink-seo-wrapper .vlink-fit-card--ok {
  background: #f8fafc !important;
  border-top: 5px solid #0b2440 !important;
}

#vlink-seo-wrapper .vlink-fit-card--no {
  background: #ffffff !important;
  border-top: 5px solid #cbd5e1 !important;
}

/* 6. BADGE & TITLES */
#vlink-seo-wrapper .vlink-fit-badge {
  display: inline-block !important;
  padding: 6px 14px !important;
  border-radius: 4px !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  margin-bottom: 25px !important;
}

#vlink-seo-wrapper .vlink-fit-badge--ok { background: #0b2440 !important; color: #ffffff !important; }
#vlink-seo-wrapper .vlink-fit-badge--no { background: #e2e8f0 !important; color: #64748b !important; }

/* 7. LIST & ICONS - Dùng SVG tinh tế */
#vlink-seo-wrapper .vlink-fit-list {
  list-style: none !important;
}

#vlink-seo-wrapper .vlink-fit-list li {
  position: relative !important;
  padding-left: 30px !important;
  margin-bottom: 18px !important;
  font-size: 15px !important;
  line-height: 1.6 !important;
  color: #334155 !important;
}

#vlink-seo-wrapper .vlink-fit-list li::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 4px !important;
  width: 18px !important;
  height: 18px !important;
}

/* Icon Tick cho Phù hợp */
#vlink-seo-wrapper .vlink-fit-card--ok li::before {
  background: #0b2440 !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E") no-repeat center;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E") no-repeat center;
}

/* Icon X cho Không phù hợp */
#vlink-seo-wrapper .vlink-fit-card--no li::before {
  background: #94a3b8 !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E") no-repeat center;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E") no-repeat center;
}

/* 8. FOOTER CTA */
#vlink-seo-wrapper .vlink-fit-cta {
  text-align: center !important;
  padding: 50px 40px !important;
  background: #f8fafc !important;
  border-radius: 20px !important;
  margin-top: 20px !important;
}

#vlink-seo-wrapper .vlink-fit-cta-text {
  font-size: 15px !important;
  color: #475569 !important;
  font-style: italic !important;
  margin-bottom: 30px !important;
}

#vlink-seo-wrapper a.button.primary {
  background-color: #0b2440 !important;
  color: #ffffff !important;
  padding: 20px 45px !important;
  border-radius: 6px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  text-decoration: none !important;
  display: inline-block !important;
  transition: all 0.3s ease !important;
}

#vlink-seo-wrapper a.button.primary:hover {
  background-color: #1e293b !important;
  box-shadow: 0 10px 25px rgba(11, 36, 64, 0.2) !important;
}

/* 9. RESPONSIVE - Ép 1 cột trên Mobile */
@media (max-width: 900px) {
  #vlink-seo-wrapper .vlink-fit-grid {
    grid-template-columns: 1fr !important;
  }
  #vlink-seo-wrapper .vlink-fit-card {
    padding: 30px 25px !important;
  }
}

/* ==========================================================================
   VLINK FIT BLOCK - NANO-PRECISION CSS (ANTI-CONFLICT)
   ========================================================================== */

/* 1. Reset nội bộ & Chống tràn */
#fit-check.vlink-fit-block {
    display: block !important;
    width: 100% !important;
    max-width: 1200px !important;
    margin: 80px auto !important;
    padding: 0 20px !important;
    box-sizing: border-box !important;
    background-color: transparent !important; /* Để tiệp màu nền section cha */
}

/* 2. Header Section */
#fit-check .vlink-fit-head {
    text-align: center !important;
    margin-bottom: 50px !important;
}

#fit-check .vlink-fit-head h2 {
    color: #0b2440 !important;
    font-size: clamp(26px, 4.5vw, 38px) !important;
    font-weight: 850 !important;
    letter-spacing: -0.04em !important;
    line-height: 1.2 !important;
    margin-bottom: 20px !important;
}

#fit-check .vlink-fit-head p {
    color: #475569 !important;
    font-size: 1.15rem !important;
    line-height: 1.7 !important;
    max-width: 800px !important;
    margin: 0 auto !important;
}

#fit-check .vlink-fit-head strong {
    color: #0b2440 !important;
    font-weight: 700 !important;
}

/* 3. Grid System - Khóa cứng 2 cột bằng Grid thay vì Flex */
#fit-check .vlink-fit-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important; 
    gap: 30px !important;
    align-items: stretch !important;
    margin-bottom: 40px !important;
}

/* 4. Card Design */
#fit-check .vlink-fit-card {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 16px !important;
    padding: 45px !important;
    height: 100% !important;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
    position: relative !important;
    overflow: hidden !important;
}

#fit-check .vlink-fit-card:hover {
    transform: translateY(-8px) !important;
    box-shadow: 0 25px 50px rgba(11, 36, 64, 0.08) !important;
    border-color: #0b2440 !important;
}

#fit-check .vlink-fit-card--ok {
    background-color: #f8fafc !important; /* Nền xanh Navy cực nhạt */
    border-top: 5px solid #0b2440 !important;
}

#fit-check .vlink-fit-card--no {
    border-top: 5px solid #cbd5e1 !important;
}

/* 5. Badge & Titles */
#fit-check .vlink-fit-badge {
    display: inline-block !important;
    padding: 6px 14px !important;
    border-radius: 4px !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    margin-bottom: 30px !important;
}

#fit-check .vlink-fit-badge--ok { background: #0b2440 !important; color: #ffffff !important; }
#fit-check .vlink-fit-badge--no { background: #f1f5f9 !important; color: #64748b !important; }

/* 6. List Items */
#fit-check .vlink-fit-list {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

#fit-check .vlink-fit-list li {
    position: relative !important;
    padding-left: 28px !important;
    margin-bottom: 18px !important;
    font-size: 15.5px !important;
    line-height: 1.6 !important;
    color: #334155 !important;
}

/* Custom Icons using SVG Masks */
#fit-check .vlink-fit-list li::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 5px !important;
    width: 18px !important;
    height: 18px !important;
}

#fit-check .vlink-fit-card--ok .vlink-fit-list li::before {
    background-color: #0b2440 !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M5 13l4 4L19 7'/%3E%3C/svg%3E") no-repeat center;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M5 13l4 4L19 7'/%3E%3C/svg%3E") no-repeat center;
}

#fit-check .vlink-fit-card--no .vlink-fit-list li::before {
    background-color: #94a3b8 !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 18L18 6M6 6l12 12'/%3E%3C/svg%3E") no-repeat center;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='currentColor'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 18L18 6M6 6l12 12'/%3E%3C/svg%3E") no-repeat center;
}

/* 7. Footer CTA Box */
#fit-check .vlink-fit-cta {
    text-align: center !important;
    margin-top: 30px !important;
    padding: 50px 40px !important;
    background: #f8fafc !important;
    border-radius: 20px !important;
}

#fit-check .vlink-fit-cta-text {
    font-size: 15.5px !important;
    color: #475569 !important;
    margin-bottom: 30px !important;
    line-height: 1.6 !important;
}

#fit-check a.button.primary {
    display: inline-block !important;
    background-color: #0b2440 !important;
    color: #ffffff !important;
    padding: 18px 45px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    border-radius: 6px !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    border: none !important;
}

#fit-check a.button.primary:hover {
    background-color: #1e293b !important;
    box-shadow: 0 10px 30px rgba(11, 36, 64, 0.2) !important;
    transform: translateY(-2px) !important;
}

/* 8. Mobile Responsive - Ép 1 cột cho thiết bị nhỏ */
@media (max-width: 850px) {
    #fit-check .vlink-fit-grid {
        grid-template-columns: 1fr !important;
    }
    #fit-check .vlink-fit-card {
        padding: 30px 25px !important;
    }
    #fit-check .vlink-fit-head h2 {
        font-size: 26px !important;
    }
}

/* ==========================================================================
   VLINK GROWTH SYSTEM - CHỈNH SỬA TỔNG THỂ & KẾT NỐI KHỐI
   ========================================================================== */

.vgs-block {
  padding: 100px 0;
  background: #ffffff;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

.vgs-container {
  max-width: 1300px;
  margin: 0 auto;
  padding: 0 20px;
}

/* --- Header & Kicker (Flat Style) --- */
.vgs-header {
  text-align: center;
  max-width: 850px;
  margin: 0 auto 80px;
}

.vgs-kicker {
  display: inline-block;
  font-size: 11px;
  font-weight: 800;
  color: #3b82f6;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  padding: 6px 14px;
  background: rgba(59, 130, 246, 0.05); /* Nền nhẹ flat */
  border-radius: 4px; /* Bo góc nhẹ */
  margin-bottom: 25px;
}

.vgs-title {
  font-size: clamp(32px, 5vw, 46px) !important;
  font-weight: 900 !important;
  color: #0b2440 !important;
  line-height: 1.1;
  letter-spacing: -0.04em;
  margin-bottom: 30px;
}

.vgs-accent {
  display: block;
  background: linear-gradient(135deg, #0b2440 20%, #3b82f6 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.vgs-desc {
  font-size: 19px;
  color: #475569;
  line-height: 1.6;
}

/* --- Comparison Grid: Xử lý gắn kết --- */
.vgs-comparison-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
  margin-bottom: 100px;
  position: relative;
}

.vgs-card {
  padding: 50px;
  border-radius: 12px;
  display: flex;
  flex-direction: column;
}

.vgs-card--legacy {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
}

.vgs-card--vlink {
  background: #0b2440;
  color: #ffffff;
  box-shadow: 0 30px 60px rgba(11, 36, 64, 0.2);
}

.vgs-card-head {
  font-size: 22px;
  font-weight: 800;
  margin-bottom: 35px;
}

.vgs-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.vgs-list li {
  position: relative;
  padding-left: 28px;
  margin-bottom: 20px;
  font-size: 15px;
  line-height: 1.6;
  color: inherit;
  opacity: 0.9;
}

.vgs-list li::before {
  content: "→";
  position: absolute;
  left: 0;
  color: #94a3b8;
}

.vgs-card--vlink .vgs-list li::before {
  content: "✓";
  color: #3b82f6;
  font-weight: 900;
}

/* --- Evidence Section: Đã bổ sung CSS đầy đủ --- */
.vgs-evidence {
  padding: 80px 0;
  border-top: 1px solid #f1f5f9;
  border-bottom: 1px solid #f1f5f9;
}

.vgs-evidence-label {
  text-align: center;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #94a3b8;
  margin-bottom: 50px;
}

.vgs-evidence-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 50px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.vgs-evidence-grid li {
  position: relative;
}

.vgs-ev-icon {
  font-size: 32px;
  font-weight: 900;
  color: #f1f5f9; /* Số mờ làm nền */
  line-height: 1;
  margin-bottom: -15px;
  position: relative;
  z-index: 1;
}

.vgs-evidence-grid li strong {
  display: block;
  font-size: 18px;
  color: #0b2440;
  margin-bottom: 12px;
  position: relative;
  z-index: 2;
}

.vgs-evidence-grid li p {
  font-size: 15px;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

/* --- Action Group --- */
.vgs-action-group {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin-top: 80px;
}

.vgs-btn {
  padding: 18px 36px;
  border-radius: 6px;
  font-size: 16px;
  font-weight: 700;
  text-decoration: none;
  transition: all 0.3s ease;
}

.vgs-btn--primary {
  background: #0b2440;
  color: #ffffff;
}

.vgs-btn--outline {
  border: 1px solid #e2e8f0;
  color: #0b2440;
}

.vgs-btn--primary:hover {
  background: #1e293b;
  transform: translateY(-3px);
  box-shadow: 0 10px 20px rgba(11, 36, 64, 0.1);
}

/* Responsive */
@media (max-width: 991px) {
  .vgs-comparison-grid, .vgs-evidence-grid {
    grid-template-columns: 1fr;
    gap: 30px;
  }
}



/* 1) Anchor scroll target: chống sticky header che form */
#formlienhe{
  scroll-margin-top: 110px; /* chỉnh theo header height thực tế */
}

/* 2) Normalize chiều cao nút trong action group (fix nút bị cao hơn) */
.vgs-action-group{
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}

.vgs-action-group .vgs-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;

  padding: 12px 18px;
  min-height: 46px;
  line-height: 1.1;

  font: inherit;
  text-decoration: none;
  white-space: nowrap;
}

/* button native reset */
.vgs-action-group button.vgs-btn{
  appearance: none;
  -webkit-appearance: none;
}

/* note pill trong button */
.vgs-action-group .vgs-btn-note{
  display: inline-flex;
  align-items: center;
  margin-left: 10px;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .2px;
  background: rgba(1,45,94,.08);
  color: rgba(1,45,94,.85);
}

/* disabled */
.vgs-action-group .vgs-btn--disabled{
  pointer-events: none;
  opacity: .55;
  filter: grayscale(.15);
  cursor: not-allowed;
}

/* (Optional) link trong mô tả cho gọn, không làm “dày” line box */
.vgs-desc-link{
  text-decoration: none;
  border-bottom: 1px dashed rgba(1,45,94,.35);
}
.vgs-desc-link:hover{
  border-bottom-style: solid;
}





/* --- Fix nút bấm & Khối kết quả --- */

.vgs-block {
  padding: 100px 0;
  background: #ffffff;
}

/* 1. NÚT BẤM: Tăng độ nổi bật (Contrast) */
.vgs-action-group {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin-top: 60px;
}

.vgs-btn {
  padding: 18px 32px;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
  transition: all 0.3s ease;
  text-align: center;
}

/* Nút chính: Chữ TRẮNG trên nền NAVY đậm */
.vgs-btn--primary {
  background: #0b2440 !important;
  color: #ffffff !important; 
  border: 1px solid #0b2440;
  box-shadow: 0 4px 14px rgba(11, 36, 64, 0.2);
}

.vgs-btn--primary:hover {
  background: #3b82f6 !important; /* Chuyển sang Blue khi hover để tạo sức sống */
  border-color: #3b82f6;
  transform: translateY(-2px);
}

/* Nút phụ: Chữ NAVY trên nền Trắng/Viền mảnh */
.vgs-btn--outline {
  background: #ffffff !important;
  color: #0b2440 !important;
  border: 1px solid #e2e8f0;
}

.vgs-btn--outline:hover {
  border-color: #0b2440;
  background: #f8fafc !important;
}

/* 2. KHỐI KẾT QUẢ: Chỉnh lại thành dạng Card chuyên nghiệp */
.vgs-evidence {
  margin-top: 80px;
  padding: 60px 40px;
  background: #f8fafc; /* Nền xám cực nhẹ để tách biệt phần trên */
  border-radius: 20px;
}

.vgs-evidence-label {
  text-align: center;
  font-size: 13px;
  font-weight: 800;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin-bottom: 40px;
}

.vgs-evidence-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  list-style: none;
  padding: 0;
}

.vgs-ev-card {
  background: #ffffff;
  padding: 30px;
  border-radius: 12px;
  border: 1px solid #edf2f7;
  transition: all 0.3s ease;
}

.vgs-ev-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 30px rgba(0,0,0,0.05);
}

.vgs-ev-num {
  font-size: 12px;
  font-weight: 800;
  color: #3b82f6;
  background: rgba(59, 130, 246, 0.1);
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  margin-bottom: 20px;
}

.vgs-ev-card strong {
  display: block;
  font-size: 18px;
  color: #0b2440;
  margin-bottom: 12px;
  letter-spacing: -0.02em;
}

.vgs-ev-card p {
  font-size: 14px;
  color: #475569;
  line-height: 1.6;
  margin: 0;
}

/* --- Kicker (Bo góc nhẹ, phẳng - Theo ý anh) --- */
.vgs-kicker {
  display: inline-block;
  font-size: 11px;
  font-weight: 800;
  color: #3b82f6;
  letter-spacing: 0.15em;
  padding: 6px 14px;
  background: rgba(59, 130, 246, 0.05);
  border-radius: 4px;
  text-transform: uppercase;
}

@media (max-width: 900px) {
  .vgs-evidence-grid { grid-template-columns: 1fr; }
  .vgs-action-group { flex-direction: column; }
}


/* ==========================================================================
   VLINK CHOOSE LAYERS - CENTERED HEADING & SOFT ORANGE ACCENT
   ========================================================================== */

:root {
  --vcl-navy: #0b2440;
  --vcl-orange: #ff7a59; /* Màu cam san hô nhẹ */
  --vcl-blue: #3b82f6;
  --vcl-text: #475569;
}

.vcl-block {
  padding: 100px 0;
  background: #ffffff;
}

.vcl-container {
  max-width: 1300px; /* Thu hẹp container để heading canh giữa trông tập trung hơn */
  margin: 0 auto;
  padding: 0 25px;
}

/* --- Canh giữa Header --- */
.vcl-header {
  text-align: center; /* Quan trọng nhất */
  max-width: 850px;
  margin: 0 auto 70px;
}

.vcl-kicker {
  display: inline-block;
  font-size: 11px;
  font-weight: 800;
  color: var(--vcl-blue);
  letter-spacing: 0.2em;
  padding: 6px 16px;
  background: rgba(59, 130, 246, 0.05);
  border-radius: 4px;
  text-transform: uppercase;
  margin-bottom: 25px;
}

.vcl-title {
  font-size: clamp(30px, 4.5vw, 42px);
  font-weight: 900;
  color: var(--vcl-navy);
  line-height: 1.15;
  letter-spacing: -0.04em;
  margin-bottom: 25px;
}

.vcl-accent {
  display: block;
  background: linear-gradient(135deg, var(--vcl-navy) 40%, var(--vcl-blue) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.vcl-highlight-orange {
  color: var(--vcl-orange);
  font-weight: 700;
}

.vcl-desc {
  font-size: 18px;
  color: var(--vcl-text);
  line-height: 1.7;
  max-width: 750px;
  margin: 0 auto; /* Canh giữa đoạn mô tả */
}

/* --- Card Stack --- */
.vcl-stack {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 70px;
}

.vcl-card {
  display: flex;
  align-items: flex-start;
  gap: 30px;
  padding: 40px;
  background: #ffffff;
  border: 1px solid #f1f5f9;
  border-radius: 12px;
  transition: all 0.3s ease;
}

.vcl-card:hover {
  transform: translateY(-5px);
  border-color: #e2e8f0;
  box-shadow: 0 15px 35px rgba(11, 36, 64, 0.06);
}

/* Điểm nhấn màu cam nhẹ cho số */
.vcl-card-num {
  font-size: 20px;
  font-weight: 900;
  color: var(--vcl-orange);
  background: rgba(255, 122, 89, 0.1);
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  flex-shrink: 0;
}

.vcl-card-h {
  font-size: 21px;
  font-weight: 800;
  color: var(--vcl-navy);
  margin-bottom: 12px;
}

.vcl-card-p {
  font-size: 15px;
  color: var(--vcl-text);
  line-height: 1.6;
  margin-bottom: 15px;
}

.vcl-link {
  font-size: 14px;
  font-weight: 700;
  color: var(--vcl-blue);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.vcl-link:hover {
  color: var(--vcl-orange);
}

/* --- Bridge & Buttons --- */
.vcl-bridge {
  text-align: center;
  padding: 60px 40px;
  background: #f8fafc;
  border-radius: 16px;
}

.vcl-bridge-p {
  font-size: 17px;
  color: var(--vcl-navy);
  margin-bottom: 35px;
  line-height: 1.6;
}

.vcl-action-group {
  display: flex;
  justify-content: center;
  gap: 15px;
}

.vcl-btn {
  padding: 16px 30px;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
  transition: 0.3s;
}

.vcl-btn--primary {
  background: var(--vcl-navy) !important;
  color: #ffffff !important;
}

.vcl-btn--primary:hover {
  background: var(--vcl-blue) !important;
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(59, 130, 246, 0.2);
}

.vcl-btn--outline {
  border: 1px solid #e2e8f0;
  background: #ffffff !important;
  color: var(--vcl-navy) !important;
}

.vcl-btn--outline:hover {
  border-color: var(--vcl-orange);
  color: var(--vcl-orange) !important;
}

@media (max-width: 768px) {
  .vcl-card { flex-direction: column; align-items: center; text-align: center; }
  .vcl-action-group { flex-direction: column; }
}


/* ==========================================================================
   VLINK BLUEPRINT - BLUE GRADIENT & STRATEGIC ORANGE
   ========================================================================== */

.vl-blueprint-wrap {
  padding: 100px 0;
  background: #ffffff;
}

.vl-container {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 25px;
}

/* --- Header System --- */
.vl-header-group {
  text-align: center;
  max-width: 850px;
  margin: 0 auto 80px;
}

.vl-kicker-premium {
  display: inline-block;
  font-size: 11px;
  font-weight: 800;
  color: #3b82f6;
  letter-spacing: 0.25em;
  padding: 6px 14px;
  background: rgba(59, 130, 246, 0.05);
  border-radius: 4px;
  text-transform: uppercase;
  margin-bottom: 25px;
}

.vl-title-main {
  font-size: clamp(32px, 5vw, 44px);
  font-weight: 900;
  color: #0b2440;
  line-height: 1.15;
  letter-spacing: -0.04em;
  margin-bottom: 25px;
}

/* Gradient Blue chuyên nghiệp từ Navy sang Blue sáng */
.vl-accent-gradient {
  display: block;
  background: linear-gradient(135deg, #0b2440 20%, #3b82f6 80%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.vl-desc-main {
  font-size: 18px;
  color: #475569;
  line-height: 1.7;
}

/* Cam nhẹ chỉ dành cho highlight cực ngắn */
.vl-text-orange {
  color: #ff7a59;
  font-weight: 600;
}

/* --- Matrix Grid --- */
.vl-matrix-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
}

.vl-governance-tile {
  padding: 50px;
  background: #ffffff;
  border: 1px solid #f1f5f9;
  border-radius: 16px;
  transition: all 0.3s ease;
}

.vl-governance-tile:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 40px rgba(11, 36, 64, 0.06);
}

.vl-tile-tag {
  font-size: 10px;
  font-weight: 800;
  color: #94a3b8;
  letter-spacing: 0.1em;
  margin-bottom: 25px;
  padding-left: 15px;
  position: relative;
}

/* Vạch kẻ cam nhạt cực mảnh làm điểm nhấn */
.vl-tile-tag::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 8px;
  height: 2px;
  background: #ff7a59;
}

.vl-tile-head {
  font-size: 24px;
  font-weight: 800;
  color: #0b2440;
  margin-bottom: 20px;
}

.vl-tile-text {
  font-size: 16px;
  color: #475569;
  line-height: 1.6;
  margin-bottom: 30px;
}

/* Expert List */
.vl-expert-list {
  list-style: none;
  padding: 0;
}

.vl-expert-list li {
  font-size: 14px;
  margin-bottom: 15px;
  padding-left: 20px;
  position: relative;
  color: #64748b;
}

/* Mũi tên CSS Blue tối giản */
.vl-expert-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 7px;
  width: 5px;
  height: 5px;
  border-top: 2px solid #3b82f6;
  border-right: 2px solid #3b82f6;
  transform: rotate(45deg);
}

.vl-expert-list a {
  color: #0b2440;
  font-weight: 700;
  text-decoration: none;
  transition: 0.3s;
}

.vl-expert-list a:hover {
  color: #3b82f6;
}

/* --- Data Hub (Navy Block) --- */
.vl-data-hub {
  grid-column: span 2;
  background: #0b2440;
  color: #ffffff;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.vl-data-hub .vl-tile-head { color: #ffffff; }
.vl-data-hub .vl-tile-text { color: rgba(255,255,255,0.7); }

.vl-spec-badges {
  display: flex;
  gap: 12px;
  margin-bottom: 40px;
}

.vl-spec-badges span {
  font-size: 11px;
  font-weight: 700;
  padding: 6px 16px;
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 20px;
}

/* --- CTA Group & Blue Action --- */
.vl-cta-group {
  display: flex;
  gap: 15px;
}

.vl-btn {
  padding: 16px 32px;
  border-radius: 6px!important;
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
  transition: 0.3s;
}

.vl-blueprint-wrap .btn-blue-action {
  padding: 24px 40px!important;
  background: #3b82f6 !important;
  color: #ffffff !important;
}

.vl-blueprint-wrap .btn-blue-action:hover {
  background: #2563eb !important;
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(59, 130, 246, 0.3);
}

.vl-blueprint-wrap .btn-premium-outline {
  padding: 24px 40px!important;
  border: 1px solid rgba(255,255,255,0.2)!important;
  color: #ffffff !important;
}

.vl-blueprint-wrap .btn-premium-outline:hover {
  background: #ffffff !important;
  color: #0b2440 !important;
}

.vl-disclaimer {
  font-size: 12px;
  color: rgba(255,255,255,0.3);
  margin-top: 25px;
}

/* Responsive */
@media (max-width: 850px) {
  .vl-matrix-grid { grid-template-columns: 1fr; }
  .vl-data-hub { grid-column: span 1; }
  .vl-cta-group { flex-direction: column; width: 100%; }
}




/* ==========================================================================
   VL AI VISION SHOWCASE - MASONRY EDITION 2026
   ========================================================================== */

:root {
  --ai-primary: #3b82f6;
  --ai-navy: #0b2440;
  --ai-orange: #0b2440;
  --ai-bg: #ffffff;
  --ai-glass: rgba(255, 255, 255, 0.8);
  --ai-border: rgba(226, 232, 240, 0.8);
}

.vlk-ai-window-wrap {
  padding: 120px 0;
  background-color: var(--ai-bg);
  background-image: radial-gradient(circle at 10% 20%, rgba(59, 130, 246, 0.03) 0%, transparent 40%),
                    radial-gradient(circle at 90% 80%, rgba(255, 122, 89, 0.03) 0%, transparent 40%);
  font-family: 'Inter', system-ui, sans-serif;
}

/* AI Status Header */
.vlk-ai-header { max-width: 1300px; margin: 0 auto 80px; text-align: left; }

.vlk-ai-status {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: linear-gradient(90deg, #f0f7ff, #fff);
  padding: 8px 16px;
  border-radius: 100px;
  border: 1px solid #e2e8f0;
  margin-bottom: 30px;
}

.vlk-ai-icon {
  color: var(--ai-primary);
  font-size: 18px;
  animation: rotateAi 4s linear infinite;
}

@keyframes rotateAi {
  0% { transform: rotate(0deg) scale(1); }
  50% { transform: rotate(180deg) scale(1.2); }
  100% { transform: rotate(360deg) scale(1); }
}

.vlk-ai-pulse-text {
  font-size: 12px;
  font-weight: 700;
  color: var(--ai-primary);
  letter-spacing: 1px;
}

.vlk-ai-main-title {
  font-size: clamp(2.5rem, 6vw, 3.5rem);
  font-weight: 900;
  color: var(--ai-navy);
  line-height: 1.1;
  margin-bottom: 25px;
  letter-spacing: -0.05em;
}

.vlk-text-gradient {
  background: linear-gradient(135deg, #3b82f6, #8b5cf6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.vlk-ai-summary {
  font-size: 1.2rem;
  color: #475569;
  line-height: 1.8;
  border-left: 4px solid #e2e8f0;
  padding-left: 25px;
}

/* Masonry System */
.vlk-ai-masonry {
  column-count: 3;
  column-gap: 32px;
}

.vlk-ai-card {
  break-inside: avoid;
  margin-bottom: 32px;
  perspective: 1000px;
}

.vlk-card-glass {
  background: var(--ai-glass);
  backdrop-filter: blur(10px);
  border: 1px solid var(--ai-border);
  border-radius: 24px; /* Bo góc cực lớn kiểu hiện đại */
  overflow: hidden;
  transition: all 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.02), 0 2px 4px -2px rgba(0,0,0,0.02);
}

.vlk-ai-card:hover .vlk-card-glass {
  transform: translateY(-15px) scale(1.02);
  box-shadow: 0 40px 80px rgba(11, 36, 64, 0.1);
  border-color: var(--ai-primary);
}

.vlk-img-container {
  position: relative;
  overflow: hidden;
  background: #f8fafc;
}

.vlk-img-container img {
  width: 100%;
  height: auto;
  display: block;
  transition: transform 1s ease;
}

.vlk-ai-card:hover img { transform: scale(1.1); }

/* Scan Bar màu Cam Google AI */
.vlk-scan-bar {
  position: absolute;
  width: 100%;
  height: 3px;
  background: linear-gradient(90deg, transparent, var(--ai-orange), transparent);
  z-index: 10;
  top: -10px;
  opacity: 0;
  transition: 0.3s;
}

.vlk-ai-card:hover .vlk-scan-bar {
  animation: aiScan 2.5s infinite;
  opacity: 1;
}

@keyframes aiScan {
  0% { top: 0%; }
  100% { top: 100%; }
}

.vlk-content { padding: 30px; }

.vlk-label {
  font-size: 10px;
  font-weight: 800;
  color: var(--ai-primary);
  text-transform: uppercase;
  letter-spacing: 2px;
  margin-bottom: 15px;
  display: block;
}

.vlk-content h3 {
  font-size: 20px;
  font-weight: 800;
  color: var(--ai-navy);
  margin-bottom: 12px;
}

.vlk-content p {
  font-size: 15px;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

/* Thẻ Featured */
.featured-ai .vlk-card-glass {
  border-left: 6px solid var(--ai-orange);
}

@media (max-width: 1100px) { .vlk-ai-masonry { column-count: 2; } }
@media (max-width: 700px) { 
  .vlk-ai-masonry { column-count: 1; }
  .vlk-ai-header { text-align: center; }
  .vlk-ai-summary { border-left: none; padding-left: 0; border-top: 4px solid #e2e8f0; padding-top: 20px; }
}





/* ==========================================================================
   VL INVESTMENT - BLUE GRADIENT & PURE CSS DECOR
   ========================================================================== */
<style>
/* --- INVESTMENT SECTION MODERNIZATION --- */
.vl-investment-section {
  padding: 100px 0;
  background: #ffffff;
  position: relative;
  /* Thêm gradient nền cực nhẹ để đồng bộ phần trên */
  background-image: radial-gradient(circle at 50% 50%, rgba(59, 130, 246, 0.02) 0%, transparent 50%);
}

.vl-container { max-width: 1300px; margin: 0 auto; padding: 0 25px; }

.vl-head-center { text-align: center; max-width: 800px; margin: 0 auto 70px; }

.vl-title-main {
  font-size: clamp(32px, 5vw, 44px);
  font-weight: 900;
  color: #0b2440;
  line-height: 1.15;
  letter-spacing: -0.05em;
  margin-bottom: 25px;
}

.vl-accent-gradient {
  display: block;
  background: linear-gradient(135deg, #0b2440 20%, #3b82f6 80%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* --- GRID & CARD UPGRADE --- */
.vl-benefits-grid-modern {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}

.vl-benefit-card {
  background: #ffffff;
  border-radius: 24px; /* Bo góc lớn kiểu AI Window */
  border: 1px solid rgba(226, 232, 240, 0.8);
  overflow: hidden;
  transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03);
}

.vl-benefit-card:hover {
  transform: translateY(-12px);
  box-shadow: 0 40px 70px rgba(11, 36, 64, 0.1);
  border-color: #3b82f6;
}

/* --- XỬ LÝ HÌNH ẢNH KHÔNG BỊ CẮT --- */
.vl-card-visual {
  position: relative;
  background: #f8fafc; /* Màu nền nhẹ để tôn ảnh trích dẫn */
  aspect-ratio: 16/10;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px; /* Tạo khoảng trống để ảnh biểu đồ không chạm viền */
}

.vl-card-visual img.vlk-contain {
  width: 100%;
  height: 100%;
  object-fit: contain; /* QUAN TRỌNG: Giữ trọn vẹn 100% hình ảnh không mất góc */
  transition: transform 0.8s ease;
  filter: drop-shadow(0 10px 20px rgba(0,0,0,0.05)); /* Tạo độ nổi cho ảnh trích dẫn */
}

.vl-benefit-card:hover .vl-card-visual img {
  transform: scale(1.05);
}

/* AI Pulse */
.vl-ai-pulse {
  position: absolute;
  top: 25px;
  right: 25px;
  width: 10px;
  height: 10px;
  background: #ff7a59;
  border-radius: 50%;
  z-index: 10;
}

/* Card Body */
.vl-card-body { padding: 35px; }

.vl-card-meta { display: flex; justify-content: space-between; align-items: center; margin-bottom: 25px; }

.vl-num-index {
  font-size: 13px;
  font-weight: 800;
  color: #0b2440;
  background: #f1f5f9;
  width: 35px;
  height: 35px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}

.vl-status-tag {
  font-size: 10px;
  font-weight: 800;
  color: #3b82f6;
  background: rgba(59, 130, 246, 0.08);
  padding: 6px 12px;
  border-radius: 100px;
}

.vl-card-h { font-size: 22px; font-weight: 900; color: #0b2440; margin-bottom: 15px; letter-spacing: -0.02em; }

.vl-card-p { font-size: 15px; color: #64748b; line-height: 1.7; margin: 0; }

.vl-highlight-orange { color: #ff7a59; font-weight: 700; }
.vl-highlight-blue { color: #3b82f6; font-weight: 700; }

/* Responsive */
@media (max-width: 1024px) { .vl-benefits-grid-modern { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 650px) { 
  .vl-benefits-grid-modern { grid-template-columns: 1fr; }
  .vl-card-body { padding: 25px; }
}
</style>

/* ==========================================================================
   VL PRICING - NAVY & STRATEGIC BLUE (NO ICONS)
   ========================================================================== */

.vl-pricing-wrap {
  padding: 100px 0;
  background: #f8fafc; /* Nền hơi xám nhạt để card trắng nổi lên */
}

.vl-container {
  max-width: 1300px;
  margin: 0 auto;
  padding: 0 25px;
}

/* --- Header System --- */
.vl-pricing-header {
  text-align: center;
  max-width: 800px;
  margin: 0 auto 70px;
}

.vl-title-main {
  font-size: clamp(32px, 5vw, 44px);
  font-weight: 900;
  color: #0b2440;
  line-height: 1.15;
  margin-bottom: 25px;
  letter-spacing: -0.04em;
}

.vl-accent-gradient {
  display: block;
  background: linear-gradient(135deg, #0b2440 20%, #3b82f6 80%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.vl-desc-main {
  font-size: 18px;
  color: #475569;
  line-height: 1.7;
}

/* --- Pricing Grid --- */
.vl-pricing-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 25px;
  align-items: flex-start;
}

.vl-price-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 20px;
  padding: 40px;
  display: flex;
  flex-direction: column;
  transition: all 0.4s ease;
  position: relative;
}

/* Gói Featured (Navy Theme) */
.vl-price-card.vl-featured {
  background: #0b2440;
  color: #ffffff;
  border: none;
  transform: scale(1.05);
  box-shadow: 0 30px 60px rgba(11, 36, 64, 0.15);
  z-index: 2;
}

.vl-badge-featured {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #ff7a59;
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  padding: 6px 15px;
  border-radius: 4px;
  letter-spacing: 0.1em;
}

/* Card Head */
.vl-plan-name {
  font-size: 14px;
  font-weight: 800;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin-bottom: 15px;
}
.vl-featured .vl-plan-name { color: #3b82f6; }

.vl-plan-price {
  font-size: 36px;
  font-weight: 900;
  color: #0b2440;
  margin-bottom: 5px;
}
.vl-featured .vl-plan-price { color: #ffffff; }

.vl-unit { font-size: 16px; font-weight: 500; color: #94a3b8; }

.vl-plan-meta {
  font-size: 13px;
  color: #94a3b8;
  margin-bottom: 35px;
}

/* Card Body Content */
.vl-info-group { margin-bottom: 30px; }

.vl-group-label {
  font-size: 12px;
  font-weight: 800;
  color: #0b2440;
  margin-bottom: 15px;
  text-transform: uppercase;
}
.vl-featured .vl-group-label { color: rgba(255,255,255,0.5); }

.vl-check-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.vl-check-list li {
  font-size: 14px;
  line-height: 1.5;
  margin-bottom: 12px;
  padding-left: 20px;
  position: relative;
  color: #475569;
}
.vl-featured .vl-check-list li { color: rgba(255,255,255,0.8); }

/* Dấu check CSS thuần */
.vl-check-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 6px;
  width: 8px;
  height: 4px;
  border-left: 2px solid #3b82f6;
  border-bottom: 2px solid #3b82f6;
  transform: rotate(-45deg);
}

.vl-text-orange { color: #ff7a59 !important; font-weight: 700; }

/* KPI Box */
.vl-kpi-box {
  background: #f1f5f9;
  padding: 20px;
  border-radius: 12px;
  text-align: center;
  margin-top: auto;
}
.vl-featured .vl-kpi-box { background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1); }

.vl-kpi-box span { display: block; font-size: 11px; font-weight: 700; color: #64748b; text-transform: uppercase; margin-bottom: 5px; }
.vl-kpi-box strong { font-size: 20px; color: #0b2440; font-weight: 900; }
.vl-featured .vl-kpi-box strong { color: #ffffff; }

/* Buttons */
.vl-card-foot { margin-top: 35px; }

.vl-btn-outline {
  display: block;
  text-align: center;
  padding: 15px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  color: #0b2440;
  font-weight: 700;
  text-decoration: none;
  transition: 0.3s;
}
.vl-btn-outline:hover { border-color: #3b82f6; color: #3b82f6; }

.vl-btn-blue {
  display: block;
  text-align: center;
  padding: 15px;
  background: #3b82f6;
  color: #fff;
  border-radius: 8px;
  font-weight: 700;
  text-decoration: none;
  transition: 0.3s;
}
.vl-btn-blue:hover { background: #2563eb; transform: translateY(-2px); }

.vl-pricing-footer {
  text-align: center;
  margin-top: 50px;
  font-size: 13px;
  color: #94a3b8;
  font-style: italic;
}

/* Responsive */
@media (max-width: 992px) {
  .vl-pricing-grid { grid-template-columns: 1fr; max-width: 500px; margin: 0 auto; }
  .vl-price-card.vl-featured { transform: scale(1); }
}
.vl-budget-explanation {
  max-width: 650px;
  margin: 25px auto 0;
  text-align: center; /* Đưa về giữa cho dễ đọc */
}

.vl-budget-note {
  background: #f1f5f9;
  padding: 15px 20px;
  border-radius: 10px;
  display: inline-block; /* Ô nhỏ gọn */
}

.vl-budget-note p {
  font-size: 15px;
  color: #475569;
  margin: 0;
  line-height: 1.5;
}

.vl-budget-note strong {
  color: #0b2440;
}



/* ==========================================================================
   VL FINAL CTA - STRATEGIC PARTNERSHIP (NAVY & BLUE)
   ========================================================================== */

.vl-cta-wrap {
  padding: 120px 0;
  background: #ffffff;
  position: relative;
  border-top: 1px solid #f1f5f9;
}

.vl-container {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 25px;
}

/* --- Header Section --- */
.vl-cta-header {
  text-align: center;
  max-width: 850px;
  margin: 0 auto 50px;
}

.vl-kicker-premium {
  display: inline-block;
  font-size: 11px;
  font-weight: 800;
  color: #3b82f6;
  letter-spacing: 0.25em;
  padding: 6px 14px;
  background: rgba(59, 130, 246, 0.05);
  border-radius: 4px;
  text-transform: uppercase;
  margin-bottom: 25px;
}

.vl-title-main {
  font-size: clamp(32px, 5vw, 44px);
  font-weight: 900;
  color: #0b2440;
  line-height: 1.2;
  margin-bottom: 25px;
  letter-spacing: -0.04em;
}

.vl-accent-gradient {
  display: block;
  background: linear-gradient(135deg, #0b2440 20%, #3b82f6 80%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.vl-desc-main {
  font-size: 18px;
  color: #475569;
  line-height: 1.7;
}

/* --- Action Buttons --- */
.vl-cta-actions {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin-bottom: 80px;
}

.vl-btn-blue-action {
  padding: 20px 40px;
  background: #3b82f6;
  color: #ffffff;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 700;
  text-decoration: none;
  transition: all 0.3s ease;
  box-shadow: 0 10px 20px rgba(59, 130, 246, 0.2);
}

.vl-btn-blue-action:hover {
  background: #2563eb;
  transform: translateY(-3px);
  box-shadow: 0 15px 30px rgba(59, 130, 246, 0.3);
}

.vl-btn-premium-outline {
  padding: 20px 40px;
  border: 1px solid #e2e8f0;
  color: #0b2440;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 700;
  text-decoration: none;
  transition: 0.3s;
}

.vl-btn-premium-outline:hover {
  border-color: #0b2440;
  background: #f8fafc;
}

/* --- Value Summary Card --- */
.vl-value-summary {
  background: #0b2440;
  border-radius: 24px;
  padding: 50px;
  color: #ffffff;
}

.vl-value-title {
  font-size: 14px;
  font-weight: 800;
  color: #3b82f6;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin-bottom: 40px;
  text-align: center;
}

.vl-value-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
}

.vl-value-item {
  display: flex;
  gap: 20px;
}

.vl-value-index {
  font-size: 12px;
  font-weight: 900;
  color: #ff7a59; /* Cam san hô nhấn nhỏ */
  width: 30px;
  height: 30px;
  border: 1px solid rgba(255, 122, 89, 0.3);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.vl-value-text strong {
  display: block;
  font-size: 16px;
  margin-bottom: 8px;
  color: #ffffff;
}

.vl-value-text span {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.6);
  line-height: 1.5;
  display: block;
}

.vl-text-orange {
  color: #ff7a59;
  font-weight: 600;
}

/* Responsive */
@media (max-width: 900px) {
  .vl-value-grid { grid-template-columns: 1fr; gap: 30px; }
  .vl-cta-actions { flex-direction: column; align-items: stretch; }
  .vl-btn-blue-action, .vl-btn-premium-outline { text-align: center; }
}


/* ==========================================================================
   VL NAV RAIL - SIMPLE & STRATEGIC (NAVY & BLUE THEME)
   ========================================================================== */

.vl-rail-wrap {
  padding: 100px 0;
  background: #ffffff; /* Nền trắng để phân biệt với khối Pricing xám nhạt */
  border-top: 1px solid #f1f5f9;
}

.vl-container {
  max-width: 1300px;
  margin: 0 auto;
  padding: 0 25px;
}

/* --- Header System --- */
.vl-rail-header {
  text-align: center;
  max-width: 800px;
  margin: 0 auto 60px;
}

.vl-kicker-premium {
  display: inline-block;
  font-size: 11px;
  font-weight: 800;
  color: #3b82f6;
  letter-spacing: 0.2em;
  padding: 6px 16px;
  background: rgba(59, 130, 246, 0.08);
  border-radius: 4px;
  text-transform: uppercase;
  margin-bottom: 20px;
}

.vl-title-main {
  font-size: clamp(30px, 5vw, 42px);
  font-weight: 900;
  color: #0b2440;
  line-height: 1.2;
  margin-bottom: 25px;
  letter-spacing: -0.03em;
}

.vl-accent-gradient {
  display: block;
  background: linear-gradient(135deg, #0b2440 20%, #3b82f6 80%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.vl-desc-main {
  font-size: 17px;
  color: #64748b;
  line-height: 1.6;
}

.vl-text-orange {
  color: #ff7a59;
  font-weight: 700;
}

/* --- Rail Grid --- */
.vl-rail-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}

.vl-rail-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 20px;
  padding: 45px 35px;
  display: flex;
  flex-direction: column;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  position: relative;
}

/* Hiệu ứng Hover card thường */
.vl-rail-card:not(.vl-rail-featured):hover {
  border-color: #3b82f6;
  transform: translateY(-5px);
  box-shadow: 0 20px 40px rgba(11, 36, 64, 0.05);
}

/* Card Đặc biệt (Lựa chọn 03) */
.vl-rail-card.vl-rail-featured {
  background: #0b2440;
  border: none;
  color: #ffffff;
  transform: scale(1.02);
  box-shadow: 0 25px 50px rgba(11, 36, 64, 0.15);
}

/* Phase Label */
.vl-rail-phase {
  font-size: 11px;
  font-weight: 800;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  margin-bottom: 20px;
}
.vl-rail-featured .vl-rail-phase { color: #3b82f6; }

/* Heading & Paragraph */
.vl-rail-h {
  font-size: 22px;
  font-weight: 800;
  color: #0b2440;
  margin-bottom: 15px;
  line-height: 1.4;
}
.vl-rail-featured .vl-rail-h { color: #ffffff; }

.vl-rail-p {
  font-size: 15px;
  color: #64748b;
  line-height: 1.6;
  margin-bottom: 35px;
}
.vl-rail-featured .vl-rail-p { color: rgba(255, 255, 255, 0.7); }

.vl-rail-p strong { color: #0b2440; }
.vl-rail-featured .vl-rail-p strong { color: #ffffff; }

/* Action Links */
.vl-rail-action {
  margin-top: auto;
}

.vl-rail-link {
  font-size: 15px;
  font-weight: 700;
  color: #3b82f6;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: 0.3s;
}

.vl-rail-link span {
  transition: transform 0.3s ease;
}

.vl-rail-link:hover span {
  transform: translateX(6px);
}

/* Nút bấm Card nổi bật */
.vl-rail-btn-active {
  display: block;
  text-align: center;
  padding: 16px 20px;
  background: #3b82f6;
  color: #ffffff;
  font-weight: 700;
  text-decoration: none;
  border-radius: 8px;
  transition: 0.3s;
}

.vl-rail-btn-active:hover {
  background: #2563eb;
  transform: translateY(-2px);
  box-shadow: 0 10px 20px rgba(59, 130, 246, 0.3);
}

/* Responsive */
@media (max-width: 992px) {
  .vl-rail-grid {
    grid-template-columns: 1fr;
    max-width: 450px;
    margin: 0 auto;
  }
  .vl-rail-card.vl-rail-featured {
    transform: scale(1);
  }
}

/* =========================================
   VLINK FAQ (BOFU) - NAVY & BLACK THEME
   Optimization: High Trust & Conversion
========================================= */

:root {
    --vlink-navy: #002347;     /* Màu Xanh Navy đậm - Tin cậy */
    --vlink-black: #111111;    /* Màu Đen - Sang trọng */
    --vlink-accent: #0056b3;   /* Xanh Navy sáng hơn cho Hover */
    --vlink-bg-light: #f4f7f9; /* Nền xám xanh nhạt */
    --vlink-border: #d1d9e0;
    --vlink-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.vlink-faq {
    max-width: 100%;
    margin: 0 auto;
    font-family: inherit;
    line-height: 1.7;
    color: var(--vlink-black);
}

/* Header Section */
.vlink-faq__head {
    text-align: center;
    margin-bottom: 35px;
    padding: 0 15px;
}

.vlink-faq__title {
    font-size: 2rem;
    font-weight: 800;
    color: var(--vlink-navy);
    margin-bottom: 12px;
    letter-spacing: -0.5px;
}

.vlink-faq__subtitle {
    font-size: 1.15rem;
    color: #555;
    max-width: 750px;
    margin: 0 auto;
}

/* FAQ Items List */
.vlink-faq__list {
    background: transparent;
}

.vlink-faq__item {
    background: #fff;
    border: 1px solid var(--vlink-border);
    margin-bottom: 12px;
    border-radius: 4px;
    transition: var(--vlink-transition);
}

.vlink-faq__item[open] {
    border-color: var(--vlink-navy);
    box-shadow: 0 10px 20px rgba(0, 35, 71, 0.1);
}

/* Question Style */
.vlink-faq__q {
    padding: 18px 25px;
    font-weight: 700;
    cursor: pointer;
    list-style: none;
    position: relative;
    color: var(--vlink-black);
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 1.05rem;
}

.vlink-faq__q::-webkit-details-marker {
    display: none;
}

/* Icon mũi tên tùy chỉnh */
.vlink-faq__q::after {
    content: '';
    width: 10px;
    height: 10px;
    border-right: 2.5px solid var(--vlink-navy);
    border-bottom: 2.5px solid var(--vlink-navy);
    transform: rotate(45deg);
    transition: var(--vlink-transition);
    margin-left: 15px;
    flex-shrink: 0;
}

.vlink-faq__item[open] .vlink-faq__q {
    color: var(--vlink-navy);
    background-color: var(--vlink-bg-light);
    border-bottom: 1px solid var(--vlink-border);
}

.vlink-faq__item[open] .vlink-faq__q::after {
    transform: rotate(-135deg);
    margin-top: 5px;
}

.vlink-faq__q:hover {
    background-color: var(--vlink-bg-light);
}

/* Answer Style */
.vlink-faq__a {
    padding: 25px 30px;
    font-size: 1rem;
    color: #333;
    border-top: none;
}

.vlink-faq__a strong {
    color: var(--vlink-navy);
}

.vlink-faq__a ol li::marker {
    color: var(--vlink-navy);
    font-weight: bold;
}

.vlink-faq__a ul li::marker {
    color: var(--vlink-navy);
}

/* CTA Section - Professional Navy Look */
.vlink-faq__cta {
    margin-top: 45px;
    padding: 40px;
    background-color: var(--vlink-navy);
    border-radius: 8px;
    text-align: center;
    color: #ffffff; /* Chữ trắng trên nền Navy */
}

.vlink-faq__cta p strong {
    color: #ffffff;
    font-size: 1.2rem;
}

/* Chỉnh lại nút của Flatsome trong vùng Navy */
.vlink-faq__cta .button {
    margin: 10px;
    border-radius: 99px; /* Bo tròn tạo sự hiện đại */
    padding: 10px 30px;
    font-size: 0.95rem;
    border: none;
}

.vlink-faq__cta .button.primary {
    background-color: #ffffff;
    color: var(--vlink-navy) !important;
}

.vlink-faq__cta .button.secondary {
    background-color: transparent;
    border: 2px solid #ffffff;
    color: #ffffff !important;
}

.vlink-faq__cta .button:hover {
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
}

.vlink-faq__note {
    font-size: 0.85rem;
    opacity: 0.8;
    margin-top: 20px;
}

/* Responsive */
@media (max-width: 767px) {
    .vlink-faq__head { margin-bottom: 20px; }
    .vlink-faq__title { font-size: 1.5rem; }
    .vlink-faq__q { padding: 15px 20px; font-size: 1rem; }
    .vlink-faq__cta { padding: 25px 15px; }
    .vlink-faq__cta .button { display: block; width: 100%; margin: 10px 0; }
}



/* =========================
   VLINK ASIA - CTA (No CF7)
   Root: .vla-cta  (nhúng trong Flatsome Row/Column)
   ========================= */

/* --- TỔNG THỂ --- */
#formlienhe.vla-cta{
  padding: 100px 0;
  background: #ffffff;
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
}

#formlienhe .vla-cta-container{
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

/* GRID LAYOUT: Canh Top */
#formlienhe .vla-cta-grid{
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 80px;
  align-items: start;
}

/* --- CỘT TRÁI --- */
#formlienhe .vla-badge-row{
  display: flex;
  align-items: center;
  gap: 15px;
  margin-bottom: 30px;
}

/* Hiệu ứng chớp sáng xanh lá */
#formlienhe .vla-status-live{
  background: #f0fdf4;
  color: #16a34a;
  padding: 6px 14px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  border: 1px solid #dcfce7;
}

#formlienhe .vla-ping{
  width: 8px; height: 8px;
  background: #22c55e;
  border-radius: 50%;
  margin-right: 8px;
  position: relative;
}

#formlienhe .vla-ping::after{
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: #22c55e;
  border-radius: 50%;
  animation: vla-ping-animate 1.5s cubic-bezier(0, 0, 0.2, 1) infinite;
}

@keyframes vla-ping-animate{
  75%, 100%{ transform: scale(3); opacity: 0; }
}

#formlienhe .vla-label-year{
  font-size: 11px;
  font-weight: 700;
  color: #94a3b8;
  letter-spacing: 0.1em;
}

#formlienhe .vla-title-xl{
  font-size: 44px;
  font-weight: 900;
  color: #0b2440;
  line-height: 1.1;
  margin-bottom: 25px;
  letter-spacing: -0.02em;
}

#formlienhe .vla-gradient-text{
  background: linear-gradient(90deg, #3b82f6, #06b6d4);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

#formlienhe .vla-lead-text{
  font-size: 17px;
  color: #475569;
  line-height: 1.6;
  margin-bottom: 40px;
  max-width: 500px;
}

/* Danh sách tính năng */
#formlienhe .vla-feature-item{
  display: flex;
  gap: 20px;
  margin-bottom: 25px;
}

#formlienhe .vla-feature-icon{
  width: 32px;
  height: 32px;
  background: #0b2440;
  color: #fff;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 800;
  flex-shrink: 0;
}

#formlienhe .vla-feature-content h3{
  font-size: 17px;
  font-weight: 800;
  color: #0b2440;
  margin: 0 0 5px 0;
}

#formlienhe .vla-feature-content p{
  font-size: 14px;
  color: #64748b;
  margin: 0;
  line-height: 1.5;
}

/* Proof box ngang */
#formlienhe .vla-expert-proof{
  display: flex;
  gap: 30px;
  margin-top: 50px;
  padding-top: 30px;
  border-top: 1px solid #f1f5f9;
}

#formlienhe .vla-num{
  font-size: 22px;
  font-weight: 900;
  color: #3b82f6;
}

#formlienhe .vla-txt{
  font-size: 10px;
  font-weight: 700;
  color: #94a3b8;
  text-transform: uppercase;
}

/* --- CỘT PHẢI: KHUNG CTA (đẹp hơn, không còn input) --- */
#formlienhe .vla-cta-right{
  position: sticky;
  top: 40px;
}

#formlienhe .vla-form-container{
  background: #0b2440;
  padding: 44px;
  border-radius: 24px;
  color: #fff;
  box-shadow: 0 30px 60px -12px rgba(11, 36, 64, 0.30);
  border: 1px solid rgba(255,255,255,0.08);
}

#formlienhe .vla-form-header h3{
  font-size: 22px;
  font-weight: 900;
  margin: 0 0 10px 0;
  color: #fff;
  letter-spacing: -0.01em;
}

#formlienhe .vla-form-header p{
  font-size: 14px;
  color: rgba(255,255,255,0.72);
  margin: 0 0 22px 0;
  line-height: 1.55;
}

/* CTA Button */
#formlienhe .vla-form-main{
  display: grid;
  gap: 14px;
}

#formlienhe .vla-form-btn{
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 16px 18px;
  border-radius: 14px;
  background: #3b82f6;
  color: #fff !important;
  font-weight: 900;
  font-size: 15px;
  text-decoration: none !important;
  cursor: pointer;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}

#formlienhe .vla-form-btn:hover{
  background: #2563eb;
  transform: translateY(-2px);
  box-shadow: 0 14px 28px rgba(59,130,246,0.28);
}

/* Sub note dưới nút */
#formlienhe .vla-form-subnote{
  font-size: 12px;
  line-height: 1.55;
  color: rgba(255,255,255,0.65);
}

#formlienhe .vla-form-subnote a{
  color: rgba(255,255,255,0.90);
  text-decoration: underline;
  text-underline-offset: 3px;
}

#formlienhe .vla-form-subnote span{
  display: inline-block;
  margin-top: 6px;
  color: rgba(255,255,255,0.62);
}

/* Footer note */
#formlienhe .vla-form-footer{
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid rgba(255,255,255,0.10);
  text-align: center;
  font-size: 11px;
  color: rgba(255,255,255,0.52);
}

/* RESPONSIVE */
@media (max-width: 992px){
  #formlienhe .vla-cta-grid{ grid-template-columns: 1fr; gap: 50px; }
  #formlienhe .vla-cta-right{ position: relative; top: 0; }
  #formlienhe .vla-title-xl{ font-size: 32px; }
  #formlienhe .vla-form-container{ padding: 34px; }
}



/* GRID LAYOUT: Canh giữa theo trục dọc (middle) */
#formlienhe .vla-cta-grid{
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 80px;
  align-items: center; /* <-- canh middle 2 cột */
}

/* Nếu dùng sticky thì KHÔNG "middle" được khi scroll.
   Muốn đúng middle: tắt sticky ở desktop. */
#formlienhe .vla-cta-right{
  position: relative; /* <-- bỏ sticky để canh giữa đẹp */
  top: auto;
}

/* (Tuỳ chọn) căn chiều cao khối phải gọn lại để nhìn cân hơn */
#formlienhe .vla-form-container{
  padding: 42px;
}

/* Responsive giữ nguyên */
@media (max-width: 992px){
  #formlienhe .vla-cta-grid{ grid-template-columns: 1fr; gap: 50px; align-items: start; }
  #formlienhe .vla-cta-right{ position: relative; top: 0; }
}