:root{
    /* ---- Bộ màu theo nhận diện logo ----
       Logo là nét đen tuyền (#000000) trên nền trong suốt, không có màu nào
       khác để rút ra. Nên bảng màu dựng quanh chính sắc đen đó, cộng một màu
       nhấn duy nhất: vàng đồng — vừa hợp hình mặt trời mọc trong logo và cái
       tên "Sun East", vừa là tông quen thuộc của ngành luật.

       Tách hai sắc vàng vì lý do đọc được:
         --iv-accent  đậm, dùng cho CHỮ và liên kết trên nền sáng (đạt AA)
         --iv-vang    sáng hơn, chỉ dùng cho mảng TRANG TRÍ: biểu tượng, sao,
                      gạch chân, huy hiệu — nơi không phải đọc chữ nhỏ.
       Đổi thương hiệu sau này chỉ cần sửa mấy dòng dưới đây. */
    --iv-den:        #14161a;   /* nền tối, lấy đúng sắc đen của logo */
    --iv-den-2:      #2f343c;   /* điểm cuối của dải chuyển màu */
    --iv-accent:     #8a6317;   /* vàng đồng đậm — dùng cho chữ */
    --iv-vang:       #c9973a;   /* vàng sáng — dùng cho trang trí */
    --iv-accent-nhat:#f7f1e4;   /* nền nhạt của màu nhấn */
}

/* ---------------------------------------------------------------------
   Tinh chỉnh riêng cho bản tiếng Việt của theme Invena.
   Nạp SAU style.css nên mọi khai báo ở đây ghi đè được theme.
   --------------------------------------------------------------------- */

/* Theme dùng font Latin không có dấu tiếng Việt đầy đủ. */
body, .rts-btn, h1, h2, h3, h4, h5, h6,
.title, .disc, .nav-area ul li a, .footer-nav li a {
    font-family: "Be Vietnam Pro", system-ui, -apple-system, "Segoe UI", sans-serif !important;
}

/* Tiêu đề tiếng Việt có dấu nên cần thoáng hơn, không thì dấu bị cắt. */
h1, h2, h3, h4, h5, h6, .title { line-height: 1.35 !important; }
.banner-four-bg .inner-content-wrapper-four-banner .title { line-height: 1.25 !important; }

/* Chưa có logo ảnh thì hiện tên bằng chữ cho khỏi vỡ header. */
.iv-logo-chu { font-size: 24px; font-weight: 700; color: var(--iv-accent); white-space: nowrap; }
/* Chân trang của theme này dùng NỀN SÁNG, nên tên bằng chữ phải để màu đậm. */
.footer-three-single-wized .iv-logo-chu { color: #10182f; }

/* Đánh dấu mục menu đang mở. */
.nav-area ul li.dang-o > a, .nav-area ul li .submenu li.dang-o > a { color: var(--iv-accent); }

/* Ảnh trong bài không được tràn khung. */
.iv-noi-dung img { max-width: 100%; height: auto; }
.iv-noi-dung { line-height: 1.9; }
.iv-noi-dung h2, .iv-noi-dung h3, .iv-noi-dung h4 { margin: 28px 0 14px; }
.iv-noi-dung p { margin-bottom: 16px; text-align: justify; }
.iv-noi-dung ul, .iv-noi-dung ol { margin: 0 0 16px 20px; }
.iv-noi-dung ul li { list-style: disc; margin-bottom: 8px; }
.iv-noi-dung ol li { list-style: decimal; margin-bottom: 8px; }
.iv-noi-dung table { width: 100%; border-collapse: collapse; margin-bottom: 20px; display: block; overflow-x: auto; }
.iv-noi-dung table td, .iv-noi-dung table th { border: 1px solid #e5e7eb; padding: 10px; }

/* Dải breadcrumb: theme không có sẵn kiểu cho trang trong. */
.iv-breadcrumb { background: var(--iv-den); padding: 110px 0 70px; }
.iv-breadcrumb .title { color: #fff; margin-bottom: 12px; }
.iv-breadcrumb .nav-breadcrumb, .iv-breadcrumb .nav-breadcrumb a { color: rgba(255,255,255,.75); }
.iv-breadcrumb .nav-breadcrumb i { margin: 0 8px; font-size: 12px; }

/* Chip chuyên mục con. */
.iv-chip-wrap { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.iv-chip { display: inline-block; padding: 8px 18px; border: 1px solid #e5e7eb; border-radius: 40px; font-size: 15px; transition: .3s; }
.iv-chip:hover { background: var(--iv-accent); color: #fff; border-color: transparent; }

/* Phân trang: helper của CMS sinh ra <ul class="pagination"> với .page-item/.page-link. */
.iv-phan-trang .pagination { display: flex; justify-content: center; gap: 8px; flex-wrap: wrap; padding: 0; margin: 0; list-style: none; }
.iv-phan-trang .page-item { list-style: none; }
.iv-phan-trang .page-link {
    display: inline-block; min-width: 44px; padding: 10px 14px; text-align: center;
    border: 1px solid #e5e7eb; border-radius: 6px; font-weight: 500;
    color: #10182f; background: #fff; transition: .25s;
}
.iv-phan-trang .page-link:hover { border-color: var(--iv-accent); color: var(--iv-accent); }
.iv-phan-trang .page-item.active .page-link { background: var(--iv-accent); color: #fff; border-color: transparent; }

/* ---- Thẻ bài viết ----
   Theme gốc đặt .inner-content ở position:absolute với color:#fff để đè chữ
   trắng lên ảnh. Cách đó chỉ đọc được khi có lớp phủ tối, và thẻ KHÔNG có ảnh
   thì sập chiều cao còn 0. Ở đây đổi hẳn thành thẻ nền sáng, chữ đậm. */
.single-blog-area-four {
    position: relative; height: 100%; display: flex; flex-direction: column;
    background: #fff; border: 1px solid #e9ecf2; border-radius: 10px;
    overflow: hidden; transition: box-shadow .3s, transform .3s;
}
.single-blog-area-four:hover { box-shadow: 0 12px 30px rgba(16, 24, 40, .10); transform: translateY(-4px); }
.single-blog-area-four a.thumbnail { border-radius: 0; }
.single-blog-area-four a.thumbnail img { width: 100%; height: 220px; object-fit: cover; }
.single-blog-area-four .inner-content {
    position: static !important; left: auto !important; bottom: auto !important;
    padding: 15px 15px 28px; flex: 1; display: flex; flex-direction: column;
}
.single-blog-area-four .inner-content * { color: inherit !important; }
/* Theme khai .tag-area-wrapper .single p (bon class) nen phai viet du bon
   class moi thang duoc, viet ba class se thua do do uu tien thap hon. */
.single-blog-area-four .inner-content .tag-area-wrapper p,
.single-blog-area-four .inner-content .tag-area-wrapper .single p {
    color: #6b7280 !important; font-size: 13px; }
/* Theme de margin-bottom:20px cho dai ngay thang; thu gon lai cho sat tieu de. */
.single-blog-area-four .inner-content .tag-area-wrapper { margin-bottom: 5px; }
.single-blog-area-four .inner-content .tag-area-wrapper i { color: #9aa3b2 !important; }
.single-blog-area-four .inner-content .title {
    color: #10182f !important; font-size: 17px; margin: 0 0 12px;
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.single-blog-area-four:hover .inner-content .title { color: var(--iv-accent) !important; }
.single-blog-area-four .inner-content .disc {
    color: #6b7280 !important; font-size: 15px; margin-bottom: 18px;
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.single-blog-area-four .read-more { margin-top: auto; color: var(--iv-accent) !important; font-weight: 600; }
.single-blog-area-four .read-more i { color: var(--iv-accent) !important; margin-left: 6px; }

.iv-sidebar .recent-post-single .thumbnail img { width: 84px; height: 68px; object-fit: cover; border-radius: 6px; }

/* ---- Trang liên hệ ---- */
.iv-lh-list { margin-top: 30px; }
.iv-lh-list li { display: flex; gap: 16px; align-items: flex-start; margin-bottom: 24px; }
.iv-lh-list li i { font-size: 20px; color: var(--iv-accent); margin-top: 4px; }
.iv-lh-list li span { display: block; font-weight: 600; margin-bottom: 4px; }
.iv-lh-list li p { margin: 0; }
.iv-lienhe-form { background: #f7f8fb; padding: 40px; border-radius: 10px; }
.iv-lienhe-form .title { margin-bottom: 24px; }
.iv-lienhe-form input, .iv-lienhe-form textarea {
    width: 100%; padding: 14px 18px; border: 1px solid #e5e7eb;
    border-radius: 6px; background: #fff; font-size: 15px;
}
.iv-lienhe-form input:focus, .iv-lienhe-form textarea:focus { outline: none; border-color: var(--iv-accent); }
.iv-bay { position: absolute !important; left: -9999px !important; }
.iv-loi { background: #fdecec; border: 1px solid #f5c2c2; padding: 14px 18px; border-radius: 6px; margin-bottom: 20px; }
.iv-loi ul li { list-style: disc; margin-left: 18px; }
.iv-ban-do iframe { width: 100%; height: 420px; border: 0; border-radius: 10px; }

/* ---- Menu trượt trên điện thoại ----
   Giữ nguyên cơ chế của theme (đổi `right` khi có class .show); ở đây chỉ
   chỉnh bề rộng cho vừa màn hình nhỏ và nâng z-index để không bị header đè. */
#side-bar.side-bar { z-index: 1050; background: #fff; }
@media (max-width: 480px){
    #side-bar.side-bar { width: 88vw; max-width: 340px; }
}

/* ---- Khối "chưa có dữ liệu" ----
   Dùng cho tìm kiếm không ra kết quả, chuyên mục rỗng, chưa có chủ đề…
   Có khối này thì trang trống vẫn ra dáng trang, không phải một vùng trắng. */
.iv-trong { padding: 60px 20px; }
.iv-trong .title { margin-bottom: 12px; }
.iv-trong .disc { color: #6b7280; margin-bottom: 26px; }

/* =====================================================================
   TRANG DỊCH VỤ
   ===================================================================== */
.iv-dichvu {
    display: flex; flex-direction: column; height: 100%;
    padding: 34px 30px 30px; background: #fff;
    border: 1px solid #e9ecf2; border-radius: 12px;
    transition: transform .3s, box-shadow .3s, border-color .3s;
}
.iv-dichvu:hover { transform: translateY(-6px); box-shadow: 0 18px 40px rgba(16,24,40,.10); border-color: transparent; }
.iv-dv-icon {
    width: 62px; height: 62px; display: flex; align-items: center; justify-content: center;
    border-radius: 14px; background: var(--iv-accent-nhat); color: var(--iv-accent);
    font-size: 26px; margin-bottom: 22px; transition: .3s;
}
.iv-dichvu:hover .iv-dv-icon { background: var(--iv-accent); color: #fff; }
.iv-dv-anh { display: block; margin-bottom: 22px; border-radius: 10px; overflow: hidden; }
.iv-dv-anh img { width: 100%; height: 180px; object-fit: cover; }
.iv-dv-ten { display: block; font-size: 20px; font-weight: 700; color: #10182f; line-height: 1.45; margin-bottom: 12px; }
.iv-dichvu:hover .iv-dv-ten { color: var(--iv-accent); }
.iv-dv-mo-ta { display: block; color: #6b7280; font-size: 15px; line-height: 1.75; margin-bottom: 22px; }
.iv-dv-more { display: inline-flex; align-items: center; gap: 8px; margin-top: auto; font-weight: 600; color: var(--iv-accent); }
.iv-dv-more i { transition: transform .3s; }
.iv-dichvu:hover .iv-dv-more i { transform: translateX(5px); }

/* =====================================================================
   TRANG ĐỘI NGŨ NHÂN SỰ
   ===================================================================== */

/* =====================================================================
   HỘP KÊU GỌI CUỐI TRANG
   ===================================================================== */
.iv-cta-hop {
    display: flex; align-items: center; justify-content: space-between; gap: 30px; flex-wrap: wrap;
    padding: 44px 48px; border-radius: 14px;
    background: linear-gradient(120deg, var(--iv-den) 0%, var(--iv-den-2) 100%);
}
.iv-cta-hop .title { color: #fff; margin: 0 0 8px; font-size: 26px; }
.iv-cta-hop .disc { color: rgba(255,255,255,.78); margin: 0; }
.iv-cta-hop .rts-btn { flex-shrink: 0; background: #fff !important; color: var(--iv-den) !important; }

/* =====================================================================
   LÀM ĐẸP CHUNG
   ===================================================================== */

/* Nhịp chữ dễ đọc hơn cho tiếng Việt có dấu. */
body { font-size: 16px; line-height: 1.75; color: #414a5c; }
.title-style-four .pre { letter-spacing: .14em; text-transform: uppercase; font-size: 13px; font-weight: 600; }
.title-style-four .title { line-height: 1.3 !important; }
.rts-section-gap { padding: 90px 0; }
.rts-section-gapBottom { padding-bottom: 90px; }

/* Dải breadcrumb: thêm chiều sâu thay vì một mảng màu phẳng. */
.iv-breadcrumb {
    background: linear-gradient(120deg, var(--iv-den) 0%, #000 100%);
    padding: 60px 0 60px; position: relative; overflow: hidden;
    /* Theme khoa .rts-breadcrumb-area o height:477px nen padding khong an
       thua; tra ve auto de dai bang dung noi dung ben trong. */
    height: auto;
}
.iv-breadcrumb::after {
    content: ""; position: absolute; right: -80px; top: -80px;
    width: 320px; height: 320px; border-radius: 50%;
    background: rgba(255,255,255,.05);
}
.iv-breadcrumb .title { font-size: clamp(28px, 4vw, 30px); }
.iv-breadcrumb .nav-breadcrumb a:hover { color: #fff; }

/* Nút: bo tròn nhẹ và có phản hồi khi rê chuột. */
.rts-btn { border-radius: 8px; transition: transform .25s, box-shadow .25s, background .25s; }
.rts-btn:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(20,22,26,.22); }

/* Viền khi dùng bàn phím — cần cho người không dùng chuột. */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible {
    outline: 3px solid rgba(138,99,23,.45); outline-offset: 2px; border-radius: 4px;
}

/* Bài viết: khổ chữ và khoảng cách cho dễ đọc đường dài. */
.iv-bai-viet .thumbnail img { width: 100%; border-radius: 12px; margin-bottom: 28px; }
.iv-bai-viet .user-info { display: flex; gap: 24px; flex-wrap: wrap; padding-bottom: 20px; margin-bottom: 26px; border-bottom: 1px solid #e9ecf2; }
.iv-bai-viet .user-info .single { display: flex; align-items: center; gap: 8px; color: #6b7280; font-size: 15px; }
.iv-noi-dung { font-size: 17px; line-height: 1.95; color: #374151; }
.iv-noi-dung h2 { font-size: 26px; } .iv-noi-dung h3 { font-size: 22px; } .iv-noi-dung h4 { font-size: 19px; }
.iv-noi-dung h2, .iv-noi-dung h3, .iv-noi-dung h4 { color: #10182f; }
.iv-noi-dung strong { color: #10182f; }
.iv-noi-dung a { color: var(--iv-accent); text-decoration: underline; text-underline-offset: 3px; }
.iv-noi-dung img { border-radius: 10px; margin: 8px 0 20px; }
.iv-noi-dung blockquote {
    border-left: 4px solid var(--iv-accent); background: #f7f9fc;
    padding: 20px 26px; border-radius: 0 10px 10px 0; margin: 24px 0; font-style: italic;
}

/* Cột bên của trang bài viết. */
.iv-sidebar .rts-single-wized { background: #f7f9fc; border-radius: 15px; padding: 28px 26px; margin-bottom: 26px; }
/* Theme ve widget nay tren nen toi nen tieu de mau trang; nay nen da sang
   thi phai doi lai chu dam, khong thi chu chim mat. Rieng hop "Can tu van"
   van nen toi nen giu chu trang (luat ben duoi ghi de). */
.iv-sidebar .wized-header .title { font-size: 19px; margin-bottom: 20px; padding-bottom: 14px;
    border-bottom: 1px solid #e4e9f2; color: #10182f; }
.iv-sidebar .recent-post-single { display: flex; gap: 14px; margin-bottom: 18px; }
.iv-sidebar .recent-post-single .user .title { font-size: 15px; line-height: 1.55; margin: 0 0 4px; color: #10182f;
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.iv-sidebar .recent-post-single:hover .user .title { color: var(--iv-accent); }
.iv-sidebar .recent-post-single .user span { font-size: 13px; color: #9aa3b2; }
.iv-sidebar .contact-wized { background: linear-gradient(120deg, var(--iv-den) 0%, var(--iv-den-2) 100%); }
.iv-sidebar .contact-wized .title, .iv-sidebar .contact-wized .disc { color: #fff; }
.iv-sidebar .contact-wized .disc { color: rgba(255,255,255,.78); margin-bottom: 18px; }

/* Chân trang: giãn dòng cho dễ bấm trên điện thoại. */
.rts-footer-area .footer-nav li { margin-bottom: 12px; }
.rts-footer-area .footer-nav li a { transition: color .25s, padding-left .25s; }
.rts-footer-area .footer-nav li a:hover { color: var(--iv-accent); padding-left: 5px; }
.rts-footer-area .contact-fot li { display: flex; gap: 12px; align-items: flex-start; margin-bottom: 14px; }
.rts-footer-area .contact-fot li i { color: var(--iv-accent); margin-top: 5px; }
.social-three-wrapper li a:hover { background: var(--iv-accent); color: #fff; }

/* Màn hình nhỏ. */
@media (max-width: 991px){
    .rts-section-gap { padding: 60px 0; }
    .rts-section-gapBottom { padding-bottom: 60px; }
    .iv-breadcrumb { padding: 100px 0 56px; }
    .iv-cta-hop { padding: 32px 26px; text-align: center; justify-content: center; }
    .iv-cta-hop .title { font-size: 22px; }
}
@media (max-width: 575px){
    body { font-size: 15.5px; }
    .iv-noi-dung { font-size: 16px; }
    .iv-dichvu { padding: 28px 24px 26px; }
}

/* ---- Chống tràn ngang do chuỗi dài không ngắt được ----
   Email hanhchinh.suneastlaw@gmail.com nằm trong cột hẹp ở chân trang, không
   có khoảng trắng nên trình duyệt không biết ngắt ở đâu và đẩy trang rộng ra. */
.rts-footer-area .contact-fot li,
.rts-footer-area .contact-fot li a,
.rts-footer-area .contact-fot li span,
.iv-lh-list li div, .iv-lh-list li a,
.iv-ns-lienhe p {
    min-width: 0; overflow-wrap: anywhere; word-break: break-word;
}
.header-top-one-wrapper .mail a { overflow-wrap: anywhere; }

/* =====================================================================
   KHỐI THẾ MẠNH (Vì sao chọn chúng tôi)
   ===================================================================== */
.iv-themanh-area { background: #f7f9fc; padding-top: 90px; }
.iv-themanh {
    height: 100%; background: #fff; border-radius: 12px; padding: 32px 30px;
    border: 1px solid #e9ecf2; transition: transform .3s, box-shadow .3s;
}
.iv-themanh:hover { transform: translateY(-5px); box-shadow: 0 16px 36px rgba(16,24,40,.09); }
.iv-tm-icon {
    width: 56px; height: 56px; display: flex; align-items: center; justify-content: center;
    border-radius: 50%; background: var(--iv-accent-nhat); color: var(--iv-accent);
    font-size: 23px; margin-bottom: 20px;
}
.iv-tm-ten { font-size: 18px; color: #10182f; line-height: 1.5; margin: 0 0 12px; }
.iv-tm-mo-ta { color: #6b7280; font-size: 15px; line-height: 1.8; margin: 0; }

/* =====================================================================
   KHẨU HIỆU
   ===================================================================== */
.iv-khauhieu {
    background: linear-gradient(120deg, var(--iv-den) 0%, var(--iv-den-2) 100%);
    padding: 68px 0; position: relative; overflow: hidden;
}
.iv-khauhieu::before {
    content: ""; position: absolute; left: -60px; bottom: -90px;
    width: 260px; height: 260px; border-radius: 50%; background: rgba(255,255,255,.05);
}
.iv-kh-chu {
    color: #fff; font-size: clamp(22px, 3.2vw, 34px); font-weight: 700;
    line-height: 1.45; margin: 0 0 10px;
}
.iv-kh-en { color: rgba(255,255,255,.55); letter-spacing: .22em; font-size: 13px; font-weight: 600; }

/* =====================================================================
   TÊN KHÁCH HÀNG (khi chưa có logo)
   ===================================================================== */
/* Bốn dòng tên khách hàng chạy ngang, dòng lẻ sang trái dòng chẵn sang phải.
   Nội dung mỗi dòng được nhân đôi trong HTML, chạy hết một nửa (-50%) là quay
   lại điểm đầu nên mắt không thấy chỗ nối. */
.iv-kh-chay { position: relative; overflow: hidden; padding: 4px 0; }
.iv-kh-chay::before, .iv-kh-chay::after {
    content: ""; position: absolute; top: 0; bottom: 0; width: 90px; z-index: 2; pointer-events: none;
}
.iv-kh-chay::before { left: 0;  background: linear-gradient(90deg, #fff 20%, rgba(255,255,255,0)); }
.iv-kh-chay::after  { right: 0; background: linear-gradient(270deg, #fff 20%, rgba(255,255,255,0)); }
.iv-kh-hang { overflow: hidden; margin-bottom: 12px; }
.iv-kh-track {
    display: flex; gap: 12px; width: max-content;
    animation: iv-chay var(--iv-tg, 44s) linear infinite;
}
.iv-kh-hang.nguoc .iv-kh-track { animation-direction: reverse; }
.iv-kh-chay:hover .iv-kh-track { animation-play-state: paused; }
@keyframes iv-chay { from { transform: translateX(0); } to { transform: translateX(-50%); } }

.iv-kh-ten {
    display: inline-block; white-space: nowrap; padding: 11px 22px; background: #fff;
    border: 1px solid #e4e9f2; border-radius: 40px;
    font-size: 14.5px; color: #414a5c; transition: .25s;
}
.iv-kh-ten:hover { border-color: var(--iv-accent); color: var(--iv-accent); box-shadow: 0 6px 16px rgba(138,99,23,.14); }

/* Người bật "giảm chuyển động" trong hệ điều hành thì dừng hẳn, không gây khó chịu. */
@media (prefers-reduced-motion: reduce){
    .iv-kh-track { animation: none; }
    .iv-kh-hang { overflow-x: auto; }
}

/* =====================================================================
   BÀI VIẾT CÙNG CHUYÊN MỤC (trang chi tiết)
   ===================================================================== */
.iv-cungchuyenmuc { background: #f7f9fc; padding-top: 80px; }
.iv-ccm-dau {
    display: flex; align-items: flex-end; justify-content: space-between;
    gap: 20px; flex-wrap: wrap; margin-bottom: 34px;
    padding-bottom: 20px; border-bottom: 1px solid #e4e9f2;
}
.iv-ccm-dau .pre {
    display: block; letter-spacing: .14em; text-transform: uppercase;
    font-size: 13px; font-weight: 600; color: var(--iv-accent); margin-bottom: 8px;
}
.iv-ccm-dau .title { font-size: 28px; margin: 0; color: #10182f; }
.iv-ccm-all { font-weight: 600; color: var(--iv-accent); white-space: nowrap; }
.iv-ccm-all i { margin-left: 6px; transition: transform .3s; }
.iv-ccm-all:hover i { transform: translateX(5px); }


/* Hồ sơ nhân sự chi tiết ở trang Đội ngũ. */
.iv-ns-tieusu { color: #6b7280; font-size: 15px; line-height: 1.8; margin-bottom: 14px; }
.iv-ns-nhan { font-weight: 700; color: #10182f; font-size: 15px; margin: 0 0 8px; }
.iv-ns-cm { margin: 0 0 14px 18px; }
.iv-ns-cm li { list-style: disc; color: #6b7280; font-size: 14.5px; line-height: 1.75; margin-bottom: 6px; }
.iv-ns-lh { color: #414a5c; font-size: 14.5px; margin: 0 0 4px; }

@media (max-width: 991px){
    .iv-themanh-area, .iv-cungchuyenmuc { padding-top: 60px; }
    .iv-khauhieu { padding: 48px 0; }
    .iv-ccm-dau .title { font-size: 23px; }
}

/* ---- Khung bài viết ----
   Theme đặt margin-right:30px và viền quanh .blog-single-post-listing. Trong
   bố cục hai cột của Bootstrap thì lề phải đó làm lệch cột, còn viền thì thừa
   vì nội dung đã có khoảng thở riêng. Gỡ tại chỗ, không sửa style.css. */
.blog-single-post-listing.iv-bai-viet { margin-right: 0; border: 0; }

/* =====================================================================
   KHỐI KÊU GỌI CUỐI TRANG CHỦ
   Theme không có kiểu cho .cta-four-wrapper ở bố cục này nên nó ra một mảng
   trắng trơ. Dựng thành tấm nền gradient cho dứt khoát, cùng tông với
   breadcrumb và hộp "Cần tư vấn".
   ===================================================================== */
.rts-cta-area-four .cta-four-wrapper {
    background: linear-gradient(120deg, var(--iv-den) 0%, var(--iv-den-2) 100%);
    border-radius: 16px; padding: 62px 50px; position: relative; overflow: hidden;
}
.rts-cta-area-four .cta-four-wrapper::after {
    content: ""; position: absolute; right: -70px; top: -90px;
    width: 300px; height: 300px; border-radius: 50%; background: rgba(255,255,255,.055);
}
.rts-cta-area-four .cta-four-wrapper > * { position: relative; z-index: 1; }
.rts-cta-area-four .cta-four-wrapper .title {
    color: #fff; font-size: clamp(24px, 3.2vw, 34px); margin: 0 0 14px;
}
.rts-cta-area-four .cta-four-wrapper .disc {
    color: rgba(255,255,255,.78); margin: 0 auto; max-width: 620px;
}
.rts-cta-area-four .button-wrapper {
    display: flex; gap: 16px; justify-content: center; flex-wrap: wrap;
}
.rts-cta-area-four .button-wrapper .rts-btn { margin-left: 0 !important; }

/* Nút viền: theme khai .btn-border có nền trong suốt nhưng KHÔNG khai màu chữ,
   nên nó kế thừa color:#fff của .btn-primary — chữ trắng trên nền trắng, mất
   hút. Đây là nút riêng, khai đủ cả viền lẫn màu chữ. */
.iv-btn-vien {
    background: transparent; color: #fff; border: 1.5px solid rgba(255,255,255,.55);
    padding: 15px 32px; border-radius: 8px; font-weight: 600;
    display: inline-flex; align-items: center; justify-content: center; transition: .3s;
}
.iv-btn-vien:hover { background: #fff; color: var(--iv-den); border-color: #fff; }

@media (max-width: 767px){
    .rts-cta-area-four .cta-four-wrapper { padding: 40px 24px; }
    .rts-cta-area-four .button-wrapper .rts-btn { width: 100%; }
}

/* =====================================================================
   ĐÁNH GIÁ KHÁCH HÀNG (bố cục lấy từ index-fifteen)
   Theme chỉ tô nền trắng cho thẻ khi khối cha có class .with-bg-shape-image
   (kèm ảnh nền của theme). Ở đây không dùng ảnh nền đó nên phải tự khai nền,
   đồng thời chỉnh phần ảnh vì dữ liệu của mình có thể chưa có chân dung.
   ===================================================================== */
.iv-danhgia { background: #f7f9fc; padding-top: 90px; }
.iv-danhgia .title-between-area { margin-bottom: 40px; gap: 20px; }
.iv-danhgia .title-style-five .pre { color: var(--iv-accent); }
.iv-danhgia .title-style-five .title { font-size: clamp(26px, 3.4vw, 38px); margin-top: 10px; }

.iv-danhgia .single-testimonials-style-five {
    background: #fff; height: 100%; align-items: stretch;
    gap: 26px; padding: 26px; border-radius: 18px; border: 1px solid #e4e9f2;
    transition: box-shadow .3s, transform .3s;
}
.iv-danhgia .single-testimonials-style-five:hover {
    box-shadow: 0 16px 38px rgba(16,24,40,.10); transform: translateY(-4px);
}

/* Khung ảnh: có ảnh thì cắt vừa khung, chưa có thì hiện chữ cái đầu tên. */
.iv-danhgia .single-testimonials-style-five .thumbnail {
    flex: 0 0 132px; width: 132px; border-radius: 14px; overflow: hidden;
    background: var(--iv-accent-nhat); display: flex; align-items: center; justify-content: center;
}
.iv-danhgia .single-testimonials-style-five .thumbnail img {
    width: 100%; height: 100%; min-width: 0; object-fit: cover;
}
.iv-dg-chu { font-size: 40px; font-weight: 700; color: var(--iv-accent); }

.iv-danhgia .inner-content { display: flex; flex-direction: column; flex: 1; }
.iv-danhgia .inner-content .name-area { margin-bottom: 14px; }
.iv-danhgia .inner-content .name-area .title { font-size: 19px; color: #10182f; margin-bottom: 6px; }
.iv-danhgia .inner-content .name-area span { color: #6b7280; font-size: 14.5px; line-height: 1.6; display: block; }
.iv-danhgia .inner-content p.disc {
    font-size: 15.5px; color: #4b5563; line-height: 1.85; margin-bottom: 18px; flex: 1;
}
.iv-danhgia .inner-content .body-end { justify-content: flex-start; margin-top: auto; }
/* Sao: màu chủ đạo của theme là xám than, để vậy thì không ra "sao". */
.iv-danhgia .inner-content .body-end .star-icon { color: var(--iv-vang); display: flex; gap: 3px; }

/* Nút chuyển và bộ đếm */
.iv-danhgia .swiper-button-nexts, .iv-danhgia .swiper-button-prevs {
    width: 42px; height: 42px; border-radius: 10px; background: #fff;
    border: 1px solid #e4e9f2; cursor: pointer; transition: .25s;
    display: flex; align-items: center; justify-content: center;
}
.iv-danhgia .swiper-button-nexts:hover, .iv-danhgia .swiper-button-prevs:hover {
    background: var(--iv-accent); border-color: var(--iv-accent);
}
.iv-danhgia .swiper-button-nexts:hover i, .iv-danhgia .swiper-button-prevs:hover i { color: #fff; }
.iv-danhgia .swiper-pagination-fractions { font-weight: 700; color: #6b7280; }
.iv-danhgia .swiper-pagination-fractions .swiper-pagination-current { color: var(--iv-accent); }

@media (max-width: 767px){
    .iv-danhgia { padding-top: 60px; }
    .iv-danhgia .single-testimonials-style-five { flex-direction: row; padding: 20px; gap: 18px; }
    .iv-danhgia .single-testimonials-style-five .thumbnail { flex: 0 0 84px; width: 84px; height: 84px; }
    .iv-dg-chu { font-size: 28px; }
}

/* =====================================================================
   TRANG CHI TIẾT NHÂN SỰ
   ===================================================================== */
.iv-nsct-anh {
    position: relative; border-radius: 16px; overflow: hidden;
    background: var(--iv-accent-nhat); aspect-ratio: 4 / 5;
    display: flex; align-items: center; justify-content: center;
}
.iv-nsct-anh img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.iv-nsct-anh .iv-ns-chu { font-size: 68px; font-weight: 700; color: var(--iv-accent); }

.iv-nsct-tt .title { font-size: clamp(26px, 3.4vw, 36px); color: #10182f; margin: 0 0 8px; }
.iv-nsct-chuc {
    display: inline-block; color: var(--iv-accent); font-weight: 600; font-size: 16px;
    background: var(--iv-accent-nhat); padding: 7px 16px; border-radius: 30px; margin-bottom: 24px;
}
.iv-nsct-noidung { border-top: 1px solid #e9ecf2; padding-top: 24px; }
.iv-nsct-noidung .iv-ns-tieusu { font-size: 16px; line-height: 1.9; color: #4b5563; margin-bottom: 20px; }
.iv-nsct-noidung .iv-ns-nhan { font-weight: 700; color: #10182f; font-size: 16px; margin: 0 0 10px; }
.iv-nsct-noidung .iv-ns-cm { margin: 0 0 20px 0; padding: 0; }
.iv-nsct-noidung .iv-ns-cm li {
    list-style: none; position: relative; padding-left: 28px; margin-bottom: 10px;
    color: #4b5563; font-size: 15.5px; line-height: 1.75;
}
.iv-nsct-noidung .iv-ns-cm li::before {
    content: "\f00c"; font-family: "Font Awesome 6 Pro"; font-weight: 300;
    position: absolute; left: 0; top: 1px; color: var(--iv-accent);
}
.iv-nsct-noidung .iv-ns-lh { color: #414a5c; font-size: 15.5px; margin: 0 0 6px; }

.iv-nsct-nut { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; margin-top: 28px; }
.iv-nsct-quaylai { font-weight: 600; color: var(--iv-accent); }
.iv-nsct-quaylai i { margin-right: 6px; transition: transform .3s; display: inline-block; }
.iv-nsct-quaylai:hover i { transform: translateX(-5px); }

.iv-ns-khac { background: #f7f9fc; padding-top: 80px; }


@media (max-width: 991px){
    .iv-ns-khac { padding-top: 60px; }
    .iv-nsct-anh { aspect-ratio: 3 / 2; }
}

/* =====================================================================
   THẺ NHÂN SỰ — dùng chung trang chủ / trang đội ngũ / "Nhân sự khác"
   Ảnh phủ dải tối từ dưới lên, tên và chức danh nằm ngay trên ảnh nên mỗi
   người đọc được ngay mà không cần liếc xuống dưới. Rê chuột thì dải tối
   đậm thêm và hiện nút "Xem hồ sơ".
   ===================================================================== */
.iv-ns-the {
    display: block; position: relative; border-radius: 16px; overflow: hidden;
    background: var(--iv-den); color: inherit; height: 100%;
    box-shadow: 0 2px 10px rgba(16,24,40,.06);
    transition: transform .38s cubic-bezier(.2,.7,.3,1), box-shadow .38s;
}
.iv-ns-the:hover { transform: translateY(-8px); box-shadow: 0 24px 46px rgba(20,22,26,.24); }

.iv-ns-the-anh {
    display: block; position: relative; aspect-ratio: 3 / 4;
    background: var(--iv-accent-nhat); overflow: hidden;
}
.iv-ns-the-anh img {
    width: 100%; height: 100%; object-fit: cover; object-position: center 18%;
    transition: transform .7s cubic-bezier(.2,.7,.3,1);
}
.iv-ns-the:hover .iv-ns-the-anh img { transform: scale(1.07); }
.iv-ns-the-chu {
    position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
    font-size: 46px; font-weight: 700; color: var(--iv-accent);
}

/* Dải tối: nhạt lúc thường, đậm khi rê chuột — chữ luôn đọc được. */
.iv-ns-the-phu {
    position: absolute; inset: 0; pointer-events: none;
    background: linear-gradient(180deg, rgba(20,22,26,0) 38%, rgba(20,22,26,.58) 68%, rgba(20,22,26,.94) 100%);
    transition: background .38s;
}
.iv-ns-the:hover .iv-ns-the-phu {
    background: linear-gradient(180deg, rgba(20,22,26,.12) 0%, rgba(20,22,26,.65) 55%, rgba(20,22,26,.96) 100%);
}

/* Nút "Xem hồ sơ" trượt lên khi rê chuột. */
.iv-ns-the-xem {
    position: absolute; left: 22px; right: 22px; bottom: 20px; z-index: 2;
    display: flex; align-items: center; gap: 8px;
    color: #fff; font-weight: 600; font-size: 14.5px;
    opacity: 0; transform: translateY(14px); transition: opacity .35s, transform .35s;
}
.iv-ns-the:hover .iv-ns-the-xem { opacity: 1; transform: translateY(0); }
.iv-ns-the-xem i { transition: transform .35s; }
.iv-ns-the:hover .iv-ns-the-xem i { transform: translateX(5px); }

/* Tên + chức danh đè lên ảnh, đẩy lên nhường chỗ cho nút khi rê chuột. */
.iv-ns-the-tt {
    position: absolute; left: 22px; right: 22px; bottom: 22px; z-index: 2;
    transition: transform .38s;
}
.iv-ns-the:hover .iv-ns-the-tt { transform: translateY(-34px); }
.iv-ns-the-ten {
    display: block; color: #fff; font-weight: 700; font-size: 19px;
    line-height: 1.4; margin-bottom: 5px;
}
.iv-ns-the-chuc {
    display: block; color: rgba(255,255,255,.82); font-size: 14px; line-height: 1.5;
    position: relative; padding-left: 26px;
}
.iv-ns-the-chuc::before {
    content: ""; position: absolute; left: 0; top: 9px;
    width: 18px; height: 2px; background: var(--iv-vang);
}

/* =====================================================================
   THẺ NỔI BẬT (người đứng đầu) ở trang đội ngũ
   ===================================================================== */
.iv-ns-noibat {
    display: grid; grid-template-columns: 380px 1fr; gap: 46px; align-items: center;
    background: #fff; border: 1px solid #e4e9f2; border-radius: 20px;
    padding: 34px; box-shadow: 0 10px 30px rgba(16,24,40,.05);
}
.iv-nsnb-anh {
    border-radius: 16px; overflow: hidden; aspect-ratio: 4 / 5;
    background: var(--iv-accent-nhat);
}
.iv-nsnb-anh img { width: 100%; height: 100%; object-fit: cover; object-position: center 18%; }
.iv-nsnb-nhan {
    display: inline-block; background: var(--iv-accent); color: #fff;
    font-size: 12.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
    padding: 6px 14px; border-radius: 30px; margin-bottom: 16px;
}
.iv-nsnb-ten { font-size: clamp(24px, 3vw, 32px); color: #10182f; margin: 0 0 6px; }
.iv-nsnb-chuc { display: block; color: var(--iv-accent); font-weight: 600; font-size: 16px; margin-bottom: 18px; }
.iv-nsnb-tieusu { color: #4b5563; font-size: 15.5px; line-height: 1.9; margin-bottom: 18px; }
.iv-nsnb-cm { margin: 0 0 20px; padding: 0; }
.iv-nsnb-cm li {
    list-style: none; position: relative; padding-left: 26px; margin-bottom: 8px;
    color: #4b5563; font-size: 15px; line-height: 1.7;
}
.iv-nsnb-cm li::before {
    content: "\f00c"; font-family: "Font Awesome 6 Pro"; font-weight: 300;
    position: absolute; left: 0; top: 2px; color: var(--iv-accent);
}
.iv-nsnb-lh { display: flex; flex-wrap: wrap; gap: 10px 26px; margin-bottom: 24px; }
.iv-nsnb-lh a { color: #414a5c; font-size: 15px; overflow-wrap: anywhere; }
.iv-nsnb-lh a i { color: var(--iv-accent); margin-right: 7px; }
.iv-nsnb-lh a:hover { color: var(--iv-accent); }

.iv-ns-trang { background: #fbfcfe; }

@media (max-width: 991px){
    .iv-ns-noibat { grid-template-columns: 1fr; gap: 26px; padding: 22px; }
    .iv-nsnb-anh { max-width: 320px; margin: 0 auto; }
}
@media (max-width: 575px){
    .iv-ns-the-ten { font-size: 17px; }
    .iv-ns-the-tt, .iv-ns-the-xem { left: 16px; right: 16px; }
}

/* =====================================================================
   DẢI SỐ LIỆU
   Dải màu chạy hết bề ngang, mỗi mục gồm ô biểu tượng viền mảnh, con số to
   và nhãn viết hoa. Nội dung sửa ở Cấu hình hệ thống → "Số liệu trang chủ".
   ===================================================================== */
.iv-solieu {
    background: linear-gradient(120deg, var(--iv-den) 0%, var(--iv-den-2) 100%);
    padding: 46px 0; position: relative; overflow: hidden;
}
.iv-solieu::before {
    content: ""; position: absolute; right: -70px; top: -110px;
    width: 300px; height: 300px; border-radius: 50%; background: rgba(255,255,255,.05);
}
.iv-sl-hang {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 26px;
    position: relative; z-index: 1;
}
.iv-sl-muc { display: flex; align-items: center; gap: 20px; }
/* Vạch ngăn mảnh giữa các mục, bỏ vạch ở mục cuối. */
.iv-sl-muc:not(:last-child) { border-right: 1px solid rgba(255,255,255,.16); }
.iv-sl-icon {
    flex: 0 0 72px; width: 72px; height: 72px;
    border: 1.5px solid rgba(255,255,255,.42); border-radius: 6px;
    display: flex; align-items: center; justify-content: center;
    font-size: 30px; color: #fff; transition: background .3s, border-color .3s;
}
.iv-solieu:hover .iv-sl-icon { border-color: rgba(255,255,255,.7); }
.iv-sl-chu { display: block; }
.iv-sl-so {
    display: block; color: #fff; font-weight: 800; line-height: 1.1;
    font-size: clamp(26px, 2.6vw, 36px); margin-bottom: 6px;
}
.iv-sl-nhan {
    display: block; color: rgba(255,255,255,.82);
    text-transform: uppercase; letter-spacing: .06em;
    font-size: 14px; font-weight: 500; line-height: 1.45;
}

@media (max-width: 1199px){
    .iv-sl-hang { grid-template-columns: repeat(2, 1fr); gap: 30px 26px; }
    .iv-sl-muc:nth-child(2n) { border-right: 0; }
}
@media (max-width: 575px){
    .iv-solieu { padding: 34px 0; }
    .iv-sl-hang { grid-template-columns: 1fr; gap: 22px; }
    .iv-sl-muc { border-right: 0 !important; }
    .iv-sl-icon { flex: 0 0 58px; width: 58px; height: 58px; font-size: 24px; }
}

/* =====================================================================
   KHỐI CHỦ ĐỀ (cuối trang) — gọn, không chiếm chỗ như bộ thẻ trước
   ===================================================================== */
.iv-cd-hop {
    display: grid; grid-template-columns: 280px 1fr; gap: 40px; align-items: center;
    background: #fbfcfe; border: 1px solid #e9ecf2; border-radius: 16px;
    padding: 38px 42px;
}
.iv-cd-dau .pre {
    display: block; letter-spacing: .14em; text-transform: uppercase;
    font-size: 12.5px; font-weight: 600; color: var(--iv-accent); margin-bottom: 8px;
}
.iv-cd-dau .title { font-size: 22px; color: #10182f; margin: 0; line-height: 1.45; }
.iv-cd-ds { display: flex; flex-wrap: wrap; gap: 10px; }
.iv-cd-muc {
    display: inline-flex; align-items: center; gap: 10px;
    padding: 9px 8px 9px 18px; background: #fff;
    border: 1px solid #e4e9f2; border-radius: 40px;
    font-size: 14.5px; color: #414a5c; transition: .25s;
}
.iv-cd-muc:hover {
    border-color: var(--iv-accent); color: var(--iv-accent);
    box-shadow: 0 6px 16px rgba(138,99,23,.14); transform: translateY(-2px);
}
.iv-cd-so {
    min-width: 26px; height: 26px; padding: 0 7px; border-radius: 30px;
    background: var(--iv-accent-nhat); color: var(--iv-accent);
    font-size: 12.5px; font-weight: 700;
    display: inline-flex; align-items: center; justify-content: center;
}
.iv-cd-muc:hover .iv-cd-so { background: var(--iv-accent); color: #fff; }

@media (max-width: 991px){
    .iv-cd-hop { grid-template-columns: 1fr; gap: 24px; padding: 28px 24px; }
}

/* =====================================================================
   KÍCH THƯỚC LOGO
   Theme chỉ giới hạn logo BÊN TRONG media query màn hình nhỏ; trên desktop
   không có ràng buộc nào nên ảnh ăn theo img{max-width:100%} và phình ra
   bằng cả cột. Logo thật lại là ảnh 1362×681 nên header bị đội cao gấp đôi
   và menu bị ép xuống hai dòng. Khoá chiều cao ở đây cho cả ba chỗ dùng logo.
   ===================================================================== */
.header-main-one-wrapper .thumbnail { flex: 0 0 auto; }
.header-main-one-wrapper .thumbnail a { display: inline-flex; align-items: center; }
.header-main-one-wrapper .thumbnail a img {
    height: 56px; width: auto; max-width: 240px; max-height: 56px;
    object-fit: contain; display: block;
}

/* Chân trang: nền sáng, logo để to hơn một chút cho cân với cột chữ. */
.rts-footer-area .logo_footer img {
    height: 66px; width: auto; max-width: 260px; max-height: 66px;
    object-fit: contain; display: block;
}

/* Menu trượt bên phải. */
#side-bar .logo-1 img {
    height: 50px; width: auto; max-width: 200px; max-height: 50px;
    object-fit: contain; display: block;
}

/* Menu không được xuống dòng vì thiếu chỗ. */
.header-main-one-wrapper .nav-area > ul > li > a { white-space: nowrap; }

@media (max-width: 1199px){
    .header-main-one-wrapper .thumbnail a img { height: 48px; max-height: 48px; max-width: 200px; }
}
@media (max-width: 575px){
    .header-main-one-wrapper .thumbnail a img { height: 42px; max-height: 42px; max-width: 170px; }
    .rts-footer-area .logo_footer img { height: 54px; max-height: 54px; }
}

/* =====================================================================
   NHỊP KHOẢNG CÁCH GIỮA CÁC KHỐI
   Theme dùng hai lớp: .rts-section-gap (đệm cả trên lẫn dưới) và
   .rts-section-gapBottom (chỉ đệm dưới). Các khối tôi thêm lại tự mang đệm
   trên vì có nền riêng — cộng với đệm dưới của khối liền trước thành 170–180px,
   trong khi những chỗ khác chỉ 46–90px. Đoạn dưới kéo về một nhịp thống nhất.
   ===================================================================== */

/* Khối đứng ngay trước một khối CÓ NỀN: giảm đệm dưới, phần còn lại để khối
   kia lo. Dùng :has() nên không phải thêm class vào từng chỗ trong markup. */
.iv-main > *:has(+ .iv-themanh-area),
.iv-main > *:has(+ .iv-danhgia),
.iv-main > *:has(+ .iv-cungchuyenmuc),
.iv-main > *:has(+ .iv-ns-khac),
.iv-main > *:has(+ .iv-ns-trang) { padding-bottom: 30px; }

.iv-themanh-area, .iv-danhgia, .iv-cungchuyenmuc, .iv-ns-khac { padding-top: 70px; }

/* Ngay sau dải màu đậm, khối kế tiếp phải tự có đệm trên — dải đậm chỉ có đệm
   trong của nó, không tạo khoảng hở cho khối sau. */
.iv-solieu + * { padding-top: 90px; }

/* Khẩu hiệu và dải số liệu đều nền đậm và nằm liền nhau; không kẻ gì thì dính
   thành một mảng tối dài. Một vạch mảnh đủ tách hai phần mà vẫn liền mạch. */
.iv-khauhieu + .iv-solieu { border-top: 1px solid rgba(255,255,255,.14); }

@media (max-width: 991px){
    .iv-themanh-area, .iv-danhgia, .iv-cungchuyenmuc, .iv-ns-khac { padding-top: 50px; }
    .iv-main > *:has(+ .iv-themanh-area),
    .iv-main > *:has(+ .iv-danhgia),
    .iv-main > *:has(+ .iv-cungchuyenmuc),
    .iv-main > *:has(+ .iv-ns-khac),
    .iv-main > *:has(+ .iv-ns-trang) { padding-bottom: 20px; }
    .iv-solieu + * { padding-top: 60px; }
}

/* =====================================================================
   ĐIỆN THOẠI — ba khối xếp hai cột
   Thẻ nào cũng hẹp đi một nửa nên cỡ chữ, đệm và chiều cao ảnh phải giảm
   theo, không thì chữ tràn dòng lung tung và thẻ cao lêu nghêu.
   ===================================================================== */
@media (max-width: 767px){

    /* ---- Dải số liệu: hai cột, biểu tượng nằm trên chữ cho đỡ chật ---- */
    .iv-solieu { padding: 34px 0; }
    .iv-sl-hang { grid-template-columns: repeat(2, 1fr) !important; gap: 26px 14px; }
    .iv-sl-muc {
        flex-direction: column; align-items: flex-start; gap: 12px;
        border-right: 0 !important;
    }
    .iv-sl-icon { flex: 0 0 46px; width: 46px; height: 46px; font-size: 20px; border-radius: 5px; }
    .iv-sl-so { font-size: 24px; margin-bottom: 3px; }
    .iv-sl-nhan { font-size: 11.5px; letter-spacing: .04em; }

    /* ---- Thẻ nhân sự ---- */
    .iv-ns-the { border-radius: 12px; }
    .iv-ns-the-tt, .iv-ns-the-xem { left: 13px; right: 13px; bottom: 14px; }
    .iv-ns-the-ten { font-size: 14.5px; line-height: 1.35; margin-bottom: 3px; }
    .iv-ns-the-chuc { font-size: 11.5px; padding-left: 18px; }
    .iv-ns-the-chuc::before { width: 12px; top: 7px; }
    /* Trên cảm ứng không có "rê chuột" nên nút Xem hồ sơ không bao giờ hiện —
       ẩn hẳn và để nguyên thẻ tên, cả thẻ vẫn bấm được. */
    .iv-ns-the-xem { display: none; }
    .iv-ns-the:hover .iv-ns-the-tt { transform: none; }

    /* ---- Thẻ tin tức ---- */
    .single-blog-area-four { border-radius: 12px; }
    .single-blog-area-four a.thumbnail img { height: 118px; }
    .single-blog-area-four .inner-content { padding: 12px 12px 16px; }
    .single-blog-area-four .inner-content .title {
        font-size: 14px; line-height: 1.45; margin-bottom: 8px; -webkit-line-clamp: 3;
    }
    .single-blog-area-four .inner-content .tag-area-wrapper p { font-size: 11.5px; }
    .single-blog-area-four .inner-content .tag-area-wrapper { margin-bottom: 4px; }
    /* Mô tả bỏ đi: cột hẹp một nửa, thêm ba dòng nữa là thẻ dài lê thê. */
    .single-blog-area-four .inner-content .disc { display: none; }
    .single-blog-area-four .read-more { font-size: 12.5px; }
    .single-blog-area-four .read-more i { display: none; }
}

/* Màn hình rất hẹp: nới thêm một nấc nữa. */
@media (max-width: 359px){
    .iv-sl-so { font-size: 21px; }
    .iv-sl-nhan { font-size: 10.5px; }
    .iv-ns-the-ten { font-size: 13px; }
    .single-blog-area-four .inner-content .title { font-size: 13px; }
}

/* =====================================================================
   KHỐI ĐÁNH GIÁ — chỉnh khoảng cách và chiều cao thẻ
   ===================================================================== */

/* Khoảng từ tiêu đề xuống thẻ đang là 80px vì cộng dồn ba thứ: lề dưới của
   tiêu đề (40) + mt--10 của hàng (10) + đệm dọc do lớp g-5 của Bootstrap (30).
   Tắt đệm dọc của hàng rồi đặt đúng 40px ở lề tiêu đề. */
.iv-danhgia .row.g-5 { --bs-gutter-y: 0; margin-top: 0 !important; }
.iv-danhgia .title-between-area { margin-bottom: 40px; }

/* Swiper để mỗi thẻ tự cao theo nội dung nên bốn thẻ so le nhau. Cho hàng
   trượt kéo giãn đều rồi ép thẻ chiếm trọn chiều cao ô. */
.iv-danhgia .swiper-wrapper { align-items: stretch; }
.iv-danhgia .swiper-slide { height: auto; display: flex; }
.iv-danhgia .single-testimonials-style-five { height: 100%; width: 100%; }
/* Đẩy phần sao xuống đáy để các thẻ nhìn thẳng hàng dù chữ dài ngắn khác nhau. */
.iv-danhgia .inner-content .body-end { margin-top: auto; padding-top: 6px; }

/* =====================================================================
   NÚT CHUYỂN NGỮ VI | EN
   ===================================================================== */
.iv-ngonngu {
    display: inline-flex; align-items: center; gap: 6px;
    margin-left: 18px; padding: 6px 12px;
    border: 1px solid #e4e9f2; border-radius: 30px; background: #fff;
}
.iv-nn-nut {
    background: none; border: 0; padding: 2px 6px; cursor: pointer;
    font-size: 13.5px; font-weight: 700; letter-spacing: .04em;
    color: #9aa3b2; border-radius: 20px; transition: color .25s;
}
.iv-nn-nut:hover { color: var(--iv-accent); }
.iv-nn-nut.dang-chon { color: var(--iv-den); }
.iv-nn-ngan { color: #d8dee8; font-size: 12px; }

/* Google Dịch chèn sẵn một thanh trên đỉnh trang và đẩy <body> tụt xuống —
   giấu thanh đó đi và trả body về đúng vị trí. */
#google_translate_element { display: none !important; }
.skiptranslate iframe, iframe.skiptranslate { display: none !important; }
body { top: 0 !important; }
.goog-te-banner-frame { display: none !important; }

@media (max-width: 1199px){
    .iv-ngonngu { margin-left: 10px; padding: 5px 9px; }
    .iv-nn-nut { font-size: 12.5px; }
}
@media (max-width: 767px){
    /* Trên điện thoại chỗ hẹp: bỏ nút đặt lịch trong thanh, giữ nút ngôn ngữ. */
    .header-main-one-wrapper .button-area .quote-btn { display: none; }
    .iv-ngonngu { margin-left: 0; }
}

/* =====================================================================
   NÚT "XEM TẤT CẢ / XEM THÊM" — căn giữa
   Theme đặt .rts-btn{display:flex} nên nút thành khối chiếm trọn dòng và
   text-align:center của ô cha không có tác dụng. Đổi sang inline-flex để nút
   co đúng bề rộng chữ rồi mới căn giữa được.
   ===================================================================== */
.iv-main .text-center > .rts-btn,
.iv-main .text-center > .iv-btn-vien,
.rts-cta-area-four .button-wrapper .rts-btn { display: inline-flex; }
.iv-main .text-center { display: block; }

/* =====================================================================
   NÚT GỌI NỔI (góc dưới bên trái)
   Màu vàng đồng của nhận diện, hai vòng sóng lan toả để hút mắt mà không
   chớp tắt gắt — chớp mạnh gây khó chịu và ảnh hưởng người nhạy cảm ánh sáng.
   ===================================================================== */
.iv-nut-goi {
    position: fixed; left: 24px; bottom: 24px; z-index: 1040;
    display: inline-flex; align-items: center; gap: 0;
    height: 58px; padding: 0; border-radius: 40px;
    background: var(--iv-vang); color: #14161a;
    box-shadow: 0 10px 26px rgba(201,151,58,.42);
    text-decoration: none; overflow: hidden;
    transition: gap .35s, padding .35s, background .25s;
}
.iv-nut-goi i {
    width: 58px; height: 58px; flex: 0 0 58px;
    display: flex; align-items: center; justify-content: center;
    font-size: 22px; position: relative; z-index: 2;
    animation: iv-rung 1.6s ease-in-out infinite;
}
.iv-goi-so {
    max-width: 0; opacity: 0; white-space: nowrap; font-weight: 700;
    font-size: 15.5px; letter-spacing: .02em;
    transition: max-width .35s, opacity .3s, padding .35s;
    padding: 0; position: relative; z-index: 2;
}
.iv-nut-goi:hover { background: #d8a544; color: #14161a; }
.iv-nut-goi:hover .iv-goi-so { max-width: 190px; opacity: 1; padding-right: 22px; }

/* Hai vòng sóng lan ra rồi mờ dần. */
.iv-goi-song {
    position: absolute; left: 0; top: 0; width: 58px; height: 58px;
    border-radius: 50%; background: var(--iv-vang); opacity: .55;
    animation: iv-song 2.2s ease-out infinite; z-index: 1;
}
.iv-goi-song.hai { animation-delay: 1.1s; }

@keyframes iv-song {
    0%   { transform: scale(1);   opacity: .5; }
    70%  { transform: scale(2.1); opacity: 0; }
    100% { transform: scale(2.1); opacity: 0; }
}
@keyframes iv-rung {
    0%, 62%, 100% { transform: rotate(0); }
    68% { transform: rotate(-14deg); }
    74% { transform: rotate(12deg); }
    80% { transform: rotate(-9deg); }
    86% { transform: rotate(7deg); }
}

/* Ai bật "giảm chuyển động" thì tắt hẳn hiệu ứng, nút vẫn dùng bình thường. */
@media (prefers-reduced-motion: reduce){
    .iv-goi-song { display: none; }
    .iv-nut-goi i { animation: none; }
}

@media (max-width: 767px){
    .iv-nut-goi { left: 16px; bottom: 16px; height: 52px; }
    .iv-nut-goi i { width: 52px; height: 52px; flex: 0 0 52px; font-size: 20px; }
    .iv-goi-song { width: 52px; height: 52px; }
}

/* =====================================================================
   HEADER
   Trước đây cả hai thanh đều trong suốt, dính vào nhau thành một mảng trắng
   phẳng. Thanh trên đổi sang nền mực đậm để thành một dải liên hệ rõ ràng;
   thanh dưới nền trắng, có bóng mảnh tách khỏi nội dung.
   ===================================================================== */
.header-one.style-four .header-top-area-wrapper {
    background: var(--iv-den); border-bottom: 0;
}
.header-top-one-wrapper { min-height: 46px; }
.header-top-one-wrapper p,
.header-top-one-wrapper .mail a { color: rgba(255,255,255,.72); font-size: 14px; }
.header-top-one-wrapper .mail a i { color: var(--iv-vang); margin-right: 7px; }
.header-top-one-wrapper .mail a:hover { color: #fff; }
.header-top-one-wrapper .right p a { color: var(--iv-vang); font-weight: 600; }
.header-top-one-wrapper .right p a:hover { color: #fff; }

.header-one.style-four .header-main {
    background: #fff;
    box-shadow: 0 1px 0 #eceff4, 0 6px 20px rgba(20,22,26,.05);
}

/* Menu: gạch chân vàng trượt từ trái sang khi rê chuột hoặc đang ở trang đó. */
.nav-area > ul > li.main-nav > a {
    position: relative; font-weight: 600; padding-bottom: 4px;
}
.nav-area > ul > li.main-nav > a::after {
    content: ""; position: absolute; left: 0; bottom: 0;
    width: 0; height: 2px; background: var(--iv-vang);
    transition: width .3s ease;
}
.nav-area > ul > li.main-nav:hover > a::after,
.nav-area > ul > li.main-nav.dang-o > a::after { width: 100%; }
.nav-area > ul > li.main-nav.dang-o > a { color: var(--iv-accent); }

/* Danh sách xổ xuống: bo góc, đổ bóng, gạch vàng ở mục đang chọn. */
.nav-area .submenu {
    border-radius: 10px; padding: 10px 0; border: 1px solid #eceff4;
    box-shadow: 0 18px 40px rgba(20,22,26,.12);
}
.nav-area .submenu li a { padding: 9px 22px; transition: .25s; }
.nav-area .submenu li a:hover,
.nav-area .submenu li.dang-o a { background: var(--iv-accent-nhat); color: var(--iv-accent); }

/* =====================================================================
   FOOTER
   Nền mực đậm để neo cuối trang và bắt đúng sắc đen của logo, điểm nhấn vàng.
   ===================================================================== */
.rts-footer-area.footer-three {
    background: var(--iv-den) !important;
    background-image: none !important;
    position: relative;
}
/* Vạch vàng mảnh chạy hết bề ngang, tách chân trang khỏi nội dung phía trên. */
.rts-footer-area.footer-three::before {
    content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px;
    background: linear-gradient(90deg, var(--iv-vang), rgba(201,151,58,.15));
}
.rts-footer-area .footer-three-single-wized .title {
    color: #fff !important; font-size: 17px; letter-spacing: .01em;
    margin-bottom: 22px; padding-bottom: 12px; position: relative;
}
.rts-footer-area .footer-three-single-wized .title::after {
    content: ""; position: absolute; left: 0; bottom: 0;
    width: 34px; height: 2px; background: var(--iv-vang);
}
.rts-footer-area .disc { color: rgba(255,255,255,.62) !important; font-size: 15px; }
.rts-footer-area .iv-logo-chu { color: #fff !important; }
.rts-footer-area .logo_footer { margin-bottom: 22px; }

/* Bỏ dấu vuông cũ của theme, thay bằng mũi tên vàng trượt sang khi rê chuột. */
.rts-footer-area .footer-nav li { margin-bottom: 11px; list-style: none; }
.rts-footer-area .footer-nav li a {
    color: rgba(255,255,255,.68); position: relative; padding-left: 16px;
    transition: color .25s, padding-left .25s;
}
.rts-footer-area .footer-nav li a::before {
    content: "\f105"; font-family: "Font Awesome 6 Pro"; font-weight: 300;
    position: absolute; left: 0; top: 0; color: var(--iv-vang);
    opacity: .55; transition: opacity .25s;
}
.rts-footer-area .footer-nav li a:hover { color: #fff; padding-left: 21px; }
.rts-footer-area .footer-nav li a:hover::before { opacity: 1; }

/* Cột liên hệ: giữ biểu tượng thẳng hàng, không dùng mũi tên. */
.rts-footer-area .contact-fot li { color: rgba(255,255,255,.68); margin-bottom: 15px; }
.rts-footer-area .contact-fot li a { padding-left: 0; color: rgba(255,255,255,.68); }
.rts-footer-area .contact-fot li a::before { content: none; }
.rts-footer-area .contact-fot li a:hover { color: #fff; padding-left: 0; }
.rts-footer-area .contact-fot li i { color: var(--iv-vang); }
/* Email dài: ngắt ở chỗ hợp lý thay vì cắt giữa từ như trước. */
.rts-footer-area .contact-fot li a[href^="mailto"] { word-break: break-word; overflow-wrap: break-word; }

/* Mạng xã hội: vòng tròn viền mảnh, tô vàng khi rê chuột. */
.rts-footer-area .social-three-wrapper { display: flex; gap: 10px; margin-top: 26px; }
.rts-footer-area .social-three-wrapper li a {
    width: 40px; height: 40px; border-radius: 50%;
    border: 1px solid rgba(255,255,255,.22); color: rgba(255,255,255,.75) !important;
    display: flex; align-items: center; justify-content: center; transition: .28s;
}
.rts-footer-area .social-three-wrapper li a::after { display: none !important; }
.rts-footer-area .social-three-wrapper li a:hover {
    background: var(--iv-vang); border-color: var(--iv-vang); color: #14161a !important;
    transform: translateY(-3px);
}

/* Dòng bản quyền */
.footer-three .copyright-area { border-top: 1px solid rgba(255,255,255,.10) !important; }
.footer-three .copyright-area p,
.footer-three .copyright-area .disc { color: rgba(255,255,255,.52) !important; font-size: 14.5px; }
.footer-three .copyright-area a { color: rgba(255,255,255,.75); }
.footer-three .copyright-area a:hover { color: var(--iv-vang); }

@media (max-width: 767px){
    .header-top-one-wrapper { min-height: 42px; }
    .header-top-one-wrapper p, .header-top-one-wrapper .mail a { font-size: 12.5px; }
    .rts-footer-area .footer-three-single-wized .title { margin-bottom: 16px; }
}

/* Thanh trên của header: theme to chu bang selector rieng manh hon nen luat
   mau cua minh o tren bi thua — chu tối trên nền mực, tương phản ~1.1:1, gần
   như không đọc được. Khai lại đè hẳn cho cả cụm. */
.header-one.style-four .header-top-area-wrapper,
.header-one.style-four .header-top-area-wrapper p,
.header-one.style-four .header-top-area-wrapper span,
.header-one.style-four .header-top-area-wrapper a { color: rgba(255,255,255,.74) !important; }
.header-one.style-four .header-top-area-wrapper a:hover { color: #fff !important; }
.header-one.style-four .header-top-area-wrapper i { color: var(--iv-vang) !important; }
.header-one.style-four .header-top-area-wrapper .right p a { color: var(--iv-vang) !important; font-weight: 600; }
.header-one.style-four .header-top-area-wrapper .right p a:hover { color: #fff !important; }

/* Email chan trang: da chen <wbr> truoc @ nhung word-break:break-word cho phep
   ngat tuy y nen trinh duyet van lap day dong 1 roi cat giua tu. Tra ve normal
   de <wbr> thanh diem ngat duy nhat; giu overflow-wrap lam luoi an toan phong
   khi ten mien qua dai. */
.rts-footer-area .contact-fot li a[href^="mailto"] {
    word-break: normal !important; overflow-wrap: break-word; font-size: 15px;
}

/* =====================================================================
   DANH SÁCH ĐIỀU HƯỚNG — bỏ thụt lề mặc định
   style.css:768 dat "menu, ol, ul { margin:16px 0; padding:0 0 0 15px }",
   cong them padding-inline-start:40px mac dinh cua trinh duyet, nen moi danh
   sach dieu huong deu bi thut vao 40px va an mat be ngang cot. Chi bo o cac
   danh sach do minh dung; danh sach TRONG BAI VIET van giu thut le vi con
   dau cham dau dong.
   ===================================================================== */
.rts-footer-area .footer-nav,
.rts-footer-area .social-three-wrapper,
.iv-lh-list,
.iv-ns-cm, .iv-nsnb-cm,
.iv-cd-ds,
.iv-sl-hang,
.nav-area > ul,
.nav-area .submenu {
    margin: 0; padding: 0; list-style: none;
}
.rts-footer-area .social-three-wrapper { margin-top: 26px; }
.iv-lh-list { margin-top: 30px; }