/* ============================================================
   Vietjetours — style tái tạo giao diện vietjetours.vn
   Tông màu: đỏ đô (--mau1), vàng đồng (--mau2), nền kem (--mau3), đỏ đậm (--mau4)
   ============================================================ */

body {
    background: #fff;
    font-family: 'Mulish', 'Muli', sans-serif;
    overflow-x: clip;
}
h1, h2, h3, h4, h5, h6, button, input, select, textarea {
    font-family: 'Mulish', 'Muli', sans-serif;
}

/* ---------- Top bar ---------- */
.vj-topbar {
    background: var(--mau1);
    color: #fff;
    font-size: 14px;
    padding: 6px 0;
}
.vj-topbar a { color: #fff; text-decoration: none; }
.vj-topbar a:hover { color: var(--mau2); }
.vj-topbar .top-col { display: flex; flex-wrap: wrap; gap: 4px 18px; align-items: center; }
.vj-topbar .top-col.right { justify-content: flex-end; }
.vj-topbar .item i { margin-right: 4px; }
.vj-topbar .vj-quick a { font-weight: 600; }

/* ---------- Header / logo chữ ---------- */
.vj-mainnav { border-bottom: 3px solid var(--mau1); }
.vj-logo-text {
    display: inline-block;
    line-height: 1;
    font-weight: 800;
    font-size: 26px;
    color: var(--mau1);
    letter-spacing: 1px;
}
.vj-logo-text span { color: #1d7a3e; }
.vj-logo-text em {
    display: block;
    font-size: 12px;
    font-style: italic;
    color: #1d7a3e;
    margin-top: 3px;
}
.vj-mainnav .navbar-nav .nav-link {
    color: var(--mau4);
    font-weight: 700;
    text-transform: uppercase;
    font-size: 14px;
}
.vj-mainnav .navbar-nav .nav-link:hover { color: var(--mau1); }

/* Desktop: menu 1 hàng, cỡ chữ lớn, dàn đều lấp kín khoảng trống 2 bên */
@media (min-width: 992px) {
    .vj-mainnav .navbar-collapse { flex-grow: 1; }
    .vj-mainnav .navbar-nav {
        flex-wrap: nowrap; width: 100%;
        justify-content: space-evenly; align-items: center;
    }
    .vj-mainnav .navbar-nav > li > .nav-link {
        white-space: nowrap;
        font-size: 15.5px;
        padding-left: 15px; padding-right: 15px;
    }
    .vj-mainnav .navbar-nav > li > .nav-link .fa,
    .vj-mainnav .navbar-nav > li > .nav-link .fas { margin-left: 3px; }
    .vj-mainnav .search-box-wrap .search-input { width: 170px; }

    /* ===== Mega menu 3 cột cho "Tour" (class vj-mega) ===== */
    .vj-mainnav .vj-mega { position: static; }
    .vj-mainnav .vj-mega > .dropdown-menu {
        display: none;
        position: absolute; top: 100%; left: 0; right: 0; width: 100%;
        flex-direction: row; flex-wrap: nowrap; gap: 34px;
        padding: 22px 30px 24px;
        margin: 0; border: none; border-top: 3px solid var(--mau1);
        border-radius: 0 0 8px 8px; box-shadow: 0 14px 30px rgba(0,0,0,.16);
        background: #fff;
        max-height: 74vh; overflow-y: auto;
    }
    .vj-mainnav .vj-mega:hover > .dropdown-menu,
    .vj-mainnav .vj-mega.show > .dropdown-menu { display: flex !important; }
    /* mỗi mục cấp 2 = 1 cột */
    .vj-mainnav .vj-mega > .dropdown-menu > li {
        display: block !important; position: static;
        flex: 1 1 0; min-width: 0; background: transparent; border: none; box-shadow: none;
    }
    .vj-mainnav .vj-mega > .dropdown-menu > li.vj-col-wide { flex: 1.8 1 0; }
    /* tiêu đề cột */
    .vj-mainnav .vj-mega > .dropdown-menu > li > .dropdown-item,
    .vj-mainnav .vj-mega > .dropdown-menu > li > .dropdown-toggle {
        font-size: 14px; font-weight: 800; color: var(--mau1);
        text-transform: uppercase; padding: 0 0 9px; margin-bottom: 10px;
        border-bottom: 2px solid var(--mau2); white-space: normal; background: transparent;
    }
    .vj-mainnav .vj-mega .dropdown-toggle::after { display: none; }
    /* danh sách cấp 3 = luôn hiện, tĩnh */
    .vj-mainnav .vj-mega > .dropdown-menu > li > .dropdown-menu {
        display: block !important; position: static; float: none;
        border: none; box-shadow: none; padding: 0; margin: 0; background: transparent; min-width: 0;
    }
    .vj-mainnav .vj-mega > .dropdown-menu > li.vj-col-wide > .dropdown-menu {
        column-count: 2; column-gap: 24px;
    }
    .vj-mainnav .vj-mega > .dropdown-menu > li > .dropdown-menu > li { display: block; break-inside: avoid; }
    .vj-mainnav .vj-mega > .dropdown-menu > li > .dropdown-menu .dropdown-item {
        padding: 5px 0; font-size: 13px; color: #444; text-transform: none; font-weight: 500; white-space: normal;
    }
    .vj-mainnav .vj-mega > .dropdown-menu > li > .dropdown-menu .dropdown-item:hover {
        color: var(--mau1); background: transparent; padding-left: 4px;
    }
    /* ----- Cấp 3 là NHÓM (châu lục / miền): áp cho cả 2 cột ----- */
    .vj-mainnav .vj-mega > .dropdown-menu > li > .dropdown-menu > li.menu-item-has-children {
        display: block !important; position: static; float: none;
        margin-bottom: 14px; break-inside: avoid;
        background: transparent; border: none; box-shadow: none; min-width: 0;
    }
    /* tiêu đề nhóm (nhãn hoặc link) */
    .vj-mainnav .vj-mega > .dropdown-menu > li > .dropdown-menu > li.menu-item-has-children > .dropdown-item,
    .vj-mainnav .vj-mega > .dropdown-menu > li > .dropdown-menu > li.menu-item-has-children > .dropdown-toggle {
        font-size: 12px; font-weight: 800; color: var(--mau4);
        text-transform: uppercase; letter-spacing: .3px;
        padding: 0 0 5px; margin-bottom: 6px;
        border-bottom: 1px dashed var(--mau2);
        display: block; white-space: normal; background: transparent;
    }
    /* nhãn châu lục nhiều nước = không bấm được */
    .vj-mainnav .vj-mega .vj-nolink > .dropdown-item,
    .vj-mainnav .vj-mega .vj-nolink > .dropdown-toggle { pointer-events: none; cursor: default; }
    /* mục chính là LINK trực tiếp (Phú Quốc, An Giang…) = style tiêu đề như nhóm miền */
    .vj-mainnav .vj-mega > .dropdown-menu > li > .dropdown-menu > li.vj-place {
        display: block !important; position: static; float: none;
        margin-bottom: 14px; break-inside: avoid; background: transparent;
    }
    .vj-mainnav .vj-mega > .dropdown-menu > li > .dropdown-menu > li.vj-place > .dropdown-item {
        font-size: 12px; font-weight: 800; color: var(--mau4);
        text-transform: uppercase; letter-spacing: .3px;
        padding: 0 0 5px; margin-bottom: 0;
        border-bottom: 1px dashed var(--mau2);
        display: block; white-space: normal; background: transparent;
    }
    .vj-mainnav .vj-mega > .dropdown-menu > li > .dropdown-menu > li.vj-place > .dropdown-item:hover {
        color: var(--mau1); padding-left: 0;
    }
    /* danh sách cấp 4 (nước / điểm đến) */
    .vj-mainnav .vj-mega > .dropdown-menu > li > .dropdown-menu > li.menu-item-has-children > .dropdown-menu {
        display: block !important; position: static; float: none; min-width: 0;
        border: none; box-shadow: none; padding: 0; margin: 0; background: transparent; column-count: 1;
    }
    .vj-mainnav .vj-mega > .dropdown-menu > li > .dropdown-menu > li.menu-item-has-children > .dropdown-menu > li { display: block; }
}

/* ---------- Section chung ---------- */
.vj-section-title {
    color: var(--mau1);
    font-weight: 800;
    font-size: 26px;
    text-transform: uppercase;
    margin: 34px 0 22px;
    display: flex;
    align-items: center;
    gap: 10px;
}
.vj-center { text-align: center; margin: 6px 0 30px; }
.vj-btn-gold {
    display: inline-block;
    background: var(--mau2);
    color: #fff;
    font-weight: 700;
    letter-spacing: .5px;
    padding: 11px 34px;
    border: none;
    border-radius: 4px;
    text-transform: uppercase;
    text-decoration: none;
    transition: background .2s;
    cursor: pointer;
}
.vj-btn-gold:hover { background: var(--mau4); color: #fff; }

/* ---------- 1. Slider ---------- */
#vj-main-slider .item img { width: 100%; height: auto; display: block; }
#vj-main-slider .owl-nav .owl-prev,
#vj-main-slider .owl-nav .owl-next {
    position: absolute; top: 50%; transform: translateY(-50%);
    width: 46px; height: 46px; border-radius: 50%;
    background: rgba(0,0,0,.26) !important;
    color: rgba(255,255,255,.9) !important; font-size: 18px !important;
    display: flex; align-items: center; justify-content: center;
    opacity: .7; transition: background .2s, opacity .2s;
}
#vj-main-slider .owl-nav .owl-prev:hover,
#vj-main-slider .owl-nav .owl-next:hover { background: rgba(0,0,0,.5) !important; opacity: 1; }
#vj-main-slider .owl-nav .owl-prev { left: 14px; }
#vj-main-slider .owl-nav .owl-next { right: 14px; }

/* ---------- 2. Tìm tour (bố cục 1 hàng kiểu Luavietours, nền đỏ Vietjet) ---------- */
/* Dòng 1: tab loại tour */
.vjs-row1 { margin-bottom: 14px; }
.vjs-tabs { display: inline-flex; background: rgba(255,255,255,.14); border-radius: 30px; padding: 4px; }
.vjs-tab {
    display: flex; align-items: center; gap: 7px;
    margin: 0; padding: 9px 22px; border-radius: 24px;
    color: #fff; font-size: 14.5px; font-weight: 700;
    cursor: pointer; transition: background .15s, color .15s; white-space: nowrap;
}
.vjs-tab i { font-size: 15px; }
.vjs-tab.active { background: #fff; color: var(--mau1); }
.vjs-tab input { display: none; }
/* Dòng 2: 3 ô + nút */
.vjs-row2 {
    display: grid;
    grid-template-columns: 1fr 1.2fr 0.9fr auto auto;
    gap: 12px;
    align-items: end;
}
.vjs-row2 > * { min-width: 0; }
.vjs-field label { display: block; font-size: 13.5px; margin-bottom: 5px; color: #fde9d9; }
.vjs-field select,
.vjs-field input[type=date],
.vjs-field input[type=text],
.vjs-field input[type=tel],
.vjs-field input[type=number] {
    width: 100%; height: 48px; border: none; border-radius: 12px;
    padding: 0 14px; font-size: 14.5px; background: #fff; color: #333; box-sizing: border-box;
    min-width: 0;
}
.vjs-submit .vj-btn-gold { height: 48px; padding: 0 30px; white-space: nowrap; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.vjs-vertical .vjs-field { margin-bottom: 10px; }
/* Autocomplete điểm đến nước ngoài */
.vjs-autocomplete { position: relative; }
.vjs-autocomplete .vjs-ac-input {
    width: 100%; height: 48px; border: none; border-radius: 12px;
    padding: 0 14px; font-size: 14.5px; background: #fff; color: #333;
}
.vjs-ac-list {
    position: absolute; top: calc(100% + 4px); left: 0; right: 0; z-index: 50;
    background: #fff; border-radius: 6px; box-shadow: 0 10px 30px rgba(0,0,0,.22);
    max-height: 260px; overflow-y: auto;
    list-style: none; margin: 0; padding: 6px 0;
}
.vjs-ac-list li {
    padding: 9px 14px; font-size: 14px; color: #333; cursor: pointer;
}
.vjs-ac-list li:hover { background: var(--mau3); color: var(--mau1); font-weight: 700; }

/* Dropdown "Điểm đi" — 1 khung cố định xổ xuống dưới (thay native select) */
.vjs-dropdown { position: relative; }
.vjs-dd-toggle {
    display: flex; align-items: center; justify-content: space-between; gap: 8px;
    height: 48px; background: #fff; color: #333; border-radius: 12px;
    padding: 0 14px; font-size: 14.5px; cursor: pointer; user-select: none;
}
.vjs-dd-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vjs-dd-label.is-placeholder { color: #757575; }
.vjs-dd-toggle i { color: #888; font-size: 12px; transition: transform .2s; flex-shrink: 0; }
.vjs-dropdown.open .vjs-dd-toggle i { transform: rotate(180deg); }
.vjs-dd-list li.sel { background: var(--mau3); color: var(--mau1); font-weight: 700; }
/* Dropdown nhóm (Điểm đến nước ngoài — heading châu lục không bấm được) */
.vjs-dd-grouped li.vjs-dd-group {
    padding: 8px 14px 4px; margin-top: 4px;
    font-size: 11.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .6px;
    color: var(--mau1); background: transparent; cursor: default;
    border-top: 1px solid #f0e6d6;
}
.vjs-dd-grouped li.vjs-dd-group:hover { background: transparent; color: var(--mau1); font-weight: 800; }
.vjs-dd-grouped li.vjs-dd-group:first-child, .vjs-dd-grouped li:first-child + li.vjs-dd-group { border-top: none; }
.vjs-dd-grouped li:not(.vjs-dd-group) { padding-left: 22px; } /* thụt lề nước dưới nhóm */
/* Ô tìm nhanh trong dropdown */
.vjs-dd-searchbox {
    position: absolute; top: calc(100% + 4px); left: 0; right: 0; z-index: 51;
    background: #fff; padding: 8px; border-radius: 6px 6px 0 0;
    border-bottom: 1px solid #f0e6d6; box-shadow: 0 -1px 0 #f5efe4;
}
.vjs-dd-searchbox + .vjs-ac-list { top: calc(100% + 52px); border-radius: 0 0 6px 6px; }
.vjs-dd-search { width: 100%; height: 34px; border: 1px solid #e5d9c8; border-radius: 6px; padding: 0 10px; font-size: 13px; color: #333; background: #fff; }
.vjs-dd-search:focus { outline: none; border-color: var(--mau1); }
.vjs-dropdown.open .vjs-dd-searchbox { display: block; }
.vjs-dropdown:not(.open) .vjs-dd-searchbox { display: none; }

/* ---------- Custom Date Picker ---------- */
.vjs-datepick { position: relative; }
.vjs-dp-toggle {
    display: flex; align-items: center; justify-content: space-between; gap: 8px;
    height: 48px; background: #fff; color: #333; border-radius: 12px;
    padding: 0 14px; font-size: 14.5px; cursor: pointer; user-select: none;
}
.vjs-dp-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; }
.vjs-dp-label.is-placeholder { color: #757575; }
.vjs-dp-toggle i { color: #888; font-size: 13px; flex-shrink: 0; }
.vjs-dp-popup {
    position: absolute; top: calc(100% + 6px); left: 50%; transform: translateX(-50%);
    z-index: 300; background: #fff; border-radius: 16px;
    box-shadow: 0 10px 40px rgba(0,0,0,.22);
    padding: 14px; width: 284px;
}
.vjs-dp-header {
    display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px;
}
.vjs-dp-title { font-weight: 700; font-size: 14.5px; color: #1e1e1e; }
.vjs-dp-navbtn {
    background: none; border: 1.5px solid #e0d8d0; border-radius: 50%;
    width: 30px; height: 30px; cursor: pointer; color: #555; font-size: 18px;
    display: flex; align-items: center; justify-content: center; padding: 0; line-height: 1; font-family: inherit;
    transition: background .12s, color .12s, border-color .12s;
}
.vjs-dp-navbtn:hover { background: var(--mau3); color: var(--mau1); border-color: var(--mau1); }
.vjs-dp-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.vjs-dp-dh { text-align: center; font-size: 11px; font-weight: 700; color: #aaa; padding: 4px 0 6px; }
.vjs-dp-cell {
    text-align: center; font-size: 13px; color: #1e1e1e;
    padding: 7px 0; border-radius: 8px; cursor: pointer;
    border: none; background: none; font-family: inherit; line-height: 1;
    transition: background .12s, color .12s;
}
.vjs-dp-cell:hover:not(:disabled):not(.vjs-dp-sel) { background: var(--mau3); color: var(--mau1); }
.vjs-dp-cell:disabled { color: #d8d8d8; cursor: default; }
.vjs-dp-cell.vjs-dp-today:not(.vjs-dp-sel) { color: var(--mau1); font-weight: 700; }
.vjs-dp-cell.vjs-dp-sel { background: var(--mau1) !important; color: #fff !important; font-weight: 700; border-radius: 50%; }
.vjs-dp-footer {
    display: flex; justify-content: space-between; align-items: center;
    margin-top: 10px; padding-top: 10px; border-top: 1px solid #f0ece5;
}
.vjs-dp-reset { background: none; border: none; color: #888; font-size: 13px; cursor: pointer; padding: 4px 0; font-family: inherit; }
.vjs-dp-reset:hover { color: var(--mau1); }
.vjs-dp-confirm {
    background: var(--mau1); color: #fff; border: none;
    width: 36px; height: 36px; border-radius: 50%; cursor: pointer; font-size: 14px;
    display: flex; align-items: center; justify-content: center;
}
.vjs-vertical .vjs-dp-popup { left: 0; transform: none; width: 100%; }

/* Sidebar filter — accordion Điểm đến nước ngoài */
.vjs-acc { background: #fff; border: 1px solid #ecdcc4; border-radius: 8px; overflow: hidden; }
.vjs-acc-item { border-bottom: 1px solid #f2e8d6; }
.vjs-acc-item:last-child { border-bottom: none; }
.vjs-acc-head {
    display: flex; align-items: center; gap: 6px; cursor: pointer; list-style: none;
    padding: 10px 12px; font-size: 13.5px; font-weight: 700; color: var(--mau4);
    background: var(--mau3); transition: background .15s;
}
.vjs-acc-head::-webkit-details-marker { display: none; }
.vjs-acc-head:hover { background: #efe6d5; color: var(--mau1); }
.vjs-acc-head em { flex: 1; font-style: normal; font-weight: 500; color: #888; font-size: 12px; }
.vjs-acc-head i { color: #999; font-size: 11px; transition: transform .2s; }
.vjs-acc-item[open] > .vjs-acc-head i { transform: rotate(180deg); }
.vjs-acc-item[open] > .vjs-acc-head { background: #fff; color: var(--mau1); }
.vjs-acc-body { list-style: none; margin: 0; padding: 4px 0 8px; background: #fff; }
.vjs-acc-body li a {
    display: flex; align-items: center; padding: 7px 14px 7px 22px;
    color: #444; font-size: 13px; text-decoration: none; transition: color .15s, background .15s;
}
.vjs-acc-body li a:hover { background: var(--mau3); color: var(--mau1); }
.vjs-acc-body li a.active { color: var(--mau1); font-weight: 700; background: var(--mau3); }
.vjs-acc-count {
    margin-left: auto; background: #f0e6d6; color: var(--mau4);
    font-size: 11px; font-weight: 700; padding: 1px 8px; border-radius: 10px;
}
.vjs-acc-body li a.active .vjs-acc-count { background: var(--mau1); color: #fff; }

/* Bản dọc cho sidebar danh mục */
.vjs-vertical .vjs-row2 { grid-template-columns: 1fr; align-items: stretch; }
.vjs-vertical.vj-search-box { padding: 18px; }
.vjs-vertical .vj-search-title { font-size: 17px; }
/* Sidebar Shop hẹp (~248px): xếp 2 tab thành 2 dòng để không tràn mép phải */
.vjs-vertical .vjs-tabs { display: flex; flex-direction: column; gap: 6px; border-radius: 14px; padding: 6px; }
.vjs-vertical .vjs-tab { flex: none; width: 100%; justify-content: center; padding: 9px 12px; font-size: 13.5px; border-radius: 10px; }
.vjs-vertical .vjs-submit .vj-btn-gold { width: 100%; }
/* Bộ chọn số khách trong form tìm tour */
.vjs-field-guests .vjs-qty-wrap {
    display: flex; align-items: stretch; height: 48px;
    background: #fff; border-radius: 12px; overflow: hidden;
}
.vjs-field-guests .vjs-qty-btn {
    width: 34px; border: none; background: #fff; color: var(--mau1);
    font-size: 20px; font-weight: 800; cursor: pointer; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    transition: background .15s; line-height: 1; padding: 0;
}
.vjs-field-guests .vjs-qty-btn:hover { background: #fdf0e8; }
.vjs-field-guests .vjs-qty-inp {
    width: 38px; text-align: center; border: none;
    border-left: 1px solid #e8ddd4; border-right: 1px solid #e8ddd4;
    font-size: 15px; font-weight: 700; color: var(--mau4);
    -moz-appearance: textfield; padding: 0; background: #fff;
}
.vjs-field-guests .vjs-qty-inp::-webkit-outer-spin-button,
.vjs-field-guests .vjs-qty-inp::-webkit-inner-spin-button { -webkit-appearance: none; }
@media (max-width: 767px) { .vjs-horizontal .vjs-field-guests { display: none; } }
.mt-3 { margin-top: 16px; }
/* Thanh kéo ngân sách (dual range) */
.vjs-price-vals { display: flex; justify-content: space-between; font-size: 13px; color: #fff; font-weight: 700; margin-bottom: 8px; }
.vjs-range { position: relative; height: 30px; }
.vjs-range-track { position: absolute; top: 13px; left: 8px; right: 8px; height: 4px; background: rgba(255,255,255,.3); border-radius: 3px; }
.vjs-range-fill { position: absolute; top: 0; bottom: 0; background: var(--mau2); border-radius: 3px; }
.vjs-range input[type=range] {
    position: absolute; top: 0; left: 0; width: 100%; height: 30px; margin: 0;
    -webkit-appearance: none; appearance: none; background: none; pointer-events: none;
}
.vjs-range input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none; appearance: none; pointer-events: auto;
    width: 18px; height: 18px; border-radius: 50%; background: #fff; border: 3px solid var(--mau2);
    cursor: pointer; box-shadow: 0 1px 4px rgba(0,0,0,.3);
}
.vjs-range input[type=range]::-moz-range-thumb {
    pointer-events: auto; width: 16px; height: 16px; border-radius: 50%; background: #fff; border: 3px solid var(--mau2); cursor: pointer;
}
.vjs-range input[type=range]::-webkit-slider-runnable-track { background: none; border: none; }
.vjs-range input[type=range]::-moz-range-track { background: none; }
@media (max-width: 991px) {
    .vjs-tabs { display: flex; }
    .vjs-tab { flex: 1; justify-content: center; }
}
@media (max-width: 767px) {
    .vjs-row2 { grid-template-columns: 1fr 1fr; }
    .vjs-submit { grid-column: 1 / -1; }
    .vjs-submit .vj-btn-gold { width: 100%; }
}
@media (max-width: 575px) {
    .vjs-row2 { grid-template-columns: 1fr; }
}

/* ---------- 2b. Tìm tour (kiểu cũ, giữ cho khối khác) ---------- */
#vj-search-bar { margin-top: -38px; position: relative; z-index: 5; }
@media (max-width: 767px) { #vj-search-bar { margin-top: 12px; } }
.vj-search-box {
    background: var(--mau1);
    border-radius: 20px;
    padding: 24px 30px 28px;
    box-shadow: 0 14px 38px rgba(0,0,0,.24);
    color: #fff;
}
.vj-search-title {
    color: #fff; font-size: 22px; font-weight: 800;
    text-transform: uppercase; margin-bottom: 14px;
    display: flex; align-items: center; gap: 8px;
}
.vj-search-box label { display: block; font-size: 14px; margin-bottom: 5px; color: #fde9d9; }
.vj-search-box input[type=text],
.vj-search-box select {
    width: 100%; height: 44px; border: none; border-radius: 4px;
    padding: 0 12px; font-size: 15px; background: #fff; color: #333;
}
.vj-search-submit { display: flex; align-items: flex-end; }
.vj-search-submit .vj-btn-gold { width: 100%; height: 44px; padding: 0; }

/* ---------- 3. Card tour ---------- */
.vj-tour-card {
    background: #fff;
    border: 1px solid #eee;
    border-radius: 8px;
    overflow: hidden;
    height: 100%;
    display: flex;
    flex-direction: column;
    box-shadow: 0 2px 10px rgba(0,0,0,.06);
    transition: transform .2s, box-shadow .2s;
}
.vj-tour-card:hover { transform: translateY(-6px) scale(1.025); box-shadow: 0 16px 34px rgba(0,0,0,.18); z-index: 2; }
.vj-tour-thumb { display: block; overflow: hidden; aspect-ratio: var(--vj-card-ratio, 700/450); }
.vj-tour-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; }
.vj-tour-card:hover .vj-tour-thumb img { transform: scale(1.1); }
.vj-tour-body { padding: 14px 16px 16px; display: flex; flex-direction: column; flex: 1; }
.vj-tour-title { margin: 0 0 8px; font-size: 15px; line-height: 1.45; min-height: 44px; }
.vj-tour-title a {
    color: var(--mau4); font-weight: 700; text-decoration: none;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
    text-transform: uppercase;
}
.vj-tour-title a:hover { color: var(--mau1); }
/* Meta card: mỗi loại thông tin 1 dòng riêng, dòng thiếu dữ liệu đã được ẩn ở PHP */
.vj-tour-meta { display: flex; flex-direction: column; gap: 5px; font-size: 13px; color: #555; margin-bottom: 8px; }
.vj-meta-row { display: flex; align-items: center; gap: 7px; line-height: 1.3; }
.vj-meta-row i { color: var(--mau2); width: 15px; text-align: center; flex-shrink: 0; }
.vj-meta-row span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* Dùng ở trang chi tiết (dòng thông tin cơ bản) */
.vj-transport-icons i { color: var(--mau2); margin: 0 3px; }
.vj-tp-item { white-space: nowrap; margin-right: 8px; }
.vj-tp-item em { font-style: normal; color: #555; font-size: 12.5px; }
.vj-single-basics .vj-tp-item em { font-size: 14px; font-weight: 700; color: #333; }
.vj-tour-meta i, .vj-tour-departure i { color: var(--mau2); margin-right: 4px; }
.vj-tour-departure { font-size: 13px; color: #666; margin-bottom: 10px; }
.vj-tour-footer {
    margin-top: auto; display: flex; justify-content: space-between; align-items: flex-end;
    border-top: 1px dashed #e5d9c8; padding-top: 10px;
}
.vj-tour-price .label { display: block; font-size: 12px; color: #888; }
.vj-price { color: var(--mau1); font-weight: 800; font-size: 19px; }
.vj-price.contact { font-size: 17px; }
.vj-btn-detail {
    background: var(--mau1); color: #fff; font-size: 13px; font-weight: 700;
    padding: 8px 16px; border-radius: 4px; text-decoration: none; white-space: nowrap;
}
.vj-btn-detail:hover { background: var(--mau4); color: #fff; }

/* ─── Tour nổi bật ─── */
#vj-featured-tours { padding: 48px 0 40px; background: #f7f8fb; position: relative; }
#vj-featured-tours .container { padding-left: 60px; padding-right: 60px; }
.vj-ft-head { display: flex; align-items: flex-end; justify-content: flex-start; margin-bottom: 24px; gap: 16px; }
.vj-ft-eyebrow { display: block; font-size: 11px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: var(--mau2); margin-bottom: 4px; }
.vj-ft-section-title { font-size: 22px; font-weight: 800; color: var(--mau4); margin: 0; text-transform: uppercase; letter-spacing: .5px; }
.vj-ft-section-title i { color: var(--mau1); margin-right: 8px; }
/* Card */
.vj-ft-card {
    background: #fff; border-radius: 6px; overflow: hidden;
    border: 1px solid #eee;
    display: flex; flex-direction: column; height: 100%;
    transition: transform .22s, box-shadow .22s;
}
.vj-ft-card:hover { transform: translateY(-4px); box-shadow: 0 10px 28px rgba(0,0,0,.11); }
.vj-ft-thumb { display: block; position: relative; overflow: hidden; aspect-ratio: 16/10; }
.vj-ft-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; display: block; }
.vj-ft-card:hover .vj-ft-thumb img { transform: scale(1.06); }
/* Soldout label (chỉ hiện khi hết chỗ) */
.vj-ft-soldout-lbl {
    position: absolute; top: 10px; right: 10px;
    background: rgba(0,0,0,.55); color: #fff;
    font-size: 11px; font-weight: 700;
    padding: 3px 9px; border-radius: 4px; z-index: 2;
}
.vj-ft-body { padding: 14px 16px 16px; display: flex; flex-direction: column; flex: 1; }
.vj-ft-name { margin: 0 0 10px; font-size: 14px; font-weight: 800; line-height: 1.4; }
.vj-ft-name a {
    color: var(--mau1); text-decoration: none;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
    overflow: hidden; text-transform: uppercase;
}
.vj-ft-name a:hover { color: var(--mau4); }
.vj-ft-meta { display: flex; flex-wrap: wrap; gap: 4px 18px; font-size: 13px; color: #555; margin-bottom: 12px; }
.vj-ft-meta-item { display: flex; align-items: center; gap: 6px; }
.vj-ft-meta-item i { color: #888; width: 13px; text-align: center; flex-shrink: 0; }
.vj-ft-footer { margin-top: auto; }
.vj-ft-price-label { display: block; font-size: 12px; color: #888; margin-bottom: 2px; }
.vj-ft-price-wrap .vj-price { font-size: 20px; font-weight: 800; color: var(--mau1); }
/* Carousel items — equal-height cards */
.vj-owl-featured .owl-stage { display: flex; align-items: stretch; }
.vj-owl-featured .owl-item { display: flex; flex-direction: column; }
.vj-owl-featured .item { padding: 6px 8px; flex: 1; display: flex; flex-direction: column; }
.vj-owl-featured .vj-ft-card { flex: 1; }
/* Override Owl default: img{width:auto} → ảnh phải lấp đầy khung */
.vj-owl-featured .owl-item .vj-ft-thumb img { width: 100%; height: 100%; object-fit: cover; }
/* Pagination dots — cách đều card và nút xem tất cả */
.vj-owl-featured .owl-dots { position: static !important; margin-top: 20px; padding-bottom: 4px; text-align: center; }
/* Nav arrows — circle, căn giữa bằng flex */
.vj-owl-featured .owl-nav .owl-prev,
.vj-owl-featured .owl-nav .owl-next {
    position: absolute; top: 32%; transform: translateY(-50%);
    width: 40px; height: 40px; border-radius: 50%;
    display: inline-flex !important; align-items: center; justify-content: center;
    background: rgba(255,255,255,.95) !important;
    box-shadow: 0 2px 12px rgba(0,0,0,.18);
    color: #333 !important; font-size: 14px !important;
    transition: background .18s, color .18s, box-shadow .18s;
    border: none !important; cursor: pointer;
}
.vj-owl-featured .owl-nav .owl-prev:hover,
.vj-owl-featured .owl-nav .owl-next:hover {
    background: var(--mau1) !important; color: #fff !important;
    box-shadow: 0 4px 16px rgba(0,0,0,.22);
}
.vj-owl-featured .owl-nav .owl-prev { left: -50px; }
.vj-owl-featured .owl-nav .owl-next { right: -50px; }
.vj-owl-featured .owl-nav .disabled { opacity: .3; pointer-events: none; }
.vj-ft-bottom { text-align: center; margin-top: 24px; }
/* SKU — ẩn trên desktop */
.vj-ft-sku { display: none; }
/* Giá gốc gạch ngang — ẩn trên desktop */
.vj-ft-price-original { display: none; }

@media (max-width: 991px) {
    #vj-featured-tours .container { padding-left: 40px; padding-right: 40px; }
    .vj-owl-featured .owl-nav .owl-prev { left: -30px; }
    .vj-owl-featured .owl-nav .owl-next { right: -30px; }
}
@media (max-width: 575px) {
    #vj-featured-tours { padding: 32px 0 28px; }
    #vj-featured-tours .container { padding-left: 20px; padding-right: 20px; }
    .vj-ft-section-title { font-size: 18px; }
    .vj-owl-featured .owl-nav .owl-prev { left: -16px; }
    .vj-owl-featured .owl-nav .owl-next { right: -16px; }
}

/* ── Mobile ≤767px: Section trắng + card peek carousel ── */
@media (max-width: 767px) {
    /* Section: nền trắng */
    #vj-featured-tours {
        background: #fff;
        padding: 28px 0 24px;
    }
    /* Container: bỏ padding ngang để carousel tràn viền */
    #vj-featured-tours .container {
        padding-left: 0;
        padding-right: 0;
    }
    /* Tiêu đề section: màu gốc */
    #vj-featured-tours .vj-ft-head { padding: 0 18px; margin-bottom: 18px; }
    .vj-ft-eyebrow { color: var(--mau2); }
    .vj-ft-section-title { color: var(--mau4); font-size: 18px; }
    .vj-ft-section-title i { color: var(--mau1); }
    /* Nút xem tất cả */
    .vj-ft-bottom { padding: 0 18px; margin-top: 0; }

    /* Item wrapper: padding trái cho card, padding dưới vừa đủ cho shadow */
    .vj-owl-featured .item { padding: 4px 6px 12px 18px; }

    /* Card: trắng, bo góc, shadow */
    .vj-ft-card {
        border-radius: 14px;
        border: none;
        box-shadow: 0 4px 18px rgba(0,0,0,.14);
        height: auto;
    }
    .vj-ft-card:hover { transform: none; box-shadow: 0 4px 18px rgba(0,0,0,.14); }

    /* Ảnh: tỉ lệ 3:2, bo góc trên */
    .vj-ft-thumb {
        aspect-ratio: 3/2;
        border-radius: 14px 14px 0 0;
    }

    /* Nội dung card */
    .vj-ft-body { padding: 12px 14px 14px; }

    /* SKU */
    .vj-ft-sku {
        display: block;
        font-size: 10px;
        color: #aaa;
        margin-bottom: 5px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .vj-ft-sku i { margin-right: 3px; }

    /* Tiêu đề tour */
    .vj-ft-name {
        font-size: 13.5px;
        font-weight: 700;
        margin-bottom: 8px;
    }
    .vj-ft-name a { text-transform: none; }

    /* Meta */
    .vj-ft-meta { font-size: 11.5px; gap: 3px 14px; margin-bottom: 10px; }

    /* Giá gốc gạch ngang */
    .vj-ft-price-original {
        display: block;
        font-size: 11.5px;
        color: #bbb;
        text-decoration: line-through;
        margin-bottom: 1px;
    }
    .vj-ft-price-label { font-size: 11px; }
    .vj-ft-price-wrap .vj-price { font-size: 18px; }

    /* Ẩn nav arrows trên mobile */
    .vj-owl-featured .owl-nav { display: none !important; }
}

/* ---------- 4. Điểm đến hấp dẫn ---------- */
/* ── Section Điểm Đến Hấp Dẫn ── */
#vj-destinations {
    padding: 56px 0 0;
    background: #FCFAF7;
}
.vj-dest-bg-wrap {
    background: url('../images/dest.jpg') center -30px / 100% auto no-repeat;
}

/* Header */
.vj-dest-head { text-align: center; margin-bottom: 44px; }
.vj-dest-eyebrow { display: inline-block; font-style: italic; color: var(--mau1); font-size: 16px; margin-bottom: 8px; }
.vj-dest-heading { font-size: 30px; font-weight: 800; color: #1a1a1a; margin: 0 0 12px; line-height: 1.3; text-transform: uppercase; }
.vj-dest-heading .vj-red { white-space: nowrap; }
.vj-red { color: var(--mau1); }
.vj-dest-lead { color: #555; font-size: 14.5px; line-height: 1.7; max-width: 520px; margin: 0 auto 14px; }
.vj-dest-head-line { display: block; width: 48px; height: 3px; background: var(--mau1); border-radius: 2px; margin: 0 auto; }

/* Body: 2 cột + khoảng giữa (ảnh nền vẽ máy bay) */
.vj-dest-body { display: flex; align-items: stretch; padding-top: 32px; }
.vj-dest-col { flex: 1; min-width: 0; }

/* Column header */
.vj-dest-col-hdr { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 24px; }
.vj-dest-pin { color: var(--mau1); font-size: 22px; margin-top: 3px; flex-shrink: 0; }
.vj-dest-col-hdr-text strong { display: block; font-size: 14px; font-weight: 800; letter-spacing: .8px; color: var(--mau1); text-transform: uppercase; }
.vj-dest-col-hdr-text span { display: block; font-size: 12.5px; color: #888; margin-top: 3px; }
.vj-dest-hdr-line { display: none; }
/* Desktop: ảnh nền mới không có pin → hiển thị icon, căn DOM header về phải (cạnh circle) */
@media (min-width: 992px) {
    .vj-dest-col--dom .vj-dest-col-hdr { justify-content: flex-end; }
    .vj-dest-col--dom .vj-dest-col-hdr-text { text-align: right; }
    .vj-dest-col--dom .vj-dest-hdr-line { margin-left: auto; }
    /* Cột dọc để header/footer 2 cột ngang hàng nhau */
    .vj-dest-col { display: flex; flex-direction: column; }
    /* Header cùng min-height để cả 2 cột bắt đầu list ở cùng vị trí dọc */
    .vj-dest-col-hdr { min-height: 56px; }
    /* space-between: 3 item trải đều từ đầu đến cuối list — khoảng cách tự đồng bộ */
    .vj-dest-list { flex: 1; display: flex; flex-direction: column; justify-content: space-between; padding: 8px 0; }
    .vj-dest-list--dom { justify-content: space-between; padding-top: 32px; }
    .vj-dest-list--for { justify-content: space-between; padding-top: 32px; }
    /* Column widths: plane co dãn linh hoạt, col_for cố định đủ chỗ cho nội dung */
    .vj-dest-col--dom { flex: none; width: calc(30% + 56px); min-width: 0; }
    .vj-dest-plane { flex: 1; min-width: 0; }
    .vj-dest-col--for { flex: none; width: calc(30% + 56px); min-width: 0; }
    /* FOR items thẳng hàng, cách đều giống DOM */
    .vj-dest-row--for { padding: 12px 0; }
    /* DOM circles không đè lên đường cong nét đứt — tăng padding-right để circles lùi sang trái */
    .vj-dest-row--dom { padding-right: 110px; }
    /* Nút xem thêm xích lên */
    .vj-dest-col-footer { margin-top: 10px; }
}

/* Destination list */
.vj-dest-list { position: relative; }

/* Destination row */
.vj-dest-row {
    display: flex; align-items: center; gap: 16px;
    text-decoration: none; color: inherit;
    position: relative; z-index: 1;
    width: 100%; padding: 12px 0;
    transition: opacity .2s;
}
.vj-dest-row:hover { opacity: .85; }
.vj-dest-row--dom { flex-direction: row; justify-content: flex-end; }
.vj-dest-row--for { flex-direction: row; padding: 7px 0; }

/* Text block */
.vj-dest-row-text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 5px; }
.vj-dest-row--dom .vj-dest-row-text { max-width: 175px; align-items: flex-end; text-align: right; }
.vj-dest-row--for  .vj-dest-row-text { max-width: 175px; align-items: flex-start; text-align: left; }
.vj-dest-name { display: block; font-size: 15px; font-weight: 700; color: #1a1a1a; }
.vj-dest-desc { display: block; font-size: 12.5px; color: #777; line-height: 1.55; }
.vj-dest-arrow-btn {
    display: inline-flex; align-items: center; justify-content: center;
    width: 28px; height: 28px; border-radius: 50%;
    background: var(--mau1); color: #fff; font-size: 10px; flex-shrink: 0;
    transition: background .2s; margin-top: 2px;
}
.vj-dest-row--dom .vj-dest-arrow-btn { align-self: flex-end; }
.vj-dest-row--for .vj-dest-arrow-btn { align-self: flex-start; }
.vj-dest-row:hover .vj-dest-arrow-btn { background: #bf0f29; }

/* Circle image */
.vj-dest-circle {
    flex-shrink: 0; border-radius: 50%;
    background-size: cover; background-position: center;
    border: 4px solid #fff; box-shadow: 0 4px 20px rgba(0,0,0,.18);
    position: relative; z-index: 2;
    transition: transform .3s, box-shadow .3s;
}
/* DOM & FOR: mỗi bên 3 rows × (112px + 24px padding) ≈ cân bằng */
.vj-dest-circle--dom { width: 112px; height: 112px; }
.vj-dest-circle--for { width: 112px; height: 112px; }
.vj-dest-row:hover .vj-dest-circle { transform: scale(1.05); box-shadow: 0 8px 26px rgba(0,0,0,.22); }

/* Khoảng giữa — ảnh nền đã vẽ máy bay, div này chỉ là spacer */
.vj-dest-plane { flex-shrink: 0; width: 200px; }

/* CTA button */
.vj-dest-col-footer { text-align: center; margin-top: 22px; }
.vj-dest-cta {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 10px 24px; border: 1.5px solid var(--mau1);
    border-radius: 28px; color: var(--mau1); background: rgba(255,255,255,.9);
    font-size: 13.5px; font-weight: 600; text-decoration: none;
    transition: background .2s, color .2s;
}
.vj-dest-cta:hover { background: var(--mau1); color: #fff; }

/* USP bar */
#vj-usp-bar { margin: 0; padding: 0; }
.vj-dest-usps {
    display: flex; margin-top: 0;
    background: var(--mau1); border-radius: 0; overflow: hidden;
}
.vj-dest-usp {
    flex: 1; display: flex; flex-direction: column; align-items: center;
    text-align: center; padding: 26px 18px; gap: 6px; color: #fff;
    border-right: 1px solid rgba(255,255,255,.18);
}
.vj-dest-usp:last-child { border-right: none; }
.vj-usp-icon { font-size: 30px; color: #fff; margin-bottom: 2px; }
.vj-dest-usp strong { font-size: 13px; font-weight: 800; letter-spacing: .5px; }
.vj-dest-usp span { font-size: 12.5px; line-height: 1.5; color: rgba(255,255,255,.82); }


/* Dest scroll-snap dots: hidden on desktop, shown on mobile via media query below */
.vj-dest-dots { display: none; }
.vj-dest-dot {
    display: inline-block;
    width: 8px; height: 8px;
    background: #ccc; border-radius: 50%;
    border: none; margin: 0 4px; padding: 0; cursor: pointer;
    transition: background .2s, width .2s;
    vertical-align: middle;
}
.vj-dest-dot.active { background: var(--mau1); width: 20px; border-radius: 4px; }

/* ── Tablet (768–1024px): destinations + footer ── */
@media (min-width: 768px) and (max-width: 1024px) {

    /* ── Điểm đến: Grid 2 cột đối xứng hoàn toàn ── */

    /* Body: 2 cột bằng nhau, không có plane */
    .vj-dest-body {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 0; padding-top: 20px; align-items: stretch;
    }
    .vj-dest-plane { display: none !important; }

    /* Mỗi cột: header / list / footer, list chiếm toàn bộ khoảng giữa */
    .vj-dest-col {
        flex: unset !important; width: auto !important;
        display: grid !important;
        grid-template-rows: auto 1fr auto !important;
        padding-top: 0 !important; padding-bottom: 0 !important;
    }
    .vj-dest-col--dom { padding-left: 12px !important; padding-right: 20px !important; border-right: 1px solid #e8e0d8; }
    .vj-dest-col--for { padding-left: 20px !important; padding-right: 12px !important; border-right: none !important; }

    /* Column header: cùng min-height để 2 list bắt đầu cùng vị trí */
    .vj-dest-col-hdr {
        display: flex !important; align-items: flex-start; gap: 10px;
        justify-content: flex-start !important;
        margin-bottom: 16px; min-height: 64px; align-self: start;
    }
    .vj-dest-col--dom .vj-dest-col-hdr { justify-content: flex-start !important; }
    .vj-dest-col-hdr-text { text-align: left !important; }
    .vj-dest-col--dom .vj-dest-col-hdr-text { text-align: left !important; }
    .vj-dest-col-hdr-text strong { font-size: 13px; letter-spacing: .5px; }
    .vj-dest-col-hdr-text span { display: block !important; font-size: 12px; color: #888; }
    .vj-dest-hdr-line { display: none !important; }

    /* List: Grid 3 hàng bằng nhau — đồng bộ chiều cao qua 2 cột */
    .vj-dest-list {
        display: grid !important;
        grid-template-rows: repeat(3, 1fr) !important;
        padding: 0 !important; gap: 0 !important;
    }
    .vj-dest-list--dom,
    .vj-dest-list--for { padding-top: 0 !important; justify-content: unset !important; }

    /* Row: Grid [80px circle | 1fr text+arrow] */
    .vj-dest-row,
    .vj-dest-row--dom,
    .vj-dest-row--for {
        display: grid !important;
        grid-template-columns: 80px 1fr !important;
        align-items: center !important;
        gap: 14px !important;
        padding: 10px 0 !important;
        border-bottom: 1px solid #f0ebe3;
        text-align: left !important;
        flex-direction: unset !important;
        justify-content: unset !important;
        min-height: 0 !important;
        position: static !important;
    }
    .vj-dest-row:last-child { border-bottom: none; }

    /* Circle: cột 1 — cả DOM và FOR */
    .vj-dest-circle {
        grid-column: 1 !important; grid-row: 1 !important;
        width: 80px !important; height: 80px !important;
        border-radius: 50% !important; border: 3px solid #fff !important;
        padding-bottom: 0 !important; flex-shrink: unset; order: unset !important;
        align-self: center !important;
    }
    .vj-dest-circle--dom { grid-column: 1 !important; order: unset !important; }
    .vj-dest-circle--for { grid-column: 1 !important; order: unset !important; }

    /* Text block: cột 2 — cả DOM và FOR */
    .vj-dest-row-text {
        grid-column: 2 !important; grid-row: 1 !important;
        /* Grid nội: [text | arrow] */
        display: grid !important;
        grid-template-columns: 1fr 28px !important;
        grid-template-rows: auto auto !important;
        column-gap: 10px !important;
        row-gap: 3px !important;
        align-items: center !important;
        flex: unset !important; max-width: none !important;
    }
    .vj-dest-row--dom .vj-dest-row-text {
        grid-column: 2 !important; max-width: none !important; align-items: center !important;
        text-align: left !important;
    }
    .vj-dest-name {
        grid-column: 1 !important; grid-row: 1 !important; align-self: end !important;
        font-size: 14px !important; font-weight: 700 !important; color: #1a1a1a !important;
        text-align: left !important;
    }
    .vj-dest-desc {
        grid-column: 1 !important; grid-row: 2 !important; align-self: start !important;
        display: -webkit-box !important; -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical; overflow: hidden;
        font-size: 12px !important; color: #888 !important; line-height: 1.45 !important;
    }
    /* Arrow: cột 2 của text-grid, trải 2 hàng, căn giữa dọc */
    .vj-dest-arrow-btn {
        grid-column: 2 !important; grid-row: 1 / 3 !important;
        align-self: center !important; justify-self: center !important;
        position: static !important; transform: none !important;
        width: 28px !important; height: 28px !important; font-size: 10px !important;
    }
    .vj-dest-row--dom .vj-dest-arrow-btn,
    .vj-dest-row--for .vj-dest-arrow-btn { align-self: center !important; }

    /* Footer: cùng style, căn giữa */
    .vj-dest-col-footer { margin-top: 14px !important; text-align: center !important; align-self: start; }
    .vj-dest-cta { font-size: 12.5px; padding: 9px 18px; white-space: nowrap; }

    .vj-dest-bg-wrap { background: none; }
    .vj-dest-usps { display: none !important; }

    /* --- Footer iPad: Hàng 1: Brand 50% | Map 50% / Hàng 2: Menu 50% | Policy 50% --- */
    .vj-footer { padding: 36px 0 0; }
    .vj-footer .row { row-gap: 0; display: flex; flex-wrap: wrap; }

    .vj-foot-brand               { flex: 0 0 50% !important; max-width: 50% !important; padding-right: 24px !important; order: 1; }
    .vj-foot-map-col             { flex: 0 0 50% !important; max-width: 50% !important; margin-top: 0; order: 2; }
    .vj-footer-menu-mobile-hide  { flex: 0 0 50% !important; max-width: 50% !important; order: 3; }
    .vj-foot-policy-col          { flex: 0 0 50% !important; max-width: 50% !important; order: 4; }

    /* Cho tên công ty xuống dòng thay vì tràn */
    .vj-biz-name { white-space: normal !important; }

    /* Brand column: gọn, ẩn mô tả dài */
    .vj-biz-desc { display: none !important; }
    .vj-biz-list li { font-size: 13px; margin-bottom: 5px; }
    .vj-footer .social_block { margin-top: 10px; }
    .vj-foot-brand .vj-foot-logo { text-align: left; }
    .vj-foot-brand .vj-foot-logo img { height: 56px; margin: 0; }

    /* Map: hình chữ nhật cân đối */
    .vj-foot-map-lg { height: 280px !important; }

    /* Title zone (Menu/Chính sách): bỏ fixed-height/padding của desktop */
    .vj-foot-col-title { height: auto !important; padding-top: 0 !important; box-sizing: content-box !important; }
    .vj-foot-col-title .title-f { border-bottom: none !important; margin-bottom: 18px !important; padding-bottom: 0 !important; }
    .vj-foot-col-title::after { display: none !important; }
    .vj-foot-map-col .vj-foot-col-title { padding-top: 70px !important; box-sizing: border-box !important; margin-bottom: 18px !important; }

    /* Accordion: mở sẵn, ẩn chevron */
    .vj-footer .vj-foot-acc-head .vj-foot-acc-chevron { display: none; }
    .vj-footer .vj-foot-acc-body { display: block !important; }
    .vj-footer-menu-mobile-hide { display: block !important; }

    /* Nút nổi Zalo/Gọi: hiện lại trên iPad (bị ẩn bởi max-width:991px) */
    .vj-float-contact { display: flex !important; }

    /* Copyright: căn giữa trên iPad */
    .vj-footer .copyright { text-align: center; width: 100%; }
}

/* ── Mobile ── */
@media (max-width: 991px) {
    #vj-destinations { background-image: none; }
}
@media (max-width: 767px) {
    /* ── Task 1: Destinations carousel (CSS scroll-snap) ── */
    #vj-destinations { padding: 32px 0 0; }
    #vj-destinations .container { padding-left: 0; padding-right: 0; }
    .vj-dest-heading { font-size: 20px; }
    .vj-dest-lead {
        font-size: 13px;
        display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
        overflow: hidden; max-width: 100%; margin-bottom: 10px;
    }
    .vj-dest-lead br { display: none; }
    .vj-dest-head { padding: 0 18px; margin-bottom: 20px; }
    .vj-dest-body { flex-direction: column; gap: 0; padding-top: 0; }
    .vj-dest-plane { display: none; }
    .vj-dest-curve { display: none; }

    /* Column: flex wrap — header (left) + CTA (right) on same row, carousel full-width below */
    .vj-dest-col {
        width: 100%;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        padding: 20px 0 8px;
    }
    .vj-dest-col + .vj-dest-col { border-top: 1px solid #eee; }

    .vj-dest-col-hdr {
        flex: 1;
        order: 1;
        display: flex; align-items: center; gap: 8px;
        padding: 0 8px 0 18px;
        margin-bottom: 0;
        min-height: auto;
        justify-content: flex-start !important;
    }
    .vj-dest-pin { font-size: 18px; }
    .vj-dest-col-hdr-text strong { font-size: 12.5px; }
    .vj-dest-col-hdr-text span { display: none; }
    .vj-dest-col--dom .vj-dest-col-hdr-text { text-align: left !important; }
    .vj-dest-hdr-line { display: none !important; }

    .vj-dest-col-footer {
        flex: 0 0 auto;
        order: 2;
        margin-top: 0;
        padding-right: 18px;
    }
    .vj-dest-cta {
        display: inline-flex; align-items: center; gap: 4px;
        background: none; border: 1px solid var(--mau1);
        color: var(--mau1); font-size: 11px; font-weight: 700;
        padding: 5px 11px; border-radius: 20px;
    }
    .vj-dest-cta:hover { background: var(--mau1); color: #fff; }

    /* List: 3 card hiện đều, không scroll ngang */
    .vj-dest-list {
        flex: 0 0 100%;
        order: 3;
        display: flex !important;
        flex-direction: row !important;
        overflow-x: visible;
        gap: 8px;
        padding: 14px 12px 14px;
    }
    .vj-dest-list--dom, .vj-dest-list--for { grid-template-columns: unset; }

    /* Card: 3 card chia đều */
    .vj-dest-row,
    .vj-dest-row--dom,
    .vj-dest-row--for {
        flex: 1 1 0 !important;
        min-width: 0;
        flex-direction: column !important;
        align-items: stretch !important;
        text-align: left !important;
        padding: 0 !important;
        gap: 0 !important;
        min-height: auto !important;
        background: #fff;
        border-radius: 10px;
        box-shadow: 0 2px 10px rgba(0,0,0,.10);
        overflow: hidden;
    }

    /* Image: fill card width using padding-bottom trick (background-image) */
    .vj-dest-circle {
        width: 100% !important;
        height: 0 !important;
        padding-bottom: 64% !important;
        border-radius: 0 !important;
        border: none !important;
        flex-shrink: 0;
        order: -1;
    }
    .vj-dest-circle--dom { order: -1; }
    .vj-dest-circle--for { order: -1; }

    /* Text below image */
    .vj-dest-row-text {
        padding: 8px 8px 10px !important;
        gap: 6px !important;
        align-items: flex-start !important;
        max-width: none !important;
        text-align: left !important;
    }
    .vj-dest-row--dom .vj-dest-row-text { max-width: none !important; text-align: left !important; }
    .vj-dest-name { font-size: 11.5px !important; font-weight: 700 !important; }
    .vj-dest-desc { display: none !important; }
    .vj-dest-arrow-btn {
        width: 24px !important; height: 24px !important; font-size: 10px !important;
        align-self: flex-start !important;
    }

    /* Không cần dots vì cả 3 card hiện đều */
    .vj-dest-dots { display: none !important; }

    /* Task 1: hide red dash-line and dashed-curve background in destinations */
    .vj-dest-head-line { display: none; }
    .vj-dest-bg-wrap { background: none; }

    /* Hide icon bar on mobile */
    .vj-dest-usps { display: none; }

    /* Hide floating Gọi/Zalo buttons on mobile */
    .vj-float-contact { display: none !important; }

    /* Task 2: bottom nav "Gọi ngay" — same size as other buttons */
    .vj-bottom-nav .vj-bn-call i {
        background: none !important;
        width: auto !important; height: auto !important;
        line-height: normal !important;
        margin: 0 0 2px !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        font-size: 18px !important;
        color: var(--mau1) !important;
    }

    /* Task 3: hide featured tour pagination dots on mobile */
    .vj-ft-dots-mobile { display: none !important; }

    /* Task 4: testimonials dots — ensure they clear the card */
    .vj-owl-testimonials .owl-dots {
        position: static !important;
        margin-top: 16px !important;
    }

    /* Footer: tên công ty xuống dòng thay vì bị cắt */
    .vj-biz-name { white-space: normal !important; }
}


/* ---------- 5. Tin tức (1 bài nổi bật lớn + danh sách bên phải) ---------- */
.vj-news-layout { align-items: stretch; }
.vj-news-feature {
    position: relative; display: block; height: 100%; min-height: 260px;
    border-radius: 14px; overflow: hidden; box-shadow: 0 6px 20px rgba(0,0,0,.12);
}
.vj-news-feature img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.vj-news-feature:hover img { transform: scale(1.05); }
.vj-news-feature-body {
    position: absolute; left: 0; right: 0; bottom: 0; padding: 46px 26px 24px;
    background: linear-gradient(transparent, rgba(0,0,0,.86)); color: #fff;
}
.vj-news-feature-body h3 {
    font-size: 22px; font-weight: 800; margin: 0 0 8px; line-height: 1.35;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.vj-news-feature-body .vj-news-meta { color: #f2d9c8; }
.vj-news-list { display: flex; flex-direction: column; gap: 14px; }
.vj-news-item {
    display: flex; gap: 14px; align-items: center;
    background: #fff; border: 1px solid #eee; border-radius: 12px; padding: 10px;
    box-shadow: 0 2px 10px rgba(0,0,0,.05); text-decoration: none;
    transition: box-shadow .2s, transform .2s;
}
.vj-news-item:hover { box-shadow: 0 8px 20px rgba(0,0,0,.12); transform: translateY(-2px); }
.vj-news-item-thumb { flex: 0 0 100px; width: 100px; height: 76px; border-radius: 8px; overflow: hidden; }
.vj-news-item-thumb img { width: 100%; height: 100%; object-fit: cover; }
.vj-news-item-body { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.vj-news-item-title {
    color: var(--mau4); font-weight: 700; font-size: 14.5px; line-height: 1.4;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.vj-news-item:hover .vj-news-item-title { color: var(--mau1); }
.vj-news-meta { font-size: 13px; color: #888; display: flex; gap: 16px; align-items: center; }
.vj-news-meta i { margin-right: 4px; color: var(--mau2); }
@media (max-width: 991px) { .vj-news-feature { min-height: 280px; margin-bottom: 14px; } }

/* ---------- 6. Đối tác — marquee tự chạy liên tục, logo màu đồng chiều cao, dừng khi rê chuột ---------- */
#vj-brands { background: #fff; padding: 24px 0 40px; margin-top: 20px; }
#vj-brands .vj-section-title { margin-top: 10px; }
.vj-marquee { overflow: hidden; width: 100%; }
.vj-marquee-track {
    display: flex; align-items: center; gap: 56px; width: max-content;
    animation: vj-marquee-scroll 32s linear infinite;
    will-change: transform;
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.vj-marquee:hover .vj-marquee-track { animation-play-state: paused; }
.vj-marquee-item { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; }
.vj-marquee-item img {
    height: 58px; width: auto; max-width: none; object-fit: contain;
    transition: transform .25s;
}
.vj-marquee-item:hover img { transform: scale(1.08); }
@keyframes vj-marquee-scroll {
    from { transform: translate3d(0, 0, 0); }
    to   { transform: translate3d(-50%, 0, 0); }
}
@media (prefers-reduced-motion: reduce) { .vj-marquee-track { animation: none; } }

/* ---------- 7. Nhận xét (sao + avatar + tên, auto scroll) ---------- */
#vj-testimonials { background: #eef4fb; padding: 14px 0 52px; margin-top: 30px; }
.vj-testimonial {
    background: #fff; border: 1px solid #eef0f3;
    border-radius: 14px; padding: 24px 22px; height: 100%;
    box-shadow: 0 6px 18px rgba(0,0,0,.06);
    display: flex; flex-direction: column;
}
.vj-testimonial-stars { color: #f5a623; font-size: 14px; letter-spacing: 3px; margin-bottom: 12px; text-align: center; }
.vj-testimonial p { font-size: 14px; color: #555; margin: 0 0 18px; line-height: 1.65; flex: 1; }
.vj-testimonial-author {
    display: flex; align-items: center; gap: 12px;
    border-top: 1px solid #f0f0f0; padding-top: 14px;
}
.vj-testimonial-avatar {
    flex: 0 0 46px; width: 46px; height: 46px; border-radius: 50%; overflow: hidden;
    background: var(--mau3); display: flex; align-items: center; justify-content: center; color: var(--mau1);
}
.vj-testimonial-avatar img { width: 100%; height: 100%; object-fit: cover; }
.vj-testimonial-name { font-weight: 700; color: var(--mau4); font-size: 14.5px; }
.vj-owl-testimonials .owl-nav .owl-prev,
.vj-owl-testimonials .owl-nav .owl-next {
    position: absolute; top: 50%; transform: translateY(-50%);
    width: 40px; height: 40px; border-radius: 50%;
    background: #fff !important; color: var(--mau1) !important;
    box-shadow: 0 4px 14px rgba(0,0,0,.14); font-size: 16px !important;
    display: flex; align-items: center; justify-content: center;
}
.vj-owl-testimonials .owl-nav .owl-prev { left: -8px; }
.vj-owl-testimonials .owl-nav .owl-next { right: -8px; }
.vj-owl-testimonials .owl-dots { position: static !important; margin-top: 20px; text-align: center; }
/* Equal-height cards: flex stage makes all items stretch to tallest card */
.vj-owl-testimonials .owl-stage { display: flex; }
.vj-owl-testimonials .owl-item { display: flex; }
.vj-owl-testimonials .owl-item .item { width: 100%; display: flex; }

/* ---------- 8. Khuyến mãi ---------- */
.vj-promo-card { display: block; border-radius: 8px; overflow: hidden; }
.vj-promo-card img { width: 100%; height: auto; transition: transform .3s; }
.vj-promo-card:hover img { transform: scale(1.03); }
#vj-promotions { margin-bottom: 30px; }

/* ---------- Footer ---------- */
.vj-footer { color: #f4e3d7; padding: 52px 0 20px; }
.vj-footer .row { row-gap: 28px; }
.vj-footer .title-f {
    color: #fff; font-weight: 800; text-transform: uppercase;
    font-size: 16px; margin: 0 0 18px; padding-bottom: 10px;
}
.vj-footer .contentf { font-size: 14px; line-height: 1.6; }
.vj-footer .contentf > p { margin: 0 0 10px; }
.vj-footer .contentf p i { color: var(--mau2); width: 18px; text-align: center; margin-right: 7px; }
.vj-footer .contentf a { color: var(--mau2); text-decoration: none; }
.vj-footer .contentf a:hover { text-decoration: underline; }
.vj-footer .vj-tax { font-size: 12.5px; opacity: .85; }
.vj-footer-links { list-style: none; padding: 0; margin: 0; font-size: 14px; }
.vj-footer-links li { margin-bottom: 10px; line-height: 1.4; }
.vj-footer-links a { color: #f4e3d7; text-decoration: none; transition: color .15s, padding-left .15s; }
.vj-footer-links a:hover { color: var(--mau2); padding-left: 3px; }
.vj-2cols { column-count: 2; column-gap: 22px; }
.vj-subscribe { display: flex; margin: 4px 0 16px; }
.vj-subscribe input {
    flex: 1; height: 44px; border: none; border-radius: 6px 0 0 6px;
    padding: 0 14px; font-size: 14px;
}
.vj-subscribe button {
    width: 54px; border: none; border-radius: 0 6px 6px 0;
    background: var(--mau2); color: #fff; cursor: pointer; transition: background .2s;
}
.vj-subscribe button:hover { background: #fff; color: var(--mau1); }
.vj-footer .social_block { display: flex; justify-content: flex-start; gap: 12px; list-style: none; padding: 0; margin: 14px 0 0; }
.vj-footer .social_block a {
    color: #fff; font-size: 18px; width: 38px; height: 38px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: rgba(255,255,255,.12); transition: background .2s;
}
.vj-footer .social_block a:hover { background: var(--mau2); }
.vj-footer .line { border-top: 1px solid rgba(255,255,255,.18); margin: 30px 0 16px; }
.vj-footer .copyright { font-size: 13px; line-height: 1.6; }
.vj-footer .wp-bct { display: none !important; }
/* Cột 1 — Thông tin doanh nghiệp */
.vj-foot-brand .vj-foot-logo { display: block; margin-bottom: 14px; text-align: center; }
.vj-foot-brand .vj-foot-logo img { width: auto; height: 66px; max-width: 160px; object-fit: contain; display: block; margin: 0 auto; }
.vj-biz-list { list-style: none; padding: 0; margin: 0 0 16px; font-size: 14px; line-height: 1.55; }
.vj-biz-list li { display: flex; align-items: flex-start; gap: 9px; margin-bottom: 8px; color: #f4e3d7; }
.vj-biz-list li i { color: var(--mau2); width: 16px; text-align: center; margin-top: 3px; flex-shrink: 0; }
.vj-biz-list li a { color: #f4e3d7; text-decoration: none; }
.vj-biz-list li a:hover { color: var(--mau2); }
.vj-biz-name { font-weight: 800; color: #fff !important; font-size: 13px; white-space: nowrap; text-transform: uppercase; margin-bottom: 12px !important; padding-bottom: 8px; }
.vj-biz-name b { font-weight: 700; }
.vj-biz-desc {
    display: block !important; font-size: 13px !important; font-style: italic;
    color: rgba(244,227,215,.75) !important; line-height: 1.6 !important;
    margin-bottom: 14px !important; border: none !important;
    padding: 0 !important; gap: 0 !important;
}
/* Cột 2 & 3 — đường gạch ngang căn theo col 1, tiêu đề giữ nguyên vị trí đầu cột */
@media (min-width: 992px) {
    /* Không dịch chuyển vị trí cột */
    .vj-foot-policy-col,
    .vj-footer-menu-mobile-hide { padding-top: 0; }

    /* Vùng heading cố định: tiêu đề ngang với tên công ty (80px), border ở 108px */
    .vj-foot-col-title {
        display: block;
        height: 108px;   /* = logo(66) + logo-mb(14) + tên(~20) + pb(8) */
        box-sizing: border-box;
        padding-top: 74px;   /* đẩy tiêu đề xuống ngang tên công ty */
        position: relative;
        margin-bottom: 18px;
    }
    .vj-foot-col-title::after { display: none; }
    /* Tắt border gốc của title-f bên trong wrapper, giữ nguyên font/màu/vị trí */
    .vj-foot-col-title .title-f {
        border-bottom: none;
        margin-bottom: 0;
        padding-bottom: 0;
    }
}

/* Cột 4 — Google Maps (không có tiêu đề, cao hơn để chiếm hết cột) */
.vj-foot-map {
    position: relative; width: 100%;
    border-radius: 10px; overflow: hidden; box-shadow: 0 6px 20px rgba(0,0,0,.28);
    background: rgba(255,255,255,.05);
}
.vj-foot-map iframe { width: 100%; height: 100%; border: 0; display: block; }
.vj-foot-map-lg { height: 220px; }
@media (min-width: 992px) { .vj-foot-map-lg { height: 240px; min-height: unset; } }
@media (max-width: 767px) { .vj-foot-map-lg { height: 180px; } }

/* ---------- Trang danh mục tour ---------- */
.vj-banner-title {
    background: linear-gradient(120deg, var(--mau4), var(--mau1)) center/cover no-repeat;
    padding: 46px 0;
    position: relative;
}
.vj-banner-title::before {
    content: ''; position: absolute; inset: 0; background: rgba(60,10,5,.55);
}
.vj-banner-title .title-home { position: relative; }
.vj-banner-title .txt-main {
    color: #fff; font-size: 32px; font-weight: 800; text-transform: uppercase; margin: 0 0 6px;
}
.vj-breadcrumb, .vj-breadcrumb a { color: #f3d8c8; font-size: 13.5px; text-decoration: none; }
.vj-breadcrumb a:hover { color: var(--mau2); }
/* Trang kết quả: thanh tìm kiếm ngang trên đầu + lưới tour bên dưới (không sidebar) */
.vj-archive-search { margin-top: 24px; }
.vj-archive { margin-top: 18px; }
/* Danh mục tour: bộ lọc trái + lưới phải */
.vj-archive-wrap { margin-top: 26px; }
@media (min-width: 992px) { .vj-filter-side { position: sticky; top: 20px; } }
.vj-pagination { margin: 24px 0 10px; }
.vj-pagination nav { display: flex; justify-content: center; }
.vj-pagination .pagination { display: inline-flex; flex-wrap: nowrap; gap: 6px; justify-content: center; padding: 0; margin: 0; list-style: none; overflow-x: auto; max-width: 100%; }
.vj-pagination .page-item { list-style: none; }
.vj-pagination .page-link {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 42px; height: 42px; padding: 0 12px; border-radius: 8px;
    border: 1px solid #e5d9c8; color: var(--mau4); text-decoration: none; font-weight: 600; background: #fff;
}
.vj-pagination .page-item.active .page-link,
.vj-pagination .page-link.current { background: var(--mau1); color: #fff; border-color: var(--mau1); }
.vj-pagination a.page-link:hover { background: var(--mau3); color: var(--mau1); }
.vj-pagination .page-link.dots { border-color: transparent; background: transparent; }

/* Danh mục blog: lưới bài viết */
.vj-blog-grid { margin-top: 26px; }
.vj-post-card { background: #fff; border: 1px solid #eee; border-radius: 12px; overflow: hidden; height: 100%; box-shadow: 0 2px 10px rgba(0,0,0,.05); transition: box-shadow .2s, transform .2s; }
.vj-post-card:hover { box-shadow: 0 12px 26px rgba(0,0,0,.12); transform: translateY(-3px); }
.vj-post-thumb { display: block; aspect-ratio: 16/10; overflow: hidden; }
.vj-post-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.vj-post-card:hover .vj-post-thumb img { transform: scale(1.06); }
.vj-post-body { padding: 14px 16px 16px; }
.vj-post-cat { font-size: 12px; font-weight: 700; color: var(--mau2); text-transform: uppercase; letter-spacing: .5px; }
.vj-post-body h3 { font-size: 16px; margin: 6px 0 8px; line-height: 1.4; }
.vj-post-body h3 a { color: var(--mau4); font-weight: 700; text-decoration: none; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.vj-post-body h3 a:hover { color: var(--mau1); }
.vj-post-excerpt { font-size: 13.5px; color: #666; line-height: 1.55; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; margin: 0 0 8px; }
.vj-post-meta { font-size: 12.5px; color: #999; }
.vj-post-meta i { color: var(--mau2); margin-right: 4px; }
.vj-filter-box {
    background: var(--mau1); border-radius: 8px; padding: 18px; color: #fff;
    box-shadow: 0 4px 14px rgba(0,0,0,.12);
}
.vj-filter-title { color: #fff; font-size: 17px; font-weight: 800; margin-bottom: 12px; }
.vj-filter-field { margin-bottom: 12px; }
.vj-filter-field label { display: block; font-size: 13.5px; color: #fde9d9; margin-bottom: 4px; }
.vj-filter-field input[type=text], .vj-filter-field select {
    width: 100%; height: 40px; border: none; border-radius: 4px; padding: 0 10px; font-size: 14px;
}
.vj-price-ranges { background: rgba(255,255,255,.08); border-radius: 4px; padding: 8px 10px; }
.vj-radio { display: flex; align-items: center; gap: 7px; font-size: 13.5px; color: #fff; margin: 4px 0; cursor: pointer; }
.vj-sort-bar {
    display: flex; justify-content: space-between; align-items: center;
    background: #fff; border-radius: 6px; padding: 10px 14px; margin-bottom: 18px;
}
.vj-count { font-weight: 700; color: var(--mau4); }
.vj-orderby { display: flex; align-items: center; gap: 8px; }
.vj-orderby label { margin: 0; font-size: 14px; color: #555; }
.vj-orderby select { height: 36px; border: 1px solid #ddd; border-radius: 4px; padding: 0 8px; }
.vj-empty { padding: 40px 0; color: #666; }
.w-100 { width: 100%; }

/* ---------- Trang tĩnh ---------- */
.vj-page { margin: 30px auto; }
.vj-cat-desc { color: #555; line-height: 1.7; margin-bottom: 8px; }

/* ---------- Trang Liên hệ ---------- */
.vj-contact { margin: 34px auto; }
.vj-contact-title { color: var(--mau1); font-size: 21px; font-weight: 800; text-transform: uppercase; margin-bottom: 14px; }
.vj-contact-top { margin-bottom: 8px; }
.vj-contact-info { background: var(--mau3); border: 1px solid #ecdcc4; border-radius: 12px; padding: 26px; height: 100%; }
.vj-contact-company { font-weight: 700; color: var(--mau4); font-size: 16px; margin: 0 0 16px; }
.vj-contact-tax { font-size: 13px; color: #777; margin-bottom: 14px; }
.vj-contact-list { list-style: none; padding: 0; margin: 0 0 18px; }
.vj-contact-list li { display: flex; align-items: flex-start; gap: 11px; margin-bottom: 12px; font-size: 15px; color: #333; }
.vj-contact-list i { color: var(--mau2); width: 18px; text-align: center; margin-top: 3px; flex-shrink: 0; }
.vj-contact-list a { color: #333; text-decoration: none; }
.vj-contact-list a:hover { color: var(--mau1); }
.vj-contact-cta { display: flex; gap: 10px; }
.vj-contact-cta > a { flex: 1 1 0; justify-content: center; text-align: center; padding-left: 8px; padding-right: 8px; }
.vj-btn-outline {
    display: inline-flex; align-items: center; gap: 7px;
    border: 2px solid var(--mau1); color: var(--mau1); font-weight: 700;
    padding: 9px 20px; border-radius: 6px; text-decoration: none; transition: background .2s, color .2s;
}
.vj-btn-outline:hover { background: var(--mau1); color: #fff; }
.vj-contact-map { height: 100%; min-height: 340px; border-radius: 12px; overflow: hidden; box-shadow: 0 6px 20px rgba(0,0,0,.1); }
.vj-contact-map iframe { width: 100%; height: 100%; min-height: 340px; border: 0; display: block; }
.vj-contact-photo { height: 100%; min-height: 340px; border-radius: 12px; overflow: hidden; box-shadow: 0 6px 20px rgba(0,0,0,.1); }
.vj-contact-photo img { width: 100%; height: 100%; min-height: 340px; object-fit: cover; display: block; }
/* Ảnh ghép điểm đến (collage 2×2) */
.vj-contact-collage {
    display: grid; grid-template-columns: 1fr 1fr; grid-auto-rows: 1fr; gap: 8px;
    height: 100%; min-height: 380px; border-radius: 12px; overflow: hidden; box-shadow: 0 6px 20px rgba(0,0,0,.1);
}
.vj-contact-collage span { background-size: cover; background-position: center; display: block; overflow: hidden; transition: transform .5s ease; }
.vj-contact-collage span:hover { transform: scale(1.06); }
.vj-contact-formwrap {
    max-width: 820px; margin: 26px auto 0; background: #fff;
    border: 1px solid #ecdcc4; border-radius: 14px; padding: 30px 30px 34px;
    box-shadow: 0 8px 26px rgba(0,0,0,.07);
}
/* Khối phân lớp: thông tin + form chồng lên banner Hà Nội mờ */
.vj-contact-hero { position: relative; overflow: hidden; padding: 56px 0 72px; }
.vj-contact-hero::before {
    content: ''; position: absolute; inset: -24px; z-index: 0;
    background-image: var(--vj-hero-img); background-size: cover; background-position: center;
    filter: grayscale(.45) blur(4px) brightness(.9);
}
.vj-contact-hero::after {
    content: ''; position: absolute; inset: 0; z-index: 1;
    background: linear-gradient(rgba(74,27,23,.45), rgba(74,27,23,.58));
}
.vj-contact-layer { position: relative; z-index: 2; max-width: 880px; margin: 0 auto; padding: 0 16px; }
.vj-contact-layer .vj-contact-info { margin-bottom: 26px; box-shadow: 0 14px 44px rgba(0,0,0,.28); }
.vj-contact-layer .vj-contact-formwrap { max-width: 100%; margin: 0; box-shadow: 0 14px 44px rgba(0,0,0,.28); }

/* v2: Banner full-width phía sau + khung info chồng banner + form chồng 1 phần */
/* ---- Contact page banner: sáng + fade trắng ở đáy ---- */
.vj-banner-lh { padding: 52px 0 70px; }
.vj-banner-lh::before { background: rgba(30,8,2,.52); }
.vj-banner-lh::after {
    content: ''; position: absolute; inset: 0; pointer-events: none; z-index: 1;
    box-shadow: inset 0 0 80px 25px rgba(255,255,255,.38);
    background: linear-gradient(to bottom, transparent 45%, rgba(255,255,255,.75) 80%, #fff 100%);
}
@media (max-width: 767px) {
    .vj-banner-title { margin-top: -10px; }
}
.vj-banner-lh .title-home { position: relative; z-index: 3; }

.vj-contact-hero-v2 {
    position: relative; overflow: hidden; padding: 60px 0 190px; margin-bottom: -160px; margin-top: 0;
}
.vj-contact-hero-v2::before {
    content: ''; position: absolute; inset: 0; z-index: 0;
    background-image: var(--vj-hero-img); background-size: cover; background-position: center;
    filter: saturate(.4) brightness(.88) blur(1px); opacity: .65;
}
.vj-contact-hero-v2::after {
    content: ''; position: absolute; inset: 0; z-index: 1;
    background: linear-gradient(to bottom, #fff 0%, rgba(255,255,255,.7) 18%, rgba(245,240,235,.10) 45%, rgba(255,250,245,.15) 100%);
    box-shadow: inset 0 0 80px 25px rgba(255,255,255,.45);
}
.vj-contact-info-card {
    position: relative; z-index: 2; max-width: 600px; margin: 0 auto;
    background: var(--mau3); border-radius: 12px; padding: 22px 24px 18px;
    border: 1px solid #ecdcc4; box-shadow: 0 14px 36px rgba(0,0,0,.22);
}
.vj-contact-form-section { position: relative; z-index: 3; margin-top: 0; padding-bottom: 30px; }
.vj-contact-form-section .vj-contact-formwrap {
    max-width: 680px; margin: 0 auto; background: #fff;
    border: 1px solid #ecdcc4; border-radius: 12px; padding: 22px 24px 24px;
    box-shadow: 0 10px 32px rgba(0,0,0,.12);
}
@media (max-width: 767px) {
    .vj-contact-hero-v2 { padding: 60px 0 160px; margin-bottom: -130px; }
    .vj-contact-info-card { padding: 16px 18px; }
    .vj-contact-form-section .vj-contact-formwrap { padding: 16px 18px; }
}

/* Contact page — full-bg wrapper */
/* ===== Banner trang liên hệ ===== */
.vj-lh-banner {
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
    position: relative;
    height: 150px;
}
.vj-lh-banner::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(to bottom, rgba(0,0,0,.45) 0%, rgba(0,0,0,.08) 55%, transparent 100%);
    z-index: 1;
    pointer-events: none;
}
.vj-lh-banner::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 60px;
    background: linear-gradient(to top, rgba(255,255,255,.9) 0%, rgba(255,255,255,0) 100%);
    z-index: 2;
    pointer-events: none;
}
.vj-lh-page-head {
    position: relative;
    z-index: 3;
    padding: 54px 40px 20px;
}
.vj-lh-page-head .txt-main {
    color: #fff;
    font-weight: 800;
    text-shadow: 0 2px 18px rgba(0,0,0,.55);
}
.vj-lh-page-head .vj-breadcrumb,
.vj-lh-page-head .vj-breadcrumb a,
.vj-lh-page-head .vj-breadcrumb span { color: rgba(255,255,255,.88); }

/* ===== Phần nội dung liên hệ — ảnh nền đè lên banner ===== */
.vj-lh-content {
    background-color: #fff;
    padding: 30px 0 400px;
    position: relative;
    overflow: hidden;
}
.vj-lh-bg-img {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    z-index: 0;
}
/* Fade nhẹ mép trên để không thấy đường viền với banner */
.vj-lh-content::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 360px;
    background: linear-gradient(to bottom, rgba(255,255,255,.9) 0%, rgba(255,255,255,.55) 40%, rgba(255,255,255,.15) 75%, rgba(255,255,255,0) 100%);
    z-index: 1;
    pointer-events: none;
}

.vj-lh-content > .container {
    position: relative;
    z-index: 2;
}

/* Contact side-by-side layout */
.vj-contact-side-row {
    display: flex;
    align-items: stretch;
    max-width: 1060px;
    margin: 0 auto;
    padding: 50px 16px 0;
    gap: 32px;
}

/* ---- Responsive banner ---- */
@media (min-width: 1280px) {
    .vj-lh-banner { height: 180px; background-position: center top; }
}
@media (min-width: 992px) and (max-width: 1279px) {
    .vj-lh-banner { height: 160px; background-position: 55% top; }
}
@media (min-width: 768px) and (max-width: 991px) {
    .vj-lh-banner { height: 130px; background-position: 60% top; }
    .vj-lh-page-head { padding: 44px 24px 16px; }
    .vj-lh-content { padding: 24px 0 320px; }
}
@media (max-width: 767px) {
    .vj-lh-banner { height: 110px; background-position: 55% top; }
    .vj-lh-page-head { padding: 28px 16px 12px; }
    .vj-lh-content { padding: 20px 0 260px; }
}
.vj-contact-side-row .vj-contact-hero-v2 {
    flex: 0 0 42%;
    padding: 0;
    margin-bottom: 0;
    background: transparent;
    overflow: visible;
    display: flex;
    flex-direction: column;
}
.vj-contact-side-row .vj-contact-hero-v2::before { display: none; }
.vj-contact-side-row .vj-contact-hero-v2::after { display: none; }
.vj-contact-side-row .vj-contact-info-card {
    max-width: none;
    margin: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    box-shadow: 0 8px 40px rgba(0,0,0,.22);
}
.vj-contact-side-row .vj-contact-info-card .vj-contact-list {
    flex: 1;
}
.vj-contact-side-row .vj-contact-form-section {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 0;
    background: transparent;
    margin-top: 0;
    z-index: 3;
}
.vj-contact-side-row .vj-contact-formwrap {
    max-width: none;
    margin: 0;
    width: 100%;
    flex: 1;
    display: flex;
    flex-direction: column;
    box-shadow: 0 8px 40px rgba(0,0,0,.18);
}
.vj-contact-side-row .vj-contact-form {
    flex: 1;
    display: flex;
    flex-direction: column;
}
.vj-contact-side-row .vj-contact-form .row {
    flex: 1;
}
.vj-contact-side-row .vj-contact-form textarea {
    flex: 1;
    min-height: 100px;
}
@media (max-width: 991px) {
    .vj-contact-side-row { gap: 24px; }
    .vj-contact-side-row .vj-contact-hero-v2 { flex: 0 0 46%; }
}
@media (max-width: 767px) {
    .vj-contact-side-row { flex-direction: column; gap: 20px; align-items: stretch; }
    .vj-contact-side-row .vj-contact-hero-v2 { flex: none; }
    .vj-contact-side-row .vj-contact-formwrap { flex: none; }
}
.vj-contact-sub { color: #666; margin: -4px 0 20px; }
.vj-contact-form input, .vj-contact-form textarea {
    width: 100%; border: 1px solid #ddd; border-radius: 8px; padding: 12px 14px; font-size: 15px; background: #fff;
}
.vj-contact-form input:focus, .vj-contact-form textarea:focus { outline: none; border-color: var(--mau2); }
.vj-contact-form textarea { resize: vertical; }
.vj-btn-lg { padding: 14px 46px; font-size: 16px; border: none; }
.vj-contact-ok { background: #e7f5ea; border: 1px solid #b6e0c0; color: #1d7a3e; border-radius: 6px; padding: 12px 14px; margin-bottom: 16px; font-size: 14.5px; }
.vj-contact-ok i { margin-right: 6px; }

/* ---------- Trang chi tiết tour ---------- */
.vj-single { margin-top: 0; }
.vj-breadcrumb-dark, .vj-breadcrumb-dark a { color: #888; }
.vj-breadcrumb-dark a:hover { color: var(--mau1); }
.vj-single .vj-breadcrumb { margin-top: 14px; }
.vj-single-title {
    color: var(--mau1); font-weight: 800; font-size: 28px;
    text-transform: uppercase; margin: 10px 0 10px;
}
.vj-single-basics { display: flex; flex-wrap: wrap; gap: 8px 26px; font-size: 14px; color: #555; margin-bottom: 18px; }
.vj-single-basics i { color: var(--mau2); margin-right: 5px; }
/* ====== Gallery ====== */
.vj-gallery-main { position: relative; border-radius: 10px; overflow: hidden; background: #111; }
.vj-gallery-mainlink { display: block; }
#vj-gallery-mainimg {
    width: 100%; display: block; aspect-ratio: 16/10; object-fit: cover;
    cursor: zoom-in; transition: opacity .16s ease;
}

/* Arrows trên ảnh lớn */
.vj-gal-arrow {
    position: absolute !important; top: 50% !important; transform: translateY(-50%) !important;
    width: 38px !important; height: 38px !important; border-radius: 50% !important;
    border: none !important; background: rgba(255,255,255,.82) !important;
    backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
    color: #222 !important; font-size: 26px !important; font-weight: 300 !important;
    line-height: 1 !important; cursor: pointer; z-index: 10; padding: 0 !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
    box-shadow: 0 2px 10px rgba(0,0,0,.22) !important; text-transform: none !important;
    transition: background .18s, transform .18s, box-shadow .18s;
}
.vj-gal-prev { left: 10px !important; }
.vj-gal-next { right: 10px !important; }
.vj-gal-arrow:hover {
    background: rgba(255,255,255,.97) !important;
    transform: translateY(-50%) scale(1.08) !important;
    box-shadow: 0 4px 14px rgba(0,0,0,.28) !important;
}

.vj-gallery-count {
    position: absolute; right: 10px; bottom: 10px; pointer-events: none;
    background: rgba(0,0,0,.52); color: #fff;
    padding: 3px 10px; border-radius: 20px; font-size: 12px; font-weight: 600;
    backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
}
.vj-fb-hidden { display: none; }

/* Thumbnail carousel */
.vj-gallery-strip { margin-top: 8px; }
.vj-gallery-thumbs-viewport { overflow: hidden; width: 100%; }
.vj-gallery-thumbs {
    display: flex; gap: 8px;
    transition: transform .32s cubic-bezier(.4,0,.2,1);
    will-change: transform;
}
.vj-gallery-thumb {
    flex: 0 0 auto; border-radius: 7px; overflow: hidden;
    border: 2.5px solid transparent; cursor: pointer;
    opacity: .65; transition: border-color .18s, opacity .2s;
}
.vj-gallery-thumb img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; max-height: 96px; }
.vj-gallery-thumb.active { border-color: var(--mau1); opacity: 1; }
.vj-gallery-thumb:hover { border-color: var(--mau2); opacity: .92; }
/* Mũi tên trong lightbox (fancybox): trong suốt, chỉ mũi tên, không khung */
.fancybox-navigation .fancybox-button,
.fancybox-navigation .fancybox-button:hover { background: transparent !important; width: 64px; height: 64px; }
.fancybox-navigation .fancybox-button svg { filter: drop-shadow(0 1px 4px rgba(0,0,0,.7)); }
.fancybox-navigation .fancybox-button svg path { stroke-width: 2.4; }
.fancybox-navigation .fancybox-button:hover svg { opacity: 1; transform: scale(1.12); transition: transform .15s; }

.vj-booking-box {
    background: var(--mau3); border: 1px solid #ecdcc4; border-radius: 8px;
    padding: 22px; box-shadow: 0 4px 14px rgba(0,0,0,.08);
}
.vj-booking-price .label { display: block; color: #777; font-size: 14px; }
.vj-booking-price .vj-price { font-size: 32px; }
.vj-booking-option { margin: 12px 0; }
.vj-booking-option label { display: block; font-weight: 700; color: var(--mau4); font-size: 14px; margin-bottom: 4px; }
.vj-booking-option select { width: 100%; height: 42px; border: 1px solid #ddd; border-radius: 4px; padding: 0 10px; background: #fff; }
.vj-booking-qty { display: flex; align-items: center; gap: 10px; margin: 14px 0; }
.vj-booking-qty label { font-weight: 700; color: var(--mau4); margin: 0; }
.vj-booking-qty input { width: 90px; height: 42px; border: 1px solid #ddd; border-radius: 4px; text-align: center; font-size: 16px; }
.vj-btn-book { width: 100%; font-size: 17px; }
.vj-btn-contact {
    display: block; text-align: center; margin-top: 10px;
    border: 2px solid var(--mau1); color: var(--mau1); font-weight: 700;
    border-radius: 4px; padding: 9px; text-decoration: none; text-transform: uppercase;
}
.vj-btn-contact:hover { background: var(--mau1); color: #fff; }
.vj-booking-hotline { margin-top: 14px; font-size: 14px; color: #555; text-align: center; }
.vj-booking-hotline a { display: block; color: var(--mau1); font-weight: 800; font-size: 22px; text-decoration: none; }
.vj-booking-usp { list-style: none; padding: 0; margin: 16px 0 0; font-size: 13.5px; color: #555; }
.vj-booking-usp li { margin: 6px 0; }
.vj-booking-usp i { color: #1d7a3e; margin-right: 6px; }
/* ─── Typography chuẩn chung: Chi tiết tour / Giá & Điều khoản / Hồ sơ visa ─── */
.vj-single-content {
    font-family: 'Mulish', 'Muli', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.88;
    color: #333;
    margin-bottom: 20px;
}
/* Reset inline font-size/family từ Word/Google Docs paste */
.vj-single-content p,
.vj-single-content li,
.vj-single-content span { font-size: inherit !important; font-family: inherit !important; }
/* H1–H2 */
.vj-single-content h1,
.vj-single-content h2 {
    font-size: 20px; font-weight: 800; color: var(--mau1); text-transform: uppercase;
    border-left: 4px solid var(--mau2); padding-left: 10px; margin: 32px 0 12px;
}
/* H3–H6 */
.vj-single-content h3 { font-size: 16px; font-weight: 700; color: var(--mau4); margin: 24px 0 10px; }
.vj-single-content h4 { font-size: 15px; font-weight: 700; color: var(--mau4); margin: 18px 0 8px; }
.vj-single-content h5 { font-size: 14px; font-weight: 600; color: #555; margin: 14px 0 6px; }
.vj-single-content h6 { font-size: 13px; font-weight: 600; color: #777; margin: 12px 0 5px; text-transform: uppercase; letter-spacing: .4px; }
/* Paragraph */
.vj-single-content p { margin: 0 0 1.1em; }
.vj-single-content p:last-child { margin-bottom: 0; }
/* Lists */
.vj-single-content ul { padding-left: 1.6em; list-style: disc; margin: 0 0 1.1em; }
.vj-single-content ol { padding-left: 1.6em; list-style: decimal; margin: 0 0 1.1em; }
.vj-single-content li { margin-bottom: 0.45em; line-height: 1.75; }
.vj-single-content li:last-child { margin-bottom: 0; }
.vj-single-content ul ul, .vj-single-content ol ol,
.vj-single-content ul ol, .vj-single-content ol ul { margin-top: 0.35em; margin-bottom: 0.35em; }
@media (max-width: 991px) {
    .vj-single-content { font-size: 15.5px; line-height: 1.84; }
    .vj-single-content h1, .vj-single-content h2 { margin-top: 26px; }
    .vj-single-content h3 { margin-top: 20px; }
}
@media (max-width: 575px) {
    .vj-single-content { font-size: 15px; line-height: 1.8; }
    .vj-single-content h1, .vj-single-content h2 { font-size: 17px; margin-top: 22px; margin-bottom: 10px; }
    .vj-single-content h3 { font-size: 15px; margin-top: 18px; }
    .vj-single-content p { margin-bottom: 0.95em; }
}
/* Bullet list cho mục Lưu ý */
.vj-notes-list { padding-left: 20px; list-style: disc; margin: 0; }
.vj-notes-list li { margin: 0 0 10px; line-height: 1.7; }
.vj-notes-list li:last-child { margin-bottom: 0; }
/* Table */
.vj-single-content table { width: 100%; border-collapse: collapse; font-size: 14px; margin-bottom: 16px; }
.vj-single-content th { background: var(--mau1); color: #fff; font-weight: 700; padding: 9px 12px; text-align: left; border: 1px solid #c0392b; }
.vj-single-content td { padding: 8px 12px; border: 1px solid #ecdcc4; }
.vj-single-content tr:nth-child(even) td { background: var(--mau3); }
/* Blockquote */
.vj-single-content blockquote {
    margin: 16px 0; padding: 14px 18px;
    background: var(--mau3); border-left: 4px solid var(--mau2);
    border-radius: 0 8px 8px 0; font-style: italic; color: #444;
}
.vj-single-content blockquote p:last-child { margin-bottom: 0; }
.vj-related { margin-bottom: 30px; }

/* ===== Tab menu nội dung tour — full-width sticky ===== */
.vj-tabnav-wrap {
    position: sticky;
    top: var(--vj-nav-bottom, 40px);
    z-index: 40;
    width: 100%;
    margin-bottom: 8px;
    background: #F7F3EC !important;
    border-bottom: none !important;
    padding-bottom: 0;
}

.vj-booking-col .vj-booking-box {
    position: sticky;
    top: calc(var(--vj-nav-bottom, 40px) + 6px);
}
.vj-tabnav {
    position: static !important;
    background: #F7F3EC !important;
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: none;
    padding: 0;
    border: none;
}
.vj-tabnav::-webkit-scrollbar { display: none; }
.vj-tabnav a {
    padding: 10px 20px; font-size: 14.5px; font-weight: 700;
    color: #A93226 !important;
    text-decoration: none; border-radius: 0; white-space: nowrap;
    flex-shrink: 0;
    background: transparent !important;
    border: none;
    border-bottom: 3px solid transparent !important;
    transition: border-color .15s;
}
.vj-tabnav a:hover { border-bottom-color: rgba(169,50,38,.35) !important; }
.vj-tabnav a.active {
    color: #A93226 !important;
    border-bottom-color: #A93226 !important;
}
.vj-sec { scroll-margin-top: 130px; padding-top: 18px; }
.vj-block-title { text-transform: none; }

/* Tour detail: nav scrolls away → tabnav sticks at top of viewport */
body.single-product .vj-tabnav-wrap { top: 0 !important; }
body.single-product .vj-booking-col .vj-booking-box { top: 0 !important; }

/* Thông tin chuyến đi — căn cột chuẩn: icon · nhãn (rộng cố định) · giá trị thẳng cột */
.vj-trip-info { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 14px 40px; }
.vj-trip-info li { display: flex; align-items: baseline; gap: 10px; font-size: 15px; color: #333; line-height: 1.5; }
.vj-trip-info li > i { color: var(--mau2); width: 20px; text-align: center; flex-shrink: 0; }
.vj-trip-info li > span { color: #888; width: 108px; flex-shrink: 0; }
.vj-trip-info li b { color: var(--mau4); font-weight: 700; min-width: 0; }
.vj-trip-info .vj-ti-price { color: var(--mau1); }
@media (max-width: 575px) { .vj-trip-info { grid-template-columns: 1fr; gap: 12px; } }

/* Điểm nhấn — đoạn mô tả hấp dẫn (hook) */
.vj-hook {
    font-size: 16px; line-height: 1.75; color: #444; margin: 0;
    padding: 16px 20px; background: var(--mau3); border-left: 4px solid var(--mau2); border-radius: 0 8px 8px 0;
}
/* Điểm nhấn — danh sách hành trình */
.vj-highlight-list { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px 24px; }
.vj-highlight-list li { display: flex; align-items: flex-start; gap: 9px; font-size: 14.5px; color: #333; line-height: 1.5; }
.vj-highlight-list li i { color: var(--mau1); margin-top: 3px; flex-shrink: 0; }
@media (max-width: 575px) { .vj-highlight-list { grid-template-columns: 1fr; } }

/* Lịch khởi hành & giá */
.vj-schedule-list { border: 1px solid #ecdcc4; border-radius: 10px; overflow: hidden; }
.vj-sch-row {
    display: grid; grid-template-columns: 1.6fr 1.2fr 1fr auto; align-items: center; gap: 10px;
    padding: 12px 16px; border-bottom: 1px solid #f0e6d6; font-size: 14.5px;
}
.vj-sch-row:last-child { border-bottom: none; }
.vj-sch-row:nth-child(even) { background: var(--mau3); }
.vj-sch-date { font-weight: 700; color: var(--mau4); }
.vj-sch-date i { color: var(--mau2); margin-right: 6px; }
.vj-sch-air { color: #666; }
.vj-sch-price { color: var(--mau1); font-weight: 800; white-space: nowrap; }
.vj-sch-status .con { color: #1d7a3e; font-weight: 700; }
.vj-sch-status .het { color: #b03127; font-weight: 700; }
.vj-sch-row.is-soldout { opacity: .72; }
@media (max-width: 575px) {
    .vj-sch-row { grid-template-columns: 1fr auto; row-gap: 4px; }
    .vj-sch-air { grid-column: 1 / -1; font-size: 13px; }
}

/* Lịch trình accordion */
.vj-itinerary { border: 1px solid #ecdcc4; border-radius: 10px; overflow: hidden; }
.vj-day { border-bottom: 1px solid #f0e6d6; }
.vj-day:last-child { border-bottom: none; }
.vj-day-head {
    width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 12px;
    background: #fff; border: none; cursor: pointer; text-align: left;
    padding: 15px 18px; font-size: 15.5px; font-weight: 700; color: var(--mau4);
}
.vj-day-head:hover { background: var(--mau3); }
.vj-day.open > .vj-day-head { background: var(--mau1); color: #fff; }
.vj-day-head i { transition: transform .25s; flex-shrink: 0; font-size: 13px; }
.vj-day.open > .vj-day-head i { transform: rotate(180deg); }
.vj-day-body { display: none; padding: 6px 18px 18px; }
.vj-day.open > .vj-day-body { display: block; }
.vj-notes {
    margin-top: 16px; background: #fdf7ee; border: 1px solid #ecdcc4;
    border-radius: 8px; padding: 14px 18px; font-size: 14px; color: #555;
}

/* Booking box gọn */
.vj-booking-compact { padding: 20px; }
.vj-bk-price { padding-bottom: 10px; border-bottom: 1px dashed #e0cfb6; margin-bottom: 10px; }
.vj-bk-price .label { display: block; color: #777; font-size: 13.5px; margin-bottom: 2px; }
.vj-bk-amount { font-size: 30px; font-weight: 800; }
.vj-bk-field label { display: block; font-weight: 700; color: var(--mau4); font-size: 14px; margin-bottom: 5px; }
.vj-bk-field select { width: 100%; height: 44px; border: 1px solid #ddd; border-radius: 8px; padding: 0 12px; background: #fff; font-size: 14.5px; }
.vj-bk-status { margin: 0; }
.vj-bk-status.het {
    margin: 10px 0 2px; font-size: 13.5px; font-weight: 700; color: #b03127;
    background: #fdecea; border: 1px solid #f5c6c0; border-radius: 8px; padding: 8px 12px;
    text-align: center;
}
.vj-bk-status.het i { margin-right: 6px; }
.vj-booking-compact .vj-btn-book { margin-top: 14px; }
.vj-ti-tp .vj-tp-item { margin-right: 6px; }
.vj-ti-tp .vj-tp-item em { font-weight: 400; color: #555; }

/* Mục Điều khoản / Hồ sơ visa (ẩn, bấm mới hiện) */
.vj-collapse { border: 1px solid #ecdcc4; border-radius: 10px; overflow: hidden; }
.vj-collapse-head {
    width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 12px;
    background: var(--mau3); border: none; cursor: pointer; text-align: left;
    padding: 15px 18px; font-size: 16px; font-weight: 800; color: var(--mau1); text-transform: uppercase;
}
.vj-collapse-head:hover { background: #f3e6d3; }
.vj-collapse-head i.fa-chevron-down { transition: transform .25s; font-size: 13px; }
.vj-collapse.open .vj-collapse-head i.fa-chevron-down { transform: rotate(180deg); }
.vj-collapse-body { display: none; padding: 8px 18px 18px; }
.vj-collapse.open .vj-collapse-body { display: block; }

/* ---------- Hết chỗ ---------- */
.vj-soldout-badge {
    position: absolute; top: 10px; left: 10px; z-index: 3;
    background: var(--mau1); color: #fff;
    font-size: 12.5px; font-weight: 800; letter-spacing: 1px;
    padding: 5px 14px; border-radius: 6px;
    box-shadow: 0 2px 8px rgba(0,0,0,.3);
    pointer-events: none;
}
.vj-tour-thumb { position: relative; }
/* Ảnh tour hết chỗ: hơi nhạt nhưng vẫn nhìn rõ; giá giữ nguyên màu gốc */
.vj-soldout .vj-tour-thumb img,
.vj-soldout .vj-ft-thumb img { filter: grayscale(.4) brightness(.97); opacity: .95; }
.vj-soldout-inline {
    position: static; transform: none; display: inline-block;
    margin-left: 10px; padding: 4px 14px; border-radius: 6px;
    font-size: 14px; vertical-align: middle; box-shadow: none;
}
.vj-soldout-notice {
    background: #fdecea; border: 1px solid #f5c6c0; color: #a33025;
    border-radius: 6px; padding: 10px 14px; font-size: 14px; margin: 14px 0 4px;
}
.vj-soldout-notice i { margin-right: 6px; }

/* ---------- Nút Zalo ---------- */
.vj-btn-zalo {
    display: flex; align-items: center; justify-content: center; gap: 8px;
    margin-top: 14px; font-size: 16px;
    background: #0068ff;
}
.vj-btn-zalo:hover { background: #0053cc; }
.vj-block-title {
    color: var(--mau1); font-size: 21px; font-weight: 800; text-transform: uppercase;
    border-left: 4px solid var(--mau2); padding-left: 10px; margin: 10px 0 14px;
}
.vj-price-table-wrap { margin: 6px 0 24px; }
.vj-price-table { width: 100%; border-collapse: collapse; background: #fff; font-size: 14.5px; }
.vj-price-table th {
    background: var(--mau1); color: #fff; padding: 10px 12px; text-align: left;
    text-transform: uppercase; font-size: 13px;
}
.vj-price-table td { padding: 10px 12px; border-bottom: 1px solid #f0e6d6; color: #333 !important; }
.vj-price-table tr:nth-child(even) td { background: var(--mau3); }
.vj-price-table .gia { color: var(--mau1); font-weight: 800; white-space: nowrap; }
.vj-price-table .con { color: #1d7a3e; font-weight: 700; }
.vj-price-table .het { color: #999; }
.table-responsive { overflow-x: auto; }

/* ---------- Popup đăng ký nhận tin ---------- */
.vj-popup {
    position: fixed; inset: 0; z-index: 9999;
    background: rgba(0,0,0,.55);
    display: flex; align-items: center; justify-content: center;
    padding: 20px;
}
.vj-popup[hidden] { display: none; }
.vj-popup-box {
    position: relative;
    background: var(--mau3);
    border-top: 5px solid var(--mau1);
    border-radius: 10px;
    max-width: 460px; width: 100%;
    padding: 30px 28px 26px;
    box-shadow: 0 18px 50px rgba(0,0,0,.35);
    animation: vjPopIn .3s ease;
}
@keyframes vjPopIn { from { transform: translateY(24px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes vj-ico-pulse {
  0%,100% { box-shadow: 0 0 8px 0 rgba(255,215,40,.4), 0 4px 14px rgba(0,0,0,.4); }
  50%      { box-shadow: 0 0 22px 8px rgba(255,215,40,.8), 0 0 40px 14px rgba(255,180,0,.3), 0 4px 14px rgba(0,0,0,.4); }
}
@keyframes vj-ray-spin { to { transform: translate(-50%,-50%) rotate(360deg); } }
@keyframes vj-star-blink {
  0%,100% { opacity: 0; transform: scale(.3) rotate(0deg); }
  50%      { opacity: 1; transform: scale(1.1) rotate(30deg); }
}
.vj-popup-box h3 { color: var(--mau1); font-weight: 800; font-size: 22px; margin-bottom: 8px; }
.vj-popup-box p { font-size: 14px; color: #555; margin-bottom: 14px; line-height: 1.6; }
.vj-popup-box .vj-subscribe input { border: 1px solid #ddd; }
.vj-popup-close {
    position: absolute; top: 8px; right: 12px;
    border: none; background: none; font-size: 28px; line-height: 1;
    color: #999; cursor: pointer;
}
.vj-popup-close:hover { color: var(--mau1); }
/* Popup v2 — nhỏ gọn, ấn tượng, có CTA */
.vj-popup-v2 { padding: 0; overflow: hidden; border-top: none; background: #fff; max-width: 420px; }
.vj-popup-v2 .vj-popup-close { color: #fff; z-index: 2; opacity: .9; }
.vj-popup-v2 .vj-popup-close:hover { color: #fff; opacity: 1; }
.vj-popup-head { background: linear-gradient(135deg, var(--mau4), var(--mau1)); color: #fff; padding: 26px 26px 22px; text-align: center; }
.vj-popup-badge { display: inline-block; background: var(--mau2); color: #fff; font-size: 12px; font-weight: 700; padding: 5px 13px; border-radius: 20px; margin-bottom: 12px; }
.vj-popup-badge i { margin-right: 5px; }
.vj-popup-head h3 { color: #fff; font-size: 21px; font-weight: 800; margin: 0 0 6px; }
.vj-popup-head p { color: #fff; opacity: .92; font-size: 13.5px; margin: 0; line-height: 1.5; }
.vj-popup-body { padding: 22px 26px 26px; }
.vj-popup-body .vj-subscribe { margin: 0 0 12px; }
.vj-popup-body .vj-subscribe input { flex: 1; height: 46px; border: 1px solid #ddd; border-radius: 8px 0 0 8px; padding: 0 14px; font-size: 14px; }
.vj-popup-body .vj-subscribe button { width: auto; padding: 0 22px; border-radius: 0 8px 8px 0; background: var(--mau1); color: #fff; font-weight: 700; }
.vj-popup-body .vj-subscribe button:hover { background: var(--mau4); }
.vj-popup-or { text-align: center; color: #999; font-size: 12.5px; position: relative; margin: 4px 0 14px; }
.vj-popup-or span { background: #fff; padding: 0 10px; position: relative; z-index: 1; }
.vj-popup-or::before { content: ''; position: absolute; left: 0; right: 0; top: 50%; border-top: 1px solid #eee; }
.vj-popup-actions { display: flex; gap: 10px; }
.vj-popup-actions a { flex: 1; display: flex; align-items: center; justify-content: center; gap: 7px; height: 44px; border-radius: 8px; font-weight: 700; text-decoration: none; font-size: 14px; transition: background .2s, color .2s; }
.vj-popup-zalo { background: #0068ff; color: #fff; }
.vj-popup-zalo:hover { background: #0053cc; color: #fff; }
.vj-popup-call { background: var(--mau3); color: var(--mau1); border: 1px solid var(--mau2); }
.vj-popup-call:hover { background: var(--mau1); color: #fff; }

/* ---------- Popup subscribe v5 ---------- */
.vj-pv4-wrap { position: relative; max-width: 720px; width: 96vw; }
.vj-popup-v4 {
    width: 100%; padding: 0; border-top: none; border-radius: 20px; overflow: hidden;
    animation: vjPopIn .3s cubic-bezier(.22,.68,0,1.2); background: #fff;
    box-shadow: 0 20px 60px rgba(0,0,0,.42); display: flex; flex-direction: column;
}
.vj-pv4-close {
    position: absolute; top: -14px; right: -14px; z-index: 30;
    width: 34px; height: 34px; border-radius: 50%;
    background: #E31E24; border: 2.5px solid #fff;
    color: #fff; font-size: 17px; font-weight: 900; line-height: 1;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer; padding: 0; transition: background .18s;
    box-shadow: 0 3px 12px rgba(227,30,36,.4);
}
.vj-pv4-close:hover { background: #B81A1A; }

/* Banner */
.vj-pv4-banner { position: relative; overflow: hidden; min-height: 340px; background: #1a6ea8; }
.vj-pv4-banner--custom { min-height: unset; }
.vj-pv4-banner--custom img { width: 100%; display: block; }
.vj-pv4-bg-img {
    position: absolute; right: 0; top: 0; bottom: 0;
    left: 30%; width: 70%; height: 100%;
    object-fit: cover; object-position: 60% 50%; display: block; z-index: 0;
}
.vj-pv4-banner::after {
    content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none;
    background: linear-gradient(to right,
        rgba(255,255,255,.98) 0%, rgba(255,255,255,.96) 34%,
        rgba(255,255,255,.60) 54%, rgba(255,255,255,.10) 66%, rgba(255,255,255,0) 74%
    );
}
.vj-pv4-banner-inner {
    position: relative; z-index: 2;
    display: flex; flex-direction: column; gap: 16px;
    padding: 24px 28px 26px; max-width: 62%;
}
.vj-pv4-logo img { height: 58px; width: auto; display: block; }
.vj-pv4-headline-group { display: flex; flex-direction: column; gap: 8px; }
.vj-pv4-script {
    font-family: 'Dancing Script', 'Great Vibes', Georgia, serif;
    font-size: 30px; font-weight: 700; font-style: italic;
    color: #1a2a4a; margin: 0; line-height: 1.1;
}
.vj-pv4-headline {
    font-size: 30px; font-weight: 900; line-height: 1.0; letter-spacing: .5px;
    color: #E31E24; margin: 0; text-transform: uppercase; white-space: nowrap;
}
.vj-pv4-badge {
    display: inline-block; align-self: flex-start;
    background: #FFD600; color: #1a1a1a;
    font-size: 12px; font-weight: 800; letter-spacing: .4px;
    padding: 6px 16px; border-radius: 4px; text-transform: uppercase;
}

/* Icon bar — thanh ngang liền mạch, gọn */
.vj-pv4-feats {
    display: flex; align-items: stretch; gap: 0;
    background: transparent;
    border-radius: 0; overflow: visible;
    backdrop-filter: none; -webkit-backdrop-filter: none;
}
.vj-pv4-feat {
    flex: 1; min-width: 0;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 7px; padding: 12px 10px;
    background: transparent; border-radius: 0; box-shadow: none;
    backdrop-filter: none; -webkit-backdrop-filter: none;
    border-right: 1px solid rgba(80,80,80,.20);
}
.vj-pv4-feat:last-child { border-right: none; }
.vj-pv4-feat-ico {
    width: 38px; height: 38px; border-radius: 50%; flex-shrink: 0;
    background: #fff;
    display: flex; align-items: center; justify-content: center;
    color: #E31E24; font-size: 16px;
    box-shadow: 0 2px 7px rgba(0,0,0,.14);
    border: none;
}
.vj-pv4-feat-ico::before { content: none; }
.vj-pv4-feat-ico::after  { content: none; }
.vj-pv4-feat-txt { min-width: 0; text-align: center; }
.vj-pv4-feat-txt strong { display: block; font-size: 11px; font-weight: 800; color: #111; text-transform: uppercase; line-height: 1.3; }
.vj-pv4-feat-txt span { display: block; font-size: 10px; color: #333; line-height: 1.3; }
.vj-pv4-feat-sep { display: none; }


/* Form block */
.vj-pv4-form-block { background: #fff; padding: 22px 28px 24px; }
.vj-pv4-form-head { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 18px; }
.vj-pv4-phone-dot {
    width: 46px; height: 46px; border-radius: 50%; flex-shrink: 0; background: #E31E24;
    display: flex; align-items: center; justify-content: center;
    color: #fff; font-size: 18px; box-shadow: 0 4px 16px rgba(227,30,36,.32);
}
.vj-pv4-form-head-text strong { display: block; font-size: 16px; font-weight: 900; color: #1a1a1a; text-transform: uppercase; line-height: 1.3; margin-bottom: 4px; }
.vj-pv4-form-head-text p { font-size: 13px; color: #666; margin: 0; line-height: 1.5; }
.vj-pv4-form.vj-subscribe { margin: 0; display: flex; gap: 0; border-radius: 10px; overflow: hidden; box-shadow: none; border: none; }
.vj-pv4-input-wrap {
    flex: 1; display: flex; align-items: center; min-width: 0;
    border: 1.5px solid #ddd; border-right: none;
    border-radius: 10px 0 0 10px; padding: 0 14px; background: #fff;
}
.vj-pv4-input-ico { color: #bbb; font-size: 16px; margin-right: 10px; flex-shrink: 0; }
.vj-pv4-input-wrap input[type="tel"] { flex: 1; min-width: 0; height: 52px; border: none; background: transparent; font-size: 15px; color: #333; outline: none; }
.vj-pv4-input-wrap input[type="tel"]::placeholder { color: #bbb; }
.vj-pv4-form.vj-subscribe button[type="submit"] {
    flex-shrink: 0; width: auto; height: 52px; padding: 0 22px;
    background: #E31E24; border: none; border-radius: 0 10px 10px 0;
    color: #fff; font-size: 13.5px; font-weight: 800; letter-spacing: .4px;
    text-transform: uppercase; white-space: nowrap; cursor: pointer;
    display: flex; align-items: center; gap: 8px; transition: background .18s;
}
.vj-pv4-form.vj-subscribe button[type="submit"]:hover { background: #B81A1A; color: #fff; filter: none; }
.vj-pv4-secure {
    text-align: center; font-size: 12px; color: #aaa;
    margin: 14px 0 0; display: flex; align-items: center; justify-content: center; gap: 5px;
}
.vj-pv4-secure i { color: #E31E24; }

@media (max-width: 620px) {
    .vj-pv4-banner { min-height: 260px; }
    .vj-pv4-banner-inner { max-width: 75%; padding: 18px 18px 20px; gap: 12px; }
    .vj-pv4-script { font-size: 24px; }
    .vj-pv4-headline { font-size: 27px; }
    .vj-pv4-badge { font-size: 10.5px; padding: 5px 12px; }
    .vj-pv4-feat { padding: 10px 8px; gap: 6px; }
    .vj-pv4-feat-ico { width: 36px; height: 36px; font-size: 15px; }
    .vj-pv4-feat-txt strong { font-size: 10.5px; }
    .vj-pv4-feat-txt span { font-size: 9.5px; }
    .vj-pv4-form-block { padding: 16px 16px 20px; }
    .vj-pv4-form-head-text strong { font-size: 13.5px; }
    .vj-pv4-form.vj-subscribe button[type="submit"] { padding: 0 16px; font-size: 12px; }
}
@media (max-width: 440px) {
    .vj-pv4-banner { min-height: 200px; }
    .vj-pv4-banner-inner { max-width: 85%; padding: 14px 14px 16px; gap: 10px; }
    .vj-pv4-headline { font-size: 22px; }
    .vj-pv4-feat { padding: 8px 6px; gap: 5px; }
    .vj-pv4-feat-ico { width: 32px; height: 32px; font-size: 13px; }
    .vj-pv4-form-head { flex-direction: column; align-items: center; text-align: center; }
    .vj-pv4-input-wrap { border-radius: 10px; border: 1.5px solid #ddd; }
    .vj-pv4-form.vj-subscribe { flex-direction: column; gap: 8px; }
    .vj-pv4-form.vj-subscribe button[type="submit"] { border-radius: 10px; justify-content: center; height: 48px; }
}

/* ---------- Bottom navigation mobile ---------- */
.vj-bottom-nav {
    position: fixed; left: 0; right: 0; bottom: 0; top: auto; z-index: 999;
    display: none;
    height: auto;
    background: #fff;
    border-top: 1px solid #e8ddcc;
    box-shadow: 0 -3px 12px rgba(0,0,0,.08);
}
.vj-bottom-nav a {
    flex: 1; text-align: center; padding: 7px 2px 6px;
    color: var(--mau4); text-decoration: none; font-size: 11px;
}
.vj-bottom-nav a i { display: block; font-size: 18px; margin-bottom: 2px; color: var(--mau1); }
.vj-bottom-nav .vj-bn-call i {
    background: var(--mau1); color: #fff; width: 40px; height: 40px;
    line-height: 40px; border-radius: 50%; margin: -18px auto 2px;
    box-shadow: 0 3px 8px rgba(0,0,0,.25);
}
@media (max-width: 991px) {
    .vj-bottom-nav { display: flex; }
    body { padding-bottom: 56px; }
    #back-to-top, .circle-button, .vj-float-contact { bottom: 70px !important; }
}
@media (min-width: 768px) and (max-width: 991px) {
    .vj-bottom-nav a { flex: 1; padding: 10px 2px 8px; font-size: 12px; }
    .vj-bottom-nav a i { font-size: 20px; }
    .vj-bottom-nav .vj-bn-call i {
        background: none; color: var(--mau1); width: auto; height: auto;
        line-height: normal; border-radius: 0; margin: 0 0 2px; box-shadow: none;
    }
}

/* ---------- Nút liên hệ nổi: Zalo + Gọi (tách riêng) ---------- */
.vj-float-contact {
    position: fixed; right: 18px; bottom: 24px; z-index: 990;
    display: flex; flex-direction: column; gap: 12px;
}
.vj-float-btn {
    width: 56px; height: 56px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 6px 18px rgba(0,0,0,.28);
    transition: transform .2s; text-decoration: none;
}
.vj-float-btn:hover { transform: scale(1.09); }
.vj-float-zalo { background: #0068ff; padding: 0 13px; }
.vj-float-zalo img { width: 100%; height: auto; display: block; filter: brightness(0) invert(1); }
.vj-float-call { background: #e53935; color: #fff; font-size: 22px; }
.vj-float-call:hover { color: #fff; }
.vj-float-call i { animation: vj-ring 1.4s ease infinite; transform-origin: 50% 8px; }
@keyframes vj-ring {
    0%, 65%, 100% { transform: rotate(0); }
    70% { transform: rotate(-16deg); } 75% { transform: rotate(14deg); }
    80% { transform: rotate(-10deg); } 85% { transform: rotate(8deg); } 90% { transform: rotate(0); }
}
@media (prefers-reduced-motion: reduce) { .vj-float-call i { animation: none; } }

/* ---------- Responsive ---------- */
@media (max-width: 767px) {
    .vj-section-title { font-size: 20px; }
    .vj-topbar .vj-quick { display: none; }
    .vj-2cols { column-count: 1; }
    .vj-search-box { padding: 16px; }
    .vjs-field input[type=date] { font-size: 13px; }
}

/* ---------- Bộ lọc: sub-item Bali dưới Indonesia ---------- */
.vjs-dd-sub { padding-left: 32px !important; font-size: 13px; color: #555; }
.vjs-dd-sub.sel { color: var(--mau1); font-weight: 700; }

/* ---------- Bộ lọc vertical: đảm bảo tabs stacked trên mọi màn hình ---------- */
.vjs-vertical .vjs-tabs {
    display: flex !important; flex-direction: column !important;
}
.vjs-vertical .vjs-tab { display: flex !important; flex: none !important; width: 100% !important; }

/* ---------- Bộ chọn loại hành khách ---------- */
.vj-bk-pax { margin: 12px 0 14px; }
.vj-bk-label { display: block; font-size: 13.5px; font-weight: 700; color: var(--mau4); margin-bottom: 8px; }
.vj-pax-cards { display: flex; gap: 7px; }
.vj-pax-card {
    flex: 1; display: flex; flex-direction: column; align-items: center; gap: 4px;
    padding: 10px 5px 9px; border: 1.5px solid #e0d0c0; border-radius: 10px;
    background: var(--mau3); cursor: pointer; text-align: center;
    font-family: inherit; transition: border-color .18s, background .18s, box-shadow .18s;
}
.vj-pax-card:hover { border-color: var(--mau2); background: #fff; }
.vj-pax-card.active {
    border-color: var(--mau1); background: #fff;
    box-shadow: 0 0 0 2.5px rgba(190,16,16,.13);
}
.vj-pax-ico { font-size: 20px; color: #999; transition: color .18s; }
.vj-pax-card.active .vj-pax-ico { color: var(--mau1); }
.vj-pax-card strong { display: block; font-size: 12px; font-weight: 800; color: #333; line-height: 1.2; }
.vj-pax-card.active strong { color: var(--mau1); }
.vj-pax-card span { display: block; font-size: 10px; color: #888; line-height: 1.3; }

/* ---------- Task 4: Trang chi tiết bài viết ---------- */
.vj-single-post { padding: 30px 0 50px; }
.vj-post-detail { background: #fff; padding: 0 16px; }
.vj-post-detail-meta {
    display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px;
    margin-bottom: 16px; font-size: 13.5px; color: #888;
}
.vj-post-cat-badge {
    background: var(--mau1); color: #fff; font-size: 12px; font-weight: 700;
    padding: 3px 12px; border-radius: 20px; text-decoration: none; text-transform: uppercase;
}
.vj-post-cat-badge:hover { background: var(--mau4); color: #fff; }
.vj-post-detail-date i { color: var(--mau2); margin-right: 4px; }
.vj-post-share { display: flex; align-items: center; gap: 8px; margin-bottom: 22px; font-size: 13.5px; color: #888; }
.vj-post-share .share-btn {
    display: inline-flex; align-items: center; justify-content: center;
    width: 32px; height: 32px; border-radius: 50%; background: var(--mau3);
    color: var(--mau1); text-decoration: none; font-size: 13px; transition: background .15s;
}
.vj-post-share .share-btn:hover { background: var(--mau1); color: #fff; }
/* === Post content — typography đồng nhất toàn bộ bài === */
.vj-post-content {
    font-family: 'Mulish','Muli',sans-serif;
    font-size: 16px;
    line-height: 1.88;
    color: #333;
}
/* Overwrite inline style WP editor inject vào p/li/td */
.vj-post-content p,
.vj-post-content li,
.vj-post-content td,
.vj-post-content th {
    font-family: 'Mulish','Muli',sans-serif !important;
    font-size: 16px !important;
    line-height: 1.88 !important;
    color: #333 !important;
    font-weight: 400 !important;
}
/* Overwrite inline style trên span/font — kế thừa từ p cha */
.vj-post-content span,
.vj-post-content font {
    font-family: 'Mulish','Muli',sans-serif !important;
    font-size: inherit !important;
    line-height: inherit !important;
    background-color: transparent !important;
}
/* Heading h2 h3 h4 — đen đậm */
.vj-post-content h2,
.vj-post-content h3,
.vj-post-content h4,
.vj-post-content h5 {
    font-family: 'Mulish','Muli',sans-serif !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    line-height: 1.4 !important;
    margin-bottom: 10px;
}
.vj-post-content h2 { font-size: 1.2em !important; margin-top: 34px; }
.vj-post-content h3 { font-size: 1.06em !important; margin-top: 24px; }
.vj-post-content h4 { font-size: 1em !important; margin-top: 18px; }
.vj-post-content h2 + p,
.vj-post-content h3 + p,
.vj-post-content h4 + p { margin-top: 0; }
/* strong/b trong đoạn văn — bỏ bold, giữ màu đen */
.vj-post-content strong,
.vj-post-content b { font-weight: 400 !important; color: inherit !important; }
/* Xóa highlight màu nền + màu chữ inline từ editor */
.vj-post-content mark,
.vj-post-content span[style*="background-color"] { background: none !important; }
.vj-post-content span[style*="color"],
.vj-post-content font[color] { color: inherit !important; }
/* Khoảng cách đoạn văn */
.vj-post-content p { margin-top: 0; margin-bottom: 1.1em; }
.vj-post-content ul, .vj-post-content ol { margin: 0 0 1.1em 0; padding-left: 1.6em; }
.vj-post-content li { margin-bottom: 0.45em; }
.vj-post-content li:last-child { margin-bottom: 0; }
.vj-post-content ul ul, .vj-post-content ol ol,
.vj-post-content ul ol, .vj-post-content ol ul { margin-top: 0.35em; margin-bottom: 0.35em; }
/* Media */
.vj-post-content img { max-width: 100%; height: auto; border-radius: 8px; margin: 10px 0; }
.vj-post-content a { color: #333 !important; text-decoration: underline; }
@media (max-width: 991px) {
    .vj-post-content p,
    .vj-post-content li,
    .vj-post-content td { font-size: 15.5px !important; line-height: 1.84 !important; }
    .vj-post-content h2 { margin-top: 26px; }
    .vj-post-content h3 { margin-top: 20px; }
}
@media (max-width: 575px) {
    .vj-post-content p,
    .vj-post-content li,
    .vj-post-content td { font-size: 15px !important; line-height: 1.8 !important; }
    .vj-post-content h2 { font-size: 1.13em !important; margin-top: 22px; margin-bottom: 8px; }
    .vj-post-content h3 { font-size: 1.03em !important; margin-top: 18px; margin-bottom: 7px; }
    .vj-post-content p { margin-bottom: 0.95em; }
}
.vj-post-content table { width: 100%; border-collapse: collapse; margin: 14px 0; }
.vj-post-content table th, .vj-post-content table td { border: 1px solid #e5d9c8; padding: 8px 12px; font-size: 14px; }
.vj-post-content table th { background: var(--mau3); color: var(--mau4); }
/* Related posts cards */
.vj-post-rel-card { display: block; border-radius: 10px; overflow: hidden; border: 1px solid #ecdcc4; text-decoration: none; transition: box-shadow .2s; }
.vj-post-rel-card:hover { box-shadow: 0 6px 20px rgba(0,0,0,.12); }
.vj-post-rel-img { height: 130px; background-size: cover; background-position: center; }
.vj-post-rel-body { padding: 10px 12px; }
.vj-post-rel-body h4 { font-size: 13.5px; color: var(--mau4); margin: 0 0 4px; font-weight: 700; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.vj-post-rel-body span { font-size: 12px; color: #999; }
/* Sidebar */
.vj-post-sidebar { display: flex; flex-direction: column; gap: 20px; }
.vj-sidebar-widget { background: #fff; border: 1px solid #ecdcc4; border-radius: 10px; overflow: hidden; }
.vj-sidebar-title { background: var(--mau3); color: var(--mau4); font-size: 15px; font-weight: 800; padding: 12px 16px; margin: 0; border-bottom: 1px solid #ecdcc4; }
.vj-sidebar-item { display: flex; gap: 10px; align-items: flex-start; padding: 10px 14px; border-bottom: 1px solid #f5ede0; text-decoration: none; transition: background .15s; }
.vj-sidebar-item:last-child { border-bottom: none; }
.vj-sidebar-item:hover { background: var(--mau3); }
.vj-sidebar-item img { width: 64px; height: 48px; object-fit: cover; border-radius: 5px; flex-shrink: 0; }
.vj-sidebar-item div { flex: 1; min-width: 0; }
.vj-sidebar-item p { margin: 0 0 3px; font-size: 13px; color: var(--mau4); font-weight: 600; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.vj-sidebar-item span { font-size: 12px; color: #999; }
/* ── Ảnh trong nội dung bài viết: căn giữa ── */
.vj-post-content img { display: block; margin-left: auto; margin-right: auto; width: 100%; max-width: 100%; height: auto; }
/* ── TOC box đầu bài viết ── */
.vj-toc-box { background: #fff; border: 1px solid #e8e0d5; border-left: 3px solid var(--mau1); border-radius: 6px; padding: 0; margin: 0 0 24px; overflow: hidden; }
.vj-toc-toggle { display: flex !important; align-items: center; justify-content: space-between; width: 100% !important; background: none !important; border: none !important; padding: 12px 16px !important; cursor: pointer; text-align: left; gap: 8px; text-transform: none !important; color: inherit !important; box-shadow: none !important; }
.vj-toc-toggle:hover { background: rgba(0,0,0,.03) !important; }
.vj-toc-title { display: block; font-size: 13px; font-weight: 700; color: #1a1a1a; text-transform: uppercase; letter-spacing: .06em; }
.vj-toc-arrow { font-size: 11px; color: #999; transition: transform .2s; flex-shrink: 0; }
.vj-toc-toggle[aria-expanded="false"] .vj-toc-arrow { transform: rotate(-90deg); }
/* ── TOC widget trong sidebar ── */
.vj-toc-widget { border: none !important; border-radius: 12px !important; background: #fff !important; margin-top: 8px; box-shadow: 0 6px 28px rgba(0,0,0,.14) !important; overflow: hidden; }
.vj-toc-widget-head {
    display: flex; align-items: center; justify-content: space-between;
    padding: 13px 18px; background: #fff !important; border-bottom: 1px solid #f0ece8; color: #1a1a1a !important;
}
.vj-toc-widget-title {
    display: flex; align-items: center;
    font-size: 13px; font-weight: 700; color: #1a1a1a !important;
    text-transform: uppercase; letter-spacing: .08em; margin: 0;
}
.vj-toc-widget-close {
    background: none !important; border: none; font-size: 14px; color: #aaa !important;
    cursor: pointer; padding: 3px 6px; border-radius: 4px;
    transition: color .15s, background .15s; line-height: 1;
}
.vj-toc-widget-close:hover { color: #333 !important; background: rgba(0,0,0,.06) !important; }
/* ── Nav links chung ── */
.vj-toc-nav { display: flex; flex-direction: column; padding: 6px 0 10px; gap: 0; max-height: 52vh; overflow-y: auto; }
.vj-toc-nav::-webkit-scrollbar { width: 3px; }
.vj-toc-nav::-webkit-scrollbar-thumb { background: rgba(0,0,0,.15); border-radius: 2px; }
.vj-toc-link { display: flex !important; align-items: flex-start; gap: 12px; font-size: 13px; color: #222 !important; text-decoration: none; padding: 7px 18px; border-radius: 0; line-height: 1.45; transition: background .14s, color .14s; }
.vj-toc-num { color: var(--mau1); font-weight: 700; font-size: 13px; min-width: 16px; flex-shrink: 0; line-height: 1.45; }
.vj-toc-link.vj-toc-h3 { padding-left: 18px; font-size: 12.5px; color: #555 !important; }
.vj-toc-link.vj-toc-h3 .vj-toc-num { color: #ccc; }
.vj-toc-link:hover { background: rgba(0,0,0,.04); color: #111 !important; }
.vj-toc-link.active { background: rgba(0,0,0,.06); color: #000 !important; font-weight: 600; }


.vj-sidebar-contact { padding: 16px !important; }
.vj-sidebar-contact .vj-sidebar-title { margin: -16px -16px 14px; }
.vj-sidebar-contact p { font-size: 13.5px; color: #666; margin-bottom: 12px; }
.vj-sidebar-contact .vj-btn-gold, .vj-sidebar-contact .vj-btn-outline { display: flex; align-items: center; justify-content: center; gap: 7px; margin-bottom: 8px; }

/* ---------- Mobile menu: Off-canvas slide từ trái ---------- */
@media (max-width: 767.98px) {
    /* Overlay */
    .menu-overlay {
        display: block !important;
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,.45);
        z-index: 1049; /* trong wpfixed stacking context, dưới navbar-collapse (1050) */
        opacity: 0;
        pointer-events: none;
        transition: opacity .3s ease;
        cursor: pointer;
    }
    .menu-overlay.show {
        opacity: 1;
        pointer-events: auto;
    }

    /* Neutralize Bootstrap collapse height animation */
    .vj-mainnav .navbar-collapse.collapsing {
        height: auto !important;
        overflow: visible !important;
        transition: transform .32s cubic-bezier(.4,0,.2,1) !important;
    }

    /* Panel */
    .vj-mainnav .navbar-collapse {
        display: flex !important;
        flex-direction: column;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        height: 100vh;
        width: 83%;
        max-width: 340px;
        background: #FFFDF8 !important;
        border-radius: 0 20px 20px 0;
        box-shadow: 6px 0 30px rgba(0,0,0,.2);
        transform: translateX(-100%);
        transition: transform .32s cubic-bezier(.4,0,.2,1);
        z-index: 1050 !important; /* trong wpfixed stacking context */
        overflow-y: auto;
        overflow-x: hidden;
        padding: 0 0 60px !important;
        border: none !important;
    }
    .vj-mainnav .navbar-collapse.show {
        transform: translateX(0);
    }

    /* Panel header zone (brand name) */
    .vj-mainnav .navbar-collapse::before {
        content: 'VIETJET\00A0TOURS';
        display: flex;
        align-items: center;
        flex-shrink: 0;
        min-height: 62px;
        padding: 0 56px 0 20px;
        font-size: 17px;
        font-weight: 900;
        letter-spacing: .06em;
        color: var(--mau1);
        background: #FFFDF8;
        border-bottom: 1.5px solid #f0ece5;
        position: sticky;
        top: 0;
        z-index: 2;
    }

    /* Close (X) button */
    .vj-mainnav .menu-close {
        position: absolute !important;
        top: 13px !important;
        right: 14px !important;
        width: 36px !important;
        height: 36px !important;
        border-radius: 50% !important;
        border: 1.5px solid #e0d8d0 !important;
        background: #fff !important;
        color: #555 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        z-index: 10 !important;
        cursor: pointer !important;
        font-size: 14px !important;
        padding: 0 !important;
        line-height: 1 !important;
        box-shadow: 0 1px 6px rgba(0,0,0,.1) !important;
        flex-shrink: 0 !important;
    }
    .vj-mainnav .menu-close:hover {
        border-color: var(--mau1) !important;
        color: var(--mau1) !important;
    }

    /* Nav list */
    .vj-mainnav .navbar-collapse .navbar-nav {
        flex: 1 1 auto;
        flex-direction: column !important;
        padding: 6px 0 !important;
        margin: 0 !important;
        width: 100% !important;
    }
    .vj-mainnav .navbar-collapse .navbar-nav > li {
        border-bottom: 1px solid #f0ece5;
    }

    /* Top-level links */
    .vj-mainnav .navbar-collapse .navbar-nav > li > .nav-link {
        min-height: 54px !important;
        padding: 0 16px 0 20px !important;
        display: flex !important;
        align-items: center !important;
        font-size: 14.5px !important;
        font-weight: 600 !important;
        color: #1e1e1e !important;
        text-decoration: none !important;
        gap: 12px !important;
        background: transparent !important;
        border: none !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    /* FA outline icons per menu item */
    .vj-mainnav .navbar-collapse .navbar-nav > li > .nav-link::before {
        font-family: 'Font Awesome 5 Pro';
        font-weight: 400;
        font-size: 16px;
        width: 20px;
        text-align: center;
        flex-shrink: 0;
        display: inline-block;
        color: var(--mau1);
        content: '\f111'; /* circle — fallback */
        border: none;
        border-radius: 0;
        background: none;
        height: auto;
    }
    .vj-mainnav .navbar-collapse .navbar-nav > li:nth-child(1) > .nav-link::before { content: '\f015'; } /* home */
    .vj-mainnav .navbar-collapse .navbar-nav > li:nth-child(2) > .nav-link::before { content: '\f072'; } /* plane */
    .vj-mainnav .navbar-collapse .navbar-nav > li:nth-child(3) > .nav-link::before { content: '\f5ab'; } /* passport */
    .vj-mainnav .navbar-collapse .navbar-nav > li:nth-child(4) > .nav-link::before { content: '\f0ac'; } /* globe */
    .vj-mainnav .navbar-collapse .navbar-nav > li:nth-child(5) > .nav-link::before { content: '\f7f2'; } /* clinic-medical */
    .vj-mainnav .navbar-collapse .navbar-nav > li:nth-child(6) > .nav-link::before { content: '\f1ea'; } /* newspaper */
    .vj-mainnav .navbar-collapse .navbar-nav > li:nth-child(7) > .nav-link::before { content: '\f0e0'; } /* envelope */
    .vj-mainnav .navbar-collapse .navbar-nav > li > .nav-link:hover {
        background: #FFF5EE !important;
        color: var(--mau1) !important;
    }

    /* Chevron for dropdowns (pure CSS, no font dependency) */
    .vj-mainnav .navbar-collapse .navbar-nav > li.menu-item-has-children > .nav-link::after,
    .vj-mainnav .navbar-collapse .navbar-nav > li.menu-item-has-children > .dropdown-toggle::after {
        content: '' !important;
        display: inline-block !important;
        width: 7px !important;
        height: 7px !important;
        border-right: 2px solid #bbb !important;
        border-top: 2px solid #bbb !important;
        border-left: none !important;
        border-bottom: none !important;
        transform: rotate(45deg) !important;
        transition: transform .25s ease, border-color .25s ease !important;
        margin-left: auto !important;
        flex-shrink: 0 !important;
        vertical-align: middle !important;
    }
    .vj-mainnav .navbar-collapse .navbar-nav > li.menu-item-has-children > [aria-expanded="true"]::after {
        transform: rotate(135deg) !important;
        border-color: var(--mau1) !important;
    }

    /* Active item: 3px red left bar */
    .vj-mainnav .navbar-collapse .navbar-nav > li.current-menu-item > .nav-link,
    .vj-mainnav .navbar-collapse .navbar-nav > li.current-menu-ancestor > .nav-link,
    .vj-mainnav .navbar-collapse .navbar-nav > li.current-page-ancestor > .nav-link {
        border-left: 3px solid var(--mau1) !important;
        padding-left: 17px !important;
        background: #FFF8F0 !important;
        color: var(--mau1) !important;
    }
    .vj-mainnav .navbar-collapse .navbar-nav > li.current-menu-item > .nav-link::before,
    .vj-mainnav .navbar-collapse .navbar-nav > li.current-menu-ancestor > .nav-link::before {
        font-weight: 900; /* solid icon for active */
    }

    /* Submenu (dropdown) */
    .vj-mainnav .navbar-collapse .dropdown-menu {
        position: static !important;
        background: #FFF5EE !important;
        border: none !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        padding: 0 !important;
        margin: 0 !important;
        width: 100% !important;
        float: none !important;
        transform: none !important;
    }
    .vj-mainnav .navbar-collapse .dropdown-menu .dropdown-item {
        min-height: 44px !important;
        padding: 0 16px 0 44px !important;
        display: flex !important;
        align-items: center !important;
        font-size: 13.5px !important;
        color: #444 !important;
        border-bottom: 1px solid #ede8e0 !important;
        font-weight: 500 !important;
        background: transparent !important;
        white-space: normal !important;
    }
    .vj-mainnav .navbar-collapse .dropdown-menu .dropdown-item:hover {
        background: #FFE8D6 !important;
        color: var(--mau1) !important;
    }

    /* Support 24/7 card — dính đáy panel */
    .vj-menu-phone {
        margin-top: auto;
        flex-shrink: 0;
        position: sticky;
        bottom: 0;
        width: 100%;
        padding: 16px 20px;
        background: #fff;
        border-radius: 0 0 20px 0;
        box-shadow: 0 -3px 12px rgba(0,0,0,.07);
        border-top: 1px solid #f0ece5;
        line-height: 1.6;
    }
    .vj-menu-phone a {
        display: block;
        font-size: 14px;
        font-weight: 700;
        color: var(--mau1);
        text-decoration: none;
    }
    .vj-menu-phone span {
        display: block;
        font-size: 13px;
        font-weight: 700;
        color: var(--mau1);
    }

    /* Toggler */
    .vj-mainnav .navbar-toggler { color: var(--mau4); border-color: rgba(122,31,23,.25); }
    .vj-mainnav .navbar-toggler i { color: var(--mau4); }
}

/* ======================================================
   PATCH: 9 mục LƯU Ý SEO / mobile
   ====================================================== */


/* --- Tab menu tablet --- */
@media (min-width: 768px) and (max-width: 991px) {
    .vj-tabnav-wrap { top: var(--vj-nav-bottom, 40px); }
    .vj-tabnav a { padding: 8px 14px; font-size: 13px; }
    .vj-sec { scroll-margin-top: calc(var(--vj-nav-bottom, 40px) + 44px); }
}

/* --- Tab menu mobile --- */
@media (max-width: 767px) {
    .vj-tabnav-wrap { top: var(--vj-nav-bottom, 40px); }
    .vj-tabnav a { padding: 8px 12px; font-size: 12.5px; }
    .vj-sec { scroll-margin-top: calc(var(--vj-nav-bottom, 40px) + 44px); }
    .vj-gallery-strip { display: block; }
    .vj-gal-arrow { width: 32px !important; height: 32px !important; font-size: 20px !important; }
}

/* --- Mục 8: Footer accordion mobile --- */
@media (min-width: 992px) {
    .vj-foot-acc-head .vj-foot-acc-chevron { display: none; }
    .vj-foot-acc-body { display: block !important; }
}
@media (max-width: 991px) {
    .vj-footer .vj-foot-acc-head .vj-foot-acc-chevron { display: none; }
    .vj-footer .vj-foot-acc-body { display: block !important; }
    .vj-footer .vj-foot-map-lg { height: 180px; }
    .vj-footer-menu-mobile-hide { display: block !important; }
}

/* --- Mục 8b: Footer mobile — rút ngắn khoảng trống để footer gọn hơn --- */
@media (max-width: 767px) {
    .vj-footer { padding: 28px 0 12px; }
    .vj-footer .row { row-gap: 14px; }
    .vj-footer .title-f { font-size: 14px; margin: 0 0 10px; padding-bottom: 7px; }
    .vj-footer .line { margin: 16px 0 10px; }
    .vj-biz-desc { display: none !important; }
    .vj-biz-list { margin: 0 0 8px; }
    .vj-biz-list li { margin-bottom: 5px; font-size: 13px; }
    .vj-footer .social_block { margin: 8px 0 0; gap: 10px; justify-content: center; }
    .vj-footer .social_block a { width: 32px; height: 32px; font-size: 15px; }
    .vj-footer-links li { margin-bottom: 6px; font-size: 13px; }
    .vj-foot-brand .vj-foot-logo img { height: 52px; }
    .vj-foot-map-lg { height: 240px !important; }
}

/* --- Mục 9: Mobile — booking box lên đầu, sticky trong col-lg-8 tự dừng trước vj-related --- */
@media (max-width: 991px) {
    .vj-single-top > .col-lg-4 { order: -1; margin-bottom: 20px; }
    .vj-single-top > .col-lg-8 { order: 0; }
    .vj-booking-box { position: static; }
}

/* --- Logo navbar căn giữa trên mobile --- */
@media (max-width: 767px) {
    .vj-mainnav .navbar { position: relative; }
    .vj-mainnav .navbar-brand {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        pointer-events: auto;
    }
}

/* --- vj-single-basics: grid 2 cột trên mobile --- */
@media (max-width: 767px) {
    .vj-single-basics {
        display: flex;
        flex-direction: column;
        gap: 8px;
        font-size: 13.5px;
        margin-bottom: 14px;
    }
    .vj-single-basics > span {
        display: flex;
        align-items: flex-start;
        line-height: 1.45;
    }
    .vj-single-basics > span > i {
        width: 16px;
        flex-shrink: 0;
        margin-right: 7px;
        margin-top: 2px;
        text-align: center;
    }
    .vj-single-basics .vj-transport-icons {
        display: flex;
        align-items: center;
        gap: 6px 18px;
        flex-wrap: wrap;
    }
    .vj-single-basics .vj-transport-icons .vj-tp-item {
        display: flex;
        align-items: center;
        gap: 5px;
        white-space: nowrap;
    }
}

/* ── Section "Liên quan" – carousel bài viết liên quan ── */
.vj-rel-section { margin: 0 0 24px; padding-top: 16px; border-top: 1px solid #f0e8db; }
.vj-rel-title {
    font-size: 20px; font-weight: 800;
    color: var(--mau4, #8b6a3c);
    text-transform: uppercase;
    letter-spacing: .02em;
    margin: 0 0 20px;
    padding-left: 56px;
}
@media (max-width: 991px) { .vj-rel-title { padding-left: 48px; } }
@media (max-width: 575px) { .vj-rel-title { padding-left: 12px; } }
/* Outer: padding dành chỗ cho nút Prev/Next (38px nút + 14px khoảng cách) */
.vj-rel-outer { position: relative; padding: 0 56px; }
.vj-rel-viewport { overflow: hidden; visibility: hidden; }
.vj-rel-track {
    display: flex;
    gap: 24px;
    transition: transform 0.42s cubic-bezier(.25,.46,.45,.94);
    will-change: transform;
}
/* Desktop: 4 card, gap 24px → 3 gaps = 72px */
.vj-rel-item { flex: 0 0 calc((100% - 72px) / 4); display: flex; }
.vj-rel-item .vj-post-rel-card { flex: 1; display: flex; flex-direction: column; }
.vj-rel-item .vj-post-rel-img { height: 190px; }
.vj-rel-item .vj-post-rel-body {
    flex: 1; display: flex; flex-direction: column; padding: 12px 14px 14px;
}
/* Metadata: chỉ ngày đăng */
.vj-prc-date {
    display: flex; align-items: center; gap: 4px;
    font-size: 11.5px; color: #a08060;
    margin-bottom: 6px; flex-shrink: 0;
}
.vj-prc-date i { font-size: 10px; }
/* Title: tối đa 2 dòng */
.vj-rel-item .vj-post-rel-body h4 {
    font-size: 13.5px; font-weight: 700; color: var(--mau4, #8b6a3c);
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
    margin: 0 0 7px; line-height: 1.45;
}
/* Excerpt: tối đa 2 dòng, lấp đầy phần còn lại */
.vj-prc-excerpt {
    font-size: 12.5px; color: #6b5a48; line-height: 1.6; margin: 0; flex: 1;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
/* Nút Prev / Next */
.vj-rel-btn {
    position: absolute; top: 50%; transform: translateY(-50%);
    width: 38px; height: 38px; border-radius: 50%;
    border: 1.5px solid #d4b896; background: #fff;
    color: var(--mau4, #8b6a3c); cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    font-size: 13px; padding: 0; z-index: 2;
    transition: background .2s, color .2s, border-color .2s;
    box-shadow: 0 2px 8px rgba(0,0,0,.08);
}
.vj-rel-btn.vj-rel-prev { left: 4px; }
.vj-rel-btn.vj-rel-next { right: 4px; }
.vj-rel-btn:hover { background: var(--mau4, #8b6a3c); color: #fff; border-color: var(--mau4, #8b6a3c); }
/* Dots */
.vj-rel-dots { display: flex; justify-content: center; gap: 7px; margin-top: 18px; }
.vj-rel-dot {
    width: 8px; height: 8px; border-radius: 50%;
    background: #d4b896; border: none; cursor: pointer; padding: 0; flex-shrink: 0;
    transition: background .25s, transform .25s;
}
.vj-rel-dot.active { background: var(--mau4, #8b6a3c); transform: scale(1.4); }
/* Tablet: 2 card, gap 24px → 1 gap = 24px */
@media (max-width: 991px) {
    .vj-rel-item { flex: 0 0 calc((100% - 24px) / 2); }
    .vj-rel-outer { padding: 0 48px; }
}
/* Mobile: danh sách dọc tĩnh (không carousel) */
.vj-rel-mobile-list { display: none; }
@media (max-width: 575px) {
    .vj-rel-carousel-wrap { display: none; }
    .vj-rel-mobile-list {
        display: flex;
        flex-direction: column;
        gap: 18px;
    }
    .vj-rel-mobile-item { display: flex; }
    .vj-rel-mobile-item .vj-post-rel-card { flex: 1; display: flex; flex-direction: column; }
    .vj-rel-mobile-item .vj-post-rel-img { height: 196px; }
    .vj-rel-mobile-item .vj-post-rel-body h4 { font-size: 15px; -webkit-line-clamp: 2; }
    .vj-rel-mobile-item .vj-prc-excerpt {
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
    .vj-rel-more-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 11px 28px;
        background: var(--mau2, #B08D57);
        border: none;
        border-radius: 4px;
        color: #fff;
        font-size: 13px;
        font-weight: 700;
        text-decoration: none;
        text-transform: uppercase;
        letter-spacing: .5px;
        margin-top: 8px;
        transition: background .2s;
        align-self: center;
    }
    .vj-rel-more-btn:hover { background: var(--mau4, #7A1F17); color: #fff; text-decoration: none; }
}

/* ====== Booking box mới: date pills + steppers + total ====== */
.vj-bk-new { padding: 18px 18px 14px; }
.vj-bk-new-head { display: flex; align-items: center; gap: 9px; border-bottom: 2px solid var(--mau3, #f4e8d0); padding-bottom: 12px; margin-bottom: 14px; }
.vj-bk-new-head > i { font-size: 17px; color: var(--mau1); }
.vj-bk-new-title { margin: 0; font-size: 14.5px; font-weight: 800; color: var(--mau4); text-transform: uppercase; letter-spacing: .3px; line-height: 1.2; }

/* Date pills */
/* Variant date dropdown */
.vj-bk-sel-wrap { position: relative; margin-bottom: 14px; }
.vj-bk-sel-wrap.open .vj-cal-chevron { transform: rotate(180deg); }
.vj-bk-sel-dropdown {
    display: none; position: absolute; top: calc(100% + 4px); left: 0; right: 0; z-index: 600;
    background: #fff; border: 1.5px solid #e4d4bc; border-radius: 10px;
    padding: 5px; box-shadow: 0 8px 28px rgba(0,0,0,.14);
    max-height: 260px; overflow-y: auto;
}
.vj-bk-sel-wrap.open .vj-bk-sel-dropdown { display: block; }
.vj-bk-sel-opt {
    display: flex !important; align-items: center !important; gap: 8px !important;
    width: 100% !important; text-align: left !important;
    padding: 9px 12px !important; border-radius: 7px !important;
    border: none !important; background: transparent !important;
    font-size: 13px !important; color: #333 !important; font-weight: 500 !important;
    cursor: pointer !important; box-shadow: none !important;
    text-transform: none !important; letter-spacing: 0 !important;
    transition: background .15s, color .15s;
}
.vj-bk-sel-opt:hover { background: #fdf6ef !important; color: var(--mau1) !important; }
.vj-bk-sel-opt.active { color: var(--mau1) !important; font-weight: 700 !important; background: #fdf6ef !important; }
.vj-sel-chk { font-size: 11px !important; color: var(--mau1) !important; flex-shrink: 0; visibility: hidden; }
.vj-bk-sel-opt.active .vj-sel-chk { visibility: visible; }

/* Passenger section */
.vj-bk-pax-section { background: #f9f5ef; border-radius: 10px; padding: 11px 12px 10px; margin-bottom: 12px; }
.vj-bk-pax-section-head { font-size: 13px; font-weight: 700; color: var(--mau4); margin-bottom: 9px; }
.vj-bk-pax-count { color: #888; font-weight: 600; }
.vj-bk-pax-rows { display: flex; flex-direction: column; gap: 9px; }
.vj-bk-pax-row { display: flex; align-items: center; gap: 7px; }
.vj-bk-pax-info { flex: 1; min-width: 0; }
.vj-bk-pax-info strong { display: block; font-size: 13px; font-weight: 700; color: #333; line-height: 1.2; }
.vj-bk-pax-info span { display: block; font-size: 11px; color: #999; }

/* Stepper +/- */
.vj-bk-stepper { display: flex; align-items: center; gap: 3px; flex-shrink: 0; }
.vj-step-btn {
    width: 26px !important; height: 26px !important; border-radius: 50% !important; padding: 0 !important;
    border: 1.5px solid #ccc !important; background: #fff !important; color: #555 !important;
    font-size: 15px !important; line-height: 1 !important; cursor: pointer; font-weight: 700 !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
    box-shadow: none !important; text-transform: none !important;
    transition: border-color .15s, background .15s, color .15s;
}
.vj-step-btn:hover { border-color: var(--mau1) !important; color: var(--mau1) !important; background: #fff4f4 !important; }
.vj-step-count { width: 22px; text-align: center; font-size: 14px; font-weight: 700; color: #222; }
.vj-bk-unit-price { font-size: 12px; font-weight: 600; color: #666; white-space: nowrap; text-align: right; min-width: 70px; }

/* Availability badge */
.vj-bk-avail { font-size: 13px; font-weight: 600; color: #1a7a3e; background: #eaf7f0; border: 1px solid #b8e5cd; border-radius: 8px; padding: 7px 11px; margin-bottom: 12px; }
.vj-bk-avail.het { color: #b03127; background: #fdecea; border-color: #f5c6c0; }
.vj-bk-avail.het i { margin-right: 5px; }

/* Total bar */
.vj-bk-total-bar { display: flex; align-items: center; justify-content: space-between; padding: 10px 0; border-top: 1px dashed #e0cfb6; border-bottom: 1px dashed #e0cfb6; margin-bottom: 14px; }
.vj-bk-total-label { font-size: 14px; font-weight: 700; color: var(--mau4); }
.vj-bk-total-amt { font-size: 22px; font-weight: 800; color: var(--mau1); letter-spacing: -.3px; }

/* CTA buttons */
.vj-bk-actions { display: flex; gap: 8px; margin-bottom: 12px; }
.vj-bk-btn-main {
    flex: 1; padding: 11px 6px; border-radius: 8px; border: none !important;
    background: var(--mau1) !important; color: #fff !important; font-size: 13.5px; font-weight: 800 !important;
    cursor: pointer; text-align: center; text-transform: uppercase !important; letter-spacing: .3px;
    transition: background .18s; box-shadow: none !important;
}
.vj-bk-btn-main:hover { background: #8f0d0d !important; }
.vj-bk-btn-main.soldout { background: #bbb !important; cursor: not-allowed; }
.vj-bk-btn-consult {
    flex: 1; padding: 11px 6px; border-radius: 8px;
    border: 2px solid var(--mau1) !important; background: #fff !important; color: var(--mau1) !important;
    font-size: 13.5px; font-weight: 800; cursor: pointer; text-align: center;
    text-transform: uppercase; letter-spacing: .3px; text-decoration: none !important;
    transition: background .18s, color .18s;
    display: flex; align-items: center; justify-content: center;
}
.vj-bk-btn-consult:hover { background: var(--mau1) !important; color: #fff !important; }
.vj-bk-btn-zalo {
    display: flex !important; align-items: center; justify-content: center; gap: 8px;
    width: 100%; padding: 12px 10px; border-radius: 8px;
    background: var(--mau1) !important; color: #fff !important;
    font-size: 14px; font-weight: 800; text-align: center;
    text-transform: uppercase; letter-spacing: .4px; text-decoration: none !important;
    transition: background .18s, box-shadow .18s;
    box-shadow: 0 3px 10px rgba(176,16,16,.22);
}
.vj-bk-btn-zalo:hover { background: #8f0d0d !important; color: #fff !important; text-decoration: none !important; box-shadow: 0 4px 14px rgba(176,16,16,.32); }

/* Tooltip ⓘ loại khách */
.vj-bk-info-wrap { position: relative; display: inline-block; vertical-align: middle; margin-left: 5px; }
.vj-bk-info-btn {
    background: none !important; border: none !important; padding: 0 2px !important;
    color: #aaa !important; font-size: 15px !important; cursor: pointer; line-height: 1 !important;
    box-shadow: none !important; width: auto !important; height: auto !important;
    border-radius: 0 !important; display: inline-flex !important; align-items: center !important;
    text-transform: none !important; font-weight: 400 !important; transition: color .15s;
}
.vj-bk-info-btn:hover { color: var(--mau1) !important; }
.vj-bk-tooltip {
    display: none; position: absolute; left: 50%; transform: translateX(-50%);
    bottom: calc(100% + 8px); z-index: 1000;
    background: #2b2b2b; color: #fff; font-size: 12.5px; font-weight: 400; line-height: 1.55;
    border-radius: 9px; padding: 10px 13px; width: 230px; text-align: center; white-space: normal;
    box-shadow: 0 4px 14px rgba(0,0,0,0.22); pointer-events: none;
}
.vj-bk-tooltip::after {
    content: ''; position: absolute; top: 100%; left: 50%; transform: translateX(-50%);
    border: 6px solid transparent; border-top-color: #2b2b2b;
}
.vj-bk-info-wrap:hover .vj-bk-tooltip,
.vj-bk-info-wrap.show-tip .vj-bk-tooltip { display: block; }

/* ====== Mini Calendar date picker (dropdown) ====== */
.vj-bk-cal-wrap { position: relative; margin-bottom: 14px; }
.vj-bk-cal-trigger {
    width: 100% !important; display: flex !important; align-items: center; gap: 9px;
    padding: 10px 13px !important; border-radius: 8px !important;
    border: 1.5px solid #ddd !important; background: #fff !important; color: #444 !important;
    font-size: 13.5px !important; font-weight: 600 !important; cursor: pointer;
    text-align: left !important; text-transform: none !important; box-shadow: none !important;
    transition: border-color .18s;
}
.vj-bk-cal-trigger:hover { border-color: var(--mau1) !important; color: var(--mau1) !important; }
.vj-bk-cal-trigger > i:first-child { color: var(--mau1); font-size: 14px; flex-shrink: 0; }
.vj-bk-cal-trigger > span { flex: 1; }
.vj-cal-chevron { font-size: 11px !important; color: #aaa; transition: transform .2s; flex-shrink: 0; }
.vj-bk-cal-wrap.open .vj-bk-cal-trigger { border-color: var(--mau1) !important; }
.vj-bk-cal-wrap.open .vj-cal-chevron { transform: rotate(180deg); }

#vj-cal-overlay {
    display: none; position: absolute; top: calc(100% + 4px); left: 0; right: 0; z-index: 600;
    background: #fff; border: 1.5px solid #e4d4bc; border-radius: 12px;
    padding: 14px 12px 12px; box-shadow: 0 8px 28px rgba(0,0,0,.14);
}
#vj-bk-cal { user-select: none; -webkit-user-select: none; }

.vj-cal-nav { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.vj-cal-arr {
    width: 28px !important; height: 28px !important; border-radius: 50% !important;
    border: 1.5px solid #ddd !important; background: #fff !important; color: #555 !important;
    font-size: 20px !important; line-height: 1 !important; cursor: pointer; padding: 0 !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
    box-shadow: none !important; text-transform: none !important; font-weight: 300 !important;
    transition: border-color .15s, color .15s;
}
.vj-cal-arr:hover:not(:disabled) { border-color: var(--mau1) !important; color: var(--mau1) !important; background: #fff4f4 !important; }
.vj-cal-arr:disabled { opacity: .3; cursor: not-allowed; }
.vj-cal-mlabel { font-size: 13.5px; font-weight: 800; color: var(--mau4); letter-spacing: .2px; }

.vj-cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px 1px; }
.vj-cal-dow { font-size: 10px; font-weight: 700; color: #bbb; text-align: center; padding: 4px 0 3px; letter-spacing: .2px; }
.vj-cal-cell {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    min-height: 36px; border-radius: 6px; cursor: default; padding: 3px 1px;
    transition: background .15s, color .15s;
}
.vj-cell-day  { font-size: 12.5px; font-weight: 600; color: #ccc; line-height: 1.2; }
.vj-cell-price { font-size: 8px; font-weight: 700; color: var(--mau1); line-height: 1; margin-top: 1px; }
.vj-cal-cell.off  .vj-cell-day { color: #ddd; }
.vj-cal-cell.empty { background: transparent !important; }
.vj-cal-cell.avail { background: #fff8f8; cursor: pointer; }
.vj-cal-cell.avail .vj-cell-day { color: var(--mau1); }
.vj-cal-cell.avail:hover { background: #ffe0e0; }
.vj-cal-cell.full  .vj-cell-day { color: #ccc; }
.vj-cal-cell.full  { background: #f7f7f7; cursor: not-allowed; }
.vj-cal-cell.sel   { background: var(--mau1) !important; }
.vj-cal-cell.sel .vj-cell-day  { color: #fff !important; }
.vj-cal-cell.sel .vj-cell-price { color: rgba(255,255,255,.8) !important; }