/* ==========================================================================
   GREENTOURS — giao diện riêng của theme GreenTours (nạp SAU main.css / home.css / custom.css)
   Màu lấy từ logo Greentours Việt Nam: xanh lá #1B8F46 → xanh nõn chuối #8DC048.
   Font: BeVietnamPro có sẵn trong theme (main.css khai @font-face 400–900; 300 là bản nghiêng → không dùng).
   Sửa file này xong phải chép sang public/themes/greentours/dist/assets/css/.

   Mục lục
     1. Biến + đổi bộ màu cũ của theme sang xanh lá
     2. Nền chung: khung, nút, phần (section), phần đầu khối
     3. Đầu trang
     4. Menu điện thoại
     5. Chân trang + nút lên đầu trang
   ========================================================================== */

/* 1. Biến ------------------------------------------------------------------ */
:root {
    --gt-g900: #062618;
    --gt-g800: #0a3a24;
    --gt-g700: #0f5a31;
    --gt-primary: #15813d;          /* nền nút: đậm hơn logo một chút để chữ trắng đủ tương phản */
    --gt-brand: #1b8f46;            /* xanh của logo */
    --gt-g500: #3e9a45;
    --gt-lime: #8dc048;             /* xanh nõn chuối cuối chữ logo */
    --gt-lime-2: #b8dc74;
    --gt-mint: #eaf5e2;
    --gt-mint-2: #f4f9f0;
    --gt-ink: #10241a;              /* tiêu đề */
    --gt-text: #4a5a50;             /* chữ thường */
    --gt-muted: #7b8a80;
    --gt-line: #e2ebe3;
    --gt-amber: #f5a623;            /* điểm đánh giá, nhãn nổi bật */
    --gt-white: #fff;
    --gt-grad: linear-gradient(90deg, #1b8f46 0%, #8dc048 100%);
    --gt-grad-diag: linear-gradient(135deg, #1b8f46 0%, #8dc048 100%);
    --gt-grad-dark: linear-gradient(150deg, #0a3a24 0%, #062618 100%);
    --gt-radius: 20px;
    --gt-radius-md: 16px;
    --gt-radius-sm: 12px;
    --gt-shadow: 0 10px 30px rgba(16, 36, 26, .08);
    --gt-shadow-lg: 0 22px 50px rgba(16, 36, 26, .16);
    --gt-ease: cubic-bezier(.2, .7, .2, 1);

    /* Bộ màu cũ của theme (main.css) — đổi theo thương hiệu để phần chưa dựng lại cũng cùng tông */
    --primary-color: #15813d;
    --primary-gradient: linear-gradient(90deg, #1b8f46 0%, #8dc048 100%);
    --primary-gradient-2: linear-gradient(90deg, #1b8f46 0%, #15813d 100%);
    --secondary-color: #8dc048;
    --text-color: #10241a;
    --text-color2: #3c5546;
    --text-color3: #8dc048;
    --bg5: #f5a623;
}

/* 2. Nền chung --------------------------------------------------------------- */
/* main.css ép html/body overflow-x:hidden, home.css (≤991px) ép body overflow:hidden → position:sticky chết.
   clip cắt tràn ngang mà không tạo khung cuộn nên sticky vẫn chạy. */
html { overflow-x: clip !important; }
body.frontend-page, body.user-page { overflow: visible !important; overflow-x: clip !important; }
body.frontend-page { color: var(--gt-text); background: #fff; }

.gt-wrap { width: 100%; max-width: 1320px; margin: 0 auto; padding: 0 20px; }
@media (max-width: 575.98px) { .gt-wrap { padding: 0 16px; } }

.gt-sec { position: relative; padding: 88px 0; }
.gt-sec--soft { background: var(--gt-mint-2); }
.gt-sec--leaf {
    background-color: var(--gt-mint);
    background-image:
        radial-gradient(circle at 8% 12%, rgba(141, 192, 72, .22) 0, transparent 34%),
        radial-gradient(circle at 92% 88%, rgba(27, 143, 70, .14) 0, transparent 36%),
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'%3E%3Cpath d='M20 70c10-22 32-30 52-26-6 20-26 34-52 26z' fill='none' stroke='%231b8f46' stroke-opacity='.07' stroke-width='1.6'/%3E%3Cpath d='M20 70c14-10 28-16 44-20' fill='none' stroke='%231b8f46' stroke-opacity='.07' stroke-width='1.6'/%3E%3C/svg%3E");
    background-size: auto, auto, 170px 170px;
}
.gt-sec--forest { background: var(--gt-grad-dark); color: rgba(255, 255, 255, .82); }
@media (max-width: 991.98px) { .gt-sec { padding: 64px 0; } }
@media (max-width: 575.98px) { .gt-sec { padding: 52px 0; } }

/* Nút */
.gt-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    min-height: 46px; padding: 0 24px; border-radius: 999px; border: 1.5px solid transparent;
    font-size: 15px; font-weight: 600; line-height: 1.2; white-space: nowrap; cursor: pointer;
    text-decoration: none !important; transition: transform .25s var(--gt-ease), box-shadow .25s, background .25s, color .25s;
}
.gt-btn svg { flex-shrink: 0; }
.gt-btn--sm { min-height: 40px; padding: 0 18px; font-size: 14px; }
.gt-btn--primary { background: var(--gt-primary); color: #fff !important; }
.gt-btn--primary:hover { background: var(--gt-g700); }
.gt-btn--grad { background: var(--gt-grad); color: #fff !important; box-shadow: 0 8px 20px rgba(27, 143, 70, .28); }
.gt-btn--grad:hover { transform: translateY(-2px); box-shadow: 0 12px 26px rgba(27, 143, 70, .36); }
.gt-btn--outline { border-color: var(--gt-primary); color: var(--gt-primary) !important; background: transparent; }
.gt-btn--outline:hover { background: var(--gt-primary); color: #fff !important; }
.gt-btn--ghost { border-color: rgba(16, 36, 26, .14); color: var(--gt-ink) !important; background: #fff; }
.gt-btn--ghost:hover { border-color: var(--gt-primary); color: var(--gt-primary) !important; }
.gt-btn--white { background: #fff; color: var(--gt-g800) !important; }
.gt-btn--white:hover { background: var(--gt-lime); color: var(--gt-g900) !important; }
.gt-btn__arrow { width: 26px; height: 26px; border-radius: 50%; display: inline-grid; place-items: center; background: rgba(255, 255, 255, .22); margin-right: -10px; }

/* Phần đầu khối: dòng nhỏ + tiêu đề 2 dòng (--inline: chung một dòng, VD "Vì sao chọn Greentours") */
.gt-head { text-align: center; max-width: 860px; margin: 0 auto 48px; }
.gt-head__kicker {
    display: inline-flex; align-items: center; gap: 8px; margin-bottom: 14px;
    font-size: 13px; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; color: var(--gt-brand);
}
.gt-head__kicker::before, .gt-head__kicker::after { content: ""; width: 26px; height: 2px; border-radius: 2px; background: var(--gt-grad); }
.gt-head__title {
    margin: 0; color: var(--gt-ink); font-size: clamp(28px, 3.6vw, 46px); font-weight: 800 !important;
    line-height: 1.2; letter-spacing: -.01em; text-wrap: balance;
}
.gt-head__title span { display: block; }
.gt-head__title em { font-style: normal; background: var(--gt-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.gt-head__desc { margin: 16px auto 0; max-width: 640px; font-size: 16px; line-height: 1.7; color: var(--gt-text); text-wrap: pretty; }
.gt-head--left { text-align: left; margin-left: 0; }
.gt-head--inline .gt-head__title span { display: inline; }
.gt-sec--forest .gt-head__title { color: #fff; }
.gt-sec--forest .gt-head__kicker { color: var(--gt-lime); }
.gt-sec--forest .gt-head__desc { color: rgba(255, 255, 255, .75); }
.gt-more { display: flex; justify-content: center; margin-top: 44px; }
@media (max-width: 575.98px) {
    .gt-head { margin-bottom: 32px; }
    .gt-head__kicker { font-size: 12px; letter-spacing: .16em; }
}

/* Ô điểm đánh giá + nhãn */
.gt-score { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--gt-muted); }
.gt-score b { display: inline-flex; align-items: center; gap: 4px; padding: 3px 8px; border-radius: 8px; background: #fff4df; color: #9a6100; font-size: 13px; font-weight: 700; }
.gt-score b svg { color: var(--gt-amber); fill: var(--gt-amber); }
.gt-tag { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; line-height: 1; }
.gt-tag--hot { background: var(--gt-grad); color: #fff; }
.gt-tag--white { background: rgba(255, 255, 255, .92); color: var(--gt-ink); }

/* Ảnh giữ chỗ khi thiếu ảnh */
.gt-noimg { display: grid; place-items: center; background: var(--gt-mint); color: var(--gt-brand); }

/* Luật cũ footer Danang24h (khối Giải thưởng kiểu cũ dùng) */
h4.prize-title { color: #00072B; font-size: 14px; text-align: center; line-height: 22px; margin: 15px 0 0 0; }
.color-dark .text-primary { color: #000 !important; }

/* 3. Đầu trang ---------------------------------------------------------------- */
.gt-header { position: relative; z-index: 100; }
.gt-topbar { background: var(--gt-g800); color: rgba(255, 255, 255, .85); font-size: 13.5px; }
.gt-topbar__in { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 42px; }
.gt-topbar a { color: inherit; text-decoration: none; }
.gt-topbar a:hover { color: var(--gt-lime); }
.gt-topbar__contact { display: flex; align-items: center; gap: 26px; }
.gt-topbar__contact a { display: inline-flex; align-items: center; gap: 8px; }
.gt-topbar__contact svg { color: var(--gt-lime); }
.gt-topbar__contact strong { color: #fff; font-weight: 700; }
.gt-topbar__right { display: flex; align-items: center; gap: 18px; }
.gt-topbar__menu ul { display: flex; align-items: center; gap: 18px; margin: 0; padding: 0; list-style: none; }
.gt-topbar__menu li { margin: 0 !important; }
.gt-topbar__menu ul ul { display: none; }
.gt-topbar__lang { display: flex; align-items: center; margin: 0 !important; padding: 0; list-style: none; }
.gt-topbar__lang > li > a, .gt-topbar__lang > li > a * { color: rgba(255, 255, 255, .88) !important; font-size: 13.5px; }
.gt-topbar__lang > li > a { display: inline-flex; align-items: center; gap: 6px; }
.gt-topbar__lang .dropdown-menu a, .gt-topbar__lang .dropdown-menu a * { color: var(--gt-ink) !important; }
/* Widget dịch tự động của core (#gtranslate-auto-injected) thay nút ngôn ngữ: chữ sáng trên thanh trên */
.gt-topbar__lang .gt-widget-selected, .gt-topbar__lang .gt-widget-selected * { color: rgba(255, 255, 255, .88) !important; font-size: 13.5px !important; }
.gt-topbar__lang .gt-widget-dropdown, .gt-topbar__lang .gt-widget-dropdown * { color: var(--gt-ink) !important; }
.gt-topbar__lang .dropdown-menu { z-index: 1100; }

.gt-bar { position: relative; background: #fff; box-shadow: 0 1px 0 var(--gt-line); transition: background .3s, box-shadow .3s, transform .35s var(--gt-ease); }
.gt-bar__in { display: flex; align-items: center; gap: 24px; min-height: 80px; }
.gt-logo { position: relative; display: inline-flex; align-items: center; flex-shrink: 0; }
.gt-logo img { height: 48px; width: auto; max-width: 240px; object-fit: contain; }
.gt-logo__white { position: absolute; left: 0; top: 50%; transform: translateY(-50%); opacity: 0; transition: opacity .3s; }
.gt-nav { flex: 1; min-width: 0; }
.gt-bar__actions { display: flex; align-items: center; gap: 10px; margin-left: auto; }

/* Menu chính (MenuWalker in .main-menu — đè các luật cũ của main.css: ẩn mục ≥7, caret tuyệt đối, padding 0 !important) */
.gt-nav .main-menu { display: flex; align-items: center; justify-content: center; gap: 4px; margin: 0 !important; padding: 0; list-style: none; }
.gt-nav .main-menu > li.depth-0,
.gt-nav .main-menu > li.depth-0:nth-child(n+7) { display: block; position: relative; margin: 0 !important; }
.gt-nav .main-menu > li > a {
    position: relative; display: inline-flex; align-items: center; gap: 6px; padding: 9px 12px !important;
    border-radius: 999px; color: var(--gt-ink) !important; font-size: 15px; font-weight: 600; white-space: nowrap;
    text-decoration: none; transition: background .25s, color .25s;
}
.gt-nav .main-menu i.caret { position: static; width: auto; height: auto; margin: 0; font-size: 11px; opacity: .7; }
.gt-nav .main-menu > li:hover > a, .gt-nav .main-menu > li.active > a { background: var(--gt-mint); color: var(--gt-primary) !important; }
/* main.css ép ".main-menu ul { display:flex }" → menu con xếp ngang; trả về khối dọc */
.gt-nav .children-menu, .gt-nav .gt-nav__more-menu { display: block; }
.gt-nav .children-menu {
    position: absolute; top: calc(100% + 10px); left: 0; min-width: 230px; margin: 0; padding: 10px;
    list-style: none; background: #fff; border-radius: var(--gt-radius-md); box-shadow: var(--gt-shadow-lg);
    opacity: 0; visibility: hidden; transform: translateY(8px); transition: all .25s var(--gt-ease); z-index: 50;
}
.gt-nav .children-menu::before { content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 12px; }
.gt-nav li:hover > .children-menu, .gt-nav li:focus-within > .children-menu { opacity: 1; visibility: visible; transform: none; }
.gt-nav .children-menu li { position: relative; display: block; margin: 0 !important; }
.gt-nav .children-menu a {
    display: flex !important; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 14px !important;
    border-radius: 10px; color: var(--gt-ink) !important; font-size: 14.5px; font-weight: 500; text-decoration: none;
}
.gt-nav .children-menu a:hover { background: var(--gt-mint) !important; color: var(--gt-primary) !important; }
.gt-nav .children-menu .children-menu { top: -10px; left: calc(100% + 8px); }
.gt-nav .-has-mega-menu > a { padding-right: 14px !important; }
/* Mega menu (Quản trị → Menu → bật "Mega menu" ở mục cấp 1, như danang24h): mỗi mục cấp 2 là một CỘT — tên cột (VD Du lịch
   miền Bắc) + các mục cấp 3 xếp dọc bên dưới (Tour Hà Nội, Tour Sa Pa…). MenuWalker in li.-has-mega-menu > div.mega > ul.children-menu.
   greentour.js dịch khung khi tràn mép phải màn hình. */
.gt-nav .-has-mega-menu > .mega {
    position: absolute; top: calc(100% + 10px); left: 0; z-index: 50; display: block; width: max-content; max-width: calc(100vw - 40px);
    padding: 18px 20px; background: #fff; border-radius: var(--gt-radius-md); box-shadow: var(--gt-shadow-lg);
    opacity: 0; visibility: hidden; transform: translateY(8px); transition: opacity .25s var(--gt-ease), transform .25s var(--gt-ease), visibility .25s;
}
.gt-nav .-has-mega-menu > .mega::before { content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 12px; }
.gt-nav .-has-mega-menu:hover > .mega, .gt-nav .-has-mega-menu:focus-within > .mega { opacity: 1; visibility: visible; transform: none; }
.gt-nav .mega > .children-menu {
    position: static; display: flex !important; flex-wrap: wrap; gap: 6px 26px; min-width: 0; padding: 0; background: none; box-shadow: none;
    opacity: 1; visibility: inherit; transform: none;   /* inherit: ẩn/hiện THEO khung .mega — visible ở đây làm danh sách vô hình vẫn bắt chuột, đè lên mega khác */
}
.gt-nav .mega > .children-menu::before { display: none; }
.gt-nav .mega > .children-menu > li { flex: 0 0 auto; min-width: 180px; max-width: 260px; }
/* Tên cột */
.gt-nav .mega > .children-menu > li > a {
    padding: 8px 12px !important; color: var(--gt-brand) !important; font-size: 13.5px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase;
}
.gt-nav .mega > .children-menu > li > a:hover { background: var(--gt-mint) !important; color: var(--gt-primary) !important; }
.gt-nav .mega > .children-menu > li > a i.caret { display: none; }
/* Các mục trong cột: luôn hiện, xếp dọc (không bay sang phải như menu con thường) */
.gt-nav .mega .children-menu .children-menu {
    position: static; display: block !important; min-width: 0; margin: 2px 0 6px; padding: 0; background: none; box-shadow: none;
    opacity: 1; visibility: inherit; transform: none;
}
.gt-nav .mega .children-menu .children-menu::before { display: none; }
.gt-nav .mega .children-menu .children-menu a { padding: 8px 12px !important; font-size: 14.5px; font-weight: 500; white-space: nowrap; }
.gt-nav .mega .children-menu .children-menu .children-menu { padding-left: 12px; }   /* cấp 4 (nếu có): thụt lề */
/* Ảnh minh hoạ cạnh mega (ô "Ảnh" của mục mega trong admin) */
.gt-nav .mega.--has-mega-image { display: flex; gap: 22px; align-items: flex-start; }
.gt-nav .mega .mega-image { flex-shrink: 0; width: 220px; }
.gt-nav .mega .mega-image img { width: 100%; height: auto; border-radius: 12px; object-fit: cover; }
/* Mục mega bị dồn vào nút "…": khung bung sang TRÁI như menu con khác trong "…" */
.gt-nav .gt-nav__more-menu > .-has-mega-menu > .mega { top: -8px; left: auto !important; right: calc(100% + 10px); margin-left: 0 !important; }
.gt-nav .gt-nav__more-menu > .-has-mega-menu > .mega::before { left: auto; right: -12px; top: 0; bottom: 0; width: 12px; height: auto; }

/* 3b. Nút "…" của menu chính (greentour.js dồn các mục không vừa vào đây, bấm để mở) ---------------------------- */
.gt-nav .main-menu > li.gt-nav__more { position: relative; flex-shrink: 0; }
.gt-nav__more-btn {
    display: inline-grid; place-items: center; width: 46px; height: 40px; padding: 0; border: 0; border-radius: 999px;
    background: transparent; color: var(--gt-brand); cursor: pointer; transition: background .25s, color .25s;
}
.gt-nav__more-btn:hover, .gt-nav__more.is-open > .gt-nav__more-btn, .gt-nav__more.active > .gt-nav__more-btn { background: var(--gt-mint); color: var(--gt-primary); }
.gt-nav__more-btn:focus-visible { outline: 2px solid var(--gt-lime); outline-offset: 2px; }
.gt-header--overlay .gt-nav__more-btn { color: #fff; }
.gt-header--overlay .gt-nav__more-btn:hover,
.gt-header--overlay .gt-nav__more.is-open > .gt-nav__more-btn,
.gt-header--overlay .gt-nav__more.active > .gt-nav__more-btn { background: rgba(255, 255, 255, .16); color: #fff; }
.gt-header--overlay.is-stuck .gt-nav__more-btn { color: var(--gt-brand); }
.gt-header--overlay.is-stuck .gt-nav__more-btn:hover,
.gt-header--overlay.is-stuck .gt-nav__more.is-open > .gt-nav__more-btn { background: var(--gt-mint); color: var(--gt-primary); }

.gt-nav__more-menu {
    position: absolute; top: calc(100% + 12px); right: 0; z-index: 60; min-width: 240px; margin: 0; padding: 8px 10px;
    list-style: none; background: #fff; border-radius: var(--gt-radius-md); box-shadow: var(--gt-shadow-lg);
    opacity: 0; visibility: hidden; transform: translateY(8px); transition: all .25s var(--gt-ease);
}
.gt-nav__more.is-open > .gt-nav__more-menu { opacity: 1; visibility: visible; transform: none; }
.gt-nav__more-menu > li { position: relative; display: block; margin: 0 !important; }
.gt-nav__more-menu > li + li { border-top: 1px solid var(--gt-line); }
.gt-nav__more-menu > li > a {
    display: flex !important; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 12px !important;
    border-radius: 10px; color: var(--gt-ink) !important; font-size: 15px; font-weight: 600; white-space: nowrap; text-decoration: none;
    background: transparent !important; transition: background .2s, color .2s;
}
.gt-nav__more-menu > li:hover > a, .gt-nav__more-menu > li.active > a { background: var(--gt-mint) !important; color: var(--gt-primary) !important; }
.gt-nav__more-menu i.caret { position: static; width: auto; height: auto; margin: 0; font-size: 11px; opacity: .7; transform: rotate(90deg); }
/* Mục con của mục bị dồn: bung sang TRÁI (khung "…" nằm sát mép phải) */
.gt-nav .gt-nav__more-menu > li > .children-menu { top: -8px; left: auto; right: calc(100% + 10px); }
.gt-nav .gt-nav__more-menu > li > .children-menu::before { left: auto; right: -12px; top: 0; bottom: 0; width: 12px; height: auto; }

/* Nút tròn + người dùng */
.gt-icon-btn {
    position: relative; display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 50%;
    border: 1.5px solid var(--gt-line); background: #fff; color: var(--gt-ink); cursor: pointer; transition: all .25s;
}
.gt-icon-btn:hover { border-color: var(--gt-primary); color: var(--gt-primary); }
.gt-icon-btn__count {
    position: absolute; top: -4px; right: -4px; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 999px;
    background: var(--gt-lime); color: var(--gt-g900); font-size: 11px; font-weight: 800; line-height: 20px; text-align: center;
}
.gt-user__btn {
    display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 14px; border-radius: 999px;
    border: 1.5px solid var(--gt-line); color: var(--gt-ink) !important; font-size: 14px; font-weight: 600; text-decoration: none;
}
.gt-user__menu { border: 0; border-radius: var(--gt-radius-sm); box-shadow: var(--gt-shadow-lg); padding: 8px; }
.gt-user__menu .dropdown-item { border-radius: 8px; padding: 9px 12px; font-size: 14px; }
.gt-user__menu .dropdown-item:hover { background: var(--gt-mint); color: var(--gt-primary); }

/* Trang chủ: đầu trang nằm đè lên ảnh hero, thanh menu là khung kính mờ */
.gt-header--overlay { position: absolute; top: 0; left: 0; right: 0; }
.gt-header--overlay .gt-topbar { background: transparent; border-bottom: 1px solid rgba(255, 255, 255, .14); }
.gt-header--overlay .gt-bar { background: transparent; box-shadow: none; padding-top: 14px; }
.gt-header--overlay .gt-bar__in {
    min-height: 74px; padding: 0 14px 0 22px; border-radius: 22px; border: 1px solid rgba(255, 255, 255, .26);
    background: rgba(6, 38, 24, .32); -webkit-backdrop-filter: blur(16px) saturate(140%); backdrop-filter: blur(16px) saturate(140%);
    box-shadow: 0 10px 40px rgba(0, 0, 0, .12);
}
.gt-header--overlay .gt-logo__color { opacity: 0; }
.gt-header--overlay .gt-logo__white { opacity: 1; }
.gt-header--overlay .gt-nav .main-menu > li > a { color: #fff !important; }
.gt-header--overlay .gt-nav .main-menu > li:hover > a,
.gt-header--overlay .gt-nav .main-menu > li.active > a { background: rgba(255, 255, 255, .16); color: #fff !important; }
.gt-header--overlay .gt-icon-btn,
.gt-header--overlay .gt-user__btn { background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .3); color: #fff !important; }
.gt-header--overlay .gt-btn--ghost { background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .35); color: #fff !important; }
.gt-header--overlay .gt-btn--ghost:hover { background: #fff; color: var(--gt-g800) !important; }

/* Trang con: cả đầu trang dính (sticky), thanh trên trượt khuất, chỉ còn thanh menu */
.gt-header--solid { position: sticky; top: -42px; }
.gt-header--solid.is-stuck .gt-bar { box-shadow: 0 8px 30px rgba(16, 36, 26, .1); }
@media (max-width: 991.98px) { .gt-header--solid { top: 0; } }

/* Trang chủ, cuộn xuống: thanh kính thành thanh trắng cố định (greentour.js gắn .is-stuck lên .gt-header) */
.gt-header--overlay.is-stuck .gt-bar {
    position: fixed; top: 0; left: 0; right: 0; z-index: 1000; padding-top: 0; background: rgba(255, 255, 255, .96);
    -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: 0 8px 30px rgba(16, 36, 26, .1);
    animation: gtSlideDown .4s var(--gt-ease);
}
.gt-header--overlay.is-stuck .gt-bar__in { min-height: 70px; border: 0; border-radius: 0; background: transparent; padding: 0; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
.gt-header.is-stuck .gt-logo img { height: 42px; }
.gt-header.is-stuck .gt-logo__color { opacity: 1; }
.gt-header.is-stuck .gt-logo__white { opacity: 0; }
.gt-header.is-stuck .gt-nav .main-menu > li > a { color: var(--gt-ink) !important; }
.gt-header.is-stuck .gt-nav .main-menu > li:hover > a,
.gt-header.is-stuck .gt-nav .main-menu > li.active > a { background: var(--gt-mint); color: var(--gt-primary) !important; }
.gt-header.is-stuck .gt-icon-btn, .gt-header.is-stuck .gt-user__btn { background: #fff; border-color: var(--gt-line); color: var(--gt-ink) !important; }
.gt-header.is-stuck .gt-btn--ghost { background: #fff; border-color: rgba(16, 36, 26, .14); color: var(--gt-ink) !important; }
@keyframes gtSlideDown { from { transform: translateY(-100%); } to { transform: none; } }

@media (max-width: 1399.98px) {
    .gt-nav .main-menu > li > a { padding: 9px 10px !important; font-size: 14.5px; }
    .gt-bar__in { gap: 16px; }
}
@media (max-width: 1199.98px) {
    .gt-bar__in { min-height: 70px; }
    .gt-header--overlay .gt-bar__in { min-height: 64px; padding: 0 10px 0 16px; border-radius: 18px; }
    .gt-logo img { height: 42px; }
}
@media (max-width: 575.98px) {
    .gt-header--overlay .gt-bar { padding-top: 10px; }
    .gt-logo img { height: 38px; max-width: 170px; }
    .gt-icon-btn { width: 42px; height: 42px; }
}

/* 4. Menu điện thoại (mở/đóng bằng home.js: .bc-menu-mobile.active) ------------- */
.gt-mmenu.menu-mobile {
    display: flex !important; flex-direction: column; width: min(340px, 86vw); left: 0; top: 0; bottom: 0; height: 100%;
    background: #fff; border: 0; z-index: 2000; transform: translateX(-105%); transition: transform .35s var(--gt-ease);
    box-shadow: 20px 0 50px rgba(0, 0, 0, .18); overflow: hidden;
}
.gt-mmenu.menu-mobile.active { transform: translateX(0) !important; }
.vne_wrap.active { transform: none !important; }     /* không đẩy cả trang sang phải như bản cũ */
.gt-mmenu-bg { position: fixed; inset: 0; z-index: 1990; background: rgba(6, 38, 24, .45); opacity: 0; visibility: hidden; transition: opacity .3s; }
.gt-mmenu.active + .gt-mmenu-bg { opacity: 1; visibility: visible; }
.gt-mmenu__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 18px; border-bottom: 1px solid var(--gt-line); }
.gt-mmenu__logo img { height: 40px; width: auto; }
.gt-mmenu__close { width: 40px; height: 40px; display: grid; place-items: center; border: 0; border-radius: 50%; background: var(--gt-mint); color: var(--gt-ink); }
.gt-mmenu__menu { flex: 1; overflow-y: auto; padding: 8px 10px; max-height: none !important; }
.gt-mmenu .g-menu ul { margin: 0; padding: 0; list-style: none; }
.gt-mmenu .g-menu ul li { position: relative; padding: 0; width: 100%; }
.gt-mmenu .g-menu ul li::after { display: none; }
.gt-mmenu .g-menu > ul > li > a {
    display: flex; align-items: center; justify-content: space-between; padding: 13px 12px; border-radius: 12px;
    color: var(--gt-ink); font-size: 16px; font-weight: 600;
}
.gt-mmenu .g-menu > ul > li > a:hover, .gt-mmenu .g-menu > ul > li.active > a { background: var(--gt-mint); color: var(--gt-primary); }
.gt-mmenu .g-menu .caret { position: absolute; right: 4px; top: 6px; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 10px; }
.gt-mmenu .g-menu .children-menu { display: none; padding: 2px 0 8px 14px; }
.gt-mmenu .g-menu li.active > .children-menu { display: block; }
.gt-mmenu .g-menu .children-menu a { display: block; padding: 9px 12px !important; color: var(--gt-text); font-size: 15px; }
/* Mục bật mega menu: khung .mega (main.css ẩn bằng .mb-menu-none trên điện thoại) bung như menu con thường; cột → mục cấp 2 có mũi tên riêng */
.gt-mmenu .g-menu .mega { display: none !important; position: static; width: auto; max-width: none; padding: 0; margin: 0 !important; background: none; box-shadow: none; opacity: 1; visibility: visible; transform: none; }
.gt-mmenu .g-menu li.active > .mega { display: block !important; }
.gt-mmenu .g-menu .mega > .children-menu { display: block; padding: 2px 0 8px 14px; }
.gt-mmenu .g-menu .mega .mega-image { display: none; }
.gt-mmenu .g-menu .children-menu > li > a { position: relative; padding-right: 48px !important; }
.gt-mmenu .g-menu .children-menu .caret { top: 0; }
.gt-mmenu .g-menu .children-menu .children-menu a { font-size: 14.5px; color: var(--gt-muted); }
.gt-mmenu__foot { display: flex; flex-wrap: wrap; gap: 10px; padding: 16px 18px 22px; border-top: 1px solid var(--gt-line); }
.gt-mmenu__foot .gt-btn { flex: 1 1 120px; }
.gt-mmenu__hotline { display: flex; align-items: center; gap: 8px; width: 100%; color: var(--gt-primary); font-weight: 700; font-size: 16px; }
.gt-mmenu__lang { width: 100%; margin: 0; padding: 0; list-style: none; }
@media (min-width: 1200px) { .gt-mmenu.menu-mobile, .gt-mmenu-bg { display: none !important; } }

/* 5. Chân trang ---------------------------------------------------------------- */
.gt-footer {
    position: relative; overflow: hidden; color: rgba(255, 255, 255, .72); padding: 72px 0 0;
    background:
        radial-gradient(600px 300px at 0% 0%, rgba(141, 192, 72, .16), transparent 70%),
        radial-gradient(520px 320px at 100% 30%, rgba(27, 143, 70, .25), transparent 70%),
        var(--gt-grad-dark);
}
.gt-footer a { color: rgba(255, 255, 255, .78); text-decoration: none; transition: color .2s; }
.gt-footer a:hover { color: var(--gt-lime); }
.gt-footer__news {
    display: flex; align-items: center; justify-content: space-between; gap: 32px; padding: 34px 40px; margin-bottom: 60px;
    border-radius: 24px; border: 1px solid rgba(255, 255, 255, .14); background: rgba(255, 255, 255, .06);
    -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
}
.gt-footer__news-text { display: flex; align-items: center; gap: 18px; }
.gt-footer__news-icon { flex-shrink: 0; width: 56px; height: 56px; display: grid; place-items: center; border-radius: 18px; background: var(--gt-grad); color: #fff; }
.gt-footer__news h2 { margin: 0 0 6px; color: #fff; font-size: 24px; font-weight: 800 !important; }
.gt-footer__news p { margin: 0; font-size: 15px; }
.gt-footer__news-form { flex: 0 1 480px; }
.gt-footer__news-field { display: flex; align-items: center; gap: 10px; padding: 6px 6px 6px 18px; border-radius: 999px; background: #fff; color: var(--gt-muted); }
.gt-footer__news-field input { flex: 1; min-width: 0; height: 44px; border: 0; outline: 0; background: transparent; color: var(--gt-ink); font-size: 15px; box-shadow: none !important; }
.gt-footer__news-form .form-mess { margin-top: 8px; font-size: 14px; }
.gt-footer__news-form .form-mess .text-success { color: var(--gt-lime) !important; }
/* --gt-cols = số cột menu chân trang (footer.blade.php in ra) */
.gt-footer__main { display: grid; grid-template-columns: minmax(0, 1.4fr) repeat(var(--gt-cols, 2), minmax(0, .9fr)) minmax(0, 1.5fr); gap: 40px; padding-bottom: 48px; }
.gt-footer__main--legacy { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.gt-footer__col { min-width: 0; overflow-wrap: anywhere; }
.gt-footer__col h3 { position: relative; margin: 0 0 22px; padding-bottom: 12px; color: #fff; font-size: 17px; font-weight: 700 !important; }
.gt-footer__col h3::after { content: ""; position: absolute; left: 0; bottom: 0; width: 36px; height: 3px; border-radius: 3px; background: var(--gt-grad); }
.gt-footer__logo img { height: 56px; width: auto; margin-bottom: 18px; }
.gt-footer__brand p { font-size: 15px; line-height: 1.75; margin: 0 0 20px; }
.gt-footer__socials { display: flex; flex-wrap: wrap; gap: 10px; }
.gt-footer__socials a { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 12px; background: rgba(255, 255, 255, .08); color: #fff; }
.gt-footer__socials a:hover { background: var(--gt-lime); color: var(--gt-g900); }
.gt-footer__socials svg { width: 18px; height: 18px; }
.gt-footer__links { margin: 0; padding: 0; list-style: none; }
.gt-footer__links li { margin-bottom: 12px !important; }
.gt-footer__links a { position: relative; display: inline-block; font-size: 15px; transition: color .2s, transform .2s; }
.gt-footer__links a:hover { transform: translateX(4px); }
.gt-footer__contact ul { margin: 0; padding: 0; list-style: none; }
.gt-footer__contact li { display: flex; gap: 12px; margin-bottom: 18px !important; font-size: 14.5px; line-height: 1.55; }
.gt-footer__contact a[href^="mailto:"] { word-break: break-all; }
.gt-footer__contact small { display: block; font-size: 12.5px; color: rgba(255, 255, 255, .55); margin-bottom: 2px; }
.gt-footer__contact strong { color: #fff; font-size: 16px; }
.gt-footer__ic { flex-shrink: 0; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; background: rgba(141, 192, 72, .16); color: var(--gt-lime); }
.gt-footer__legacy { font-size: 15px; line-height: 1.75; }
.gt-footer__legacy ul { padding: 0; list-style: none; }
.gt-footer__bottom { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 14px; padding: 22px 0; border-top: 1px solid rgba(255, 255, 255, .12); font-size: 14px; }
.gt-footer__badges img { max-height: 30px; width: auto; }
@media (max-width: 1199.98px) {
    .gt-footer__main { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 991.98px) {
    .gt-footer__news { flex-direction: column; align-items: stretch; padding: 28px; }
    .gt-footer__news-form { flex-basis: auto; }
}
@media (max-width: 575.98px) {
    .gt-footer { padding-top: 48px; }
    .gt-footer__main { grid-template-columns: 1fr 1fr; gap: 30px 18px; }
    .gt-footer__main--legacy { grid-template-columns: 1fr; }
    .gt-footer__brand, .gt-footer__contact { grid-column: 1 / -1; }
    .gt-footer__links a { font-size: 14.5px; }
    .gt-footer__news { padding: 22px 18px; margin-bottom: 40px; }
    .gt-footer__news-text { align-items: flex-start; }
    .gt-footer__news h2 { font-size: 20px; }
    .gt-footer__news-field { flex-wrap: wrap; padding: 6px; border-radius: 18px; }
    .gt-footer__news-field > svg { display: none; }
    .gt-footer__news-field input { padding: 0 12px; }
    .gt-footer__news-field .gt-btn { width: 100%; }
    .gt-footer__bottom { flex-direction: column; text-align: center; }
}

/* Nút lên đầu trang */
.gt-totop {
    position: fixed; right: 22px; bottom: 22px; z-index: 900; width: 48px; height: 48px; display: grid; place-items: center;
    border: 0; border-radius: 16px; background: var(--gt-grad); color: #fff; box-shadow: 0 10px 24px rgba(27, 143, 70, .35);
    opacity: 0; visibility: hidden; transform: translateY(12px); transition: all .3s var(--gt-ease);
}
.gt-totop.is-on { opacity: 1; visibility: visible; transform: none; }
.gt-totop:hover { transform: translateY(-3px); }
body.frontend-page .social-actions { bottom: 84px; }

/* 6. Khối hero + tìm kiếm (Danang24h_banner_slide kiểu gt_hero) ------------------------------------------------ */
/* KHÔNG overflow:hidden ở khung hero: danh sách xổ "Điểm đi / Điểm đến" (.bc-autocomplete cao 300px) phải tràn xuống, đè lên khối
   phía dưới — trước đây bị cắt ngang đáy hero như bị khối tour che. Cắt ở lớp ảnh nền (.gt-hero__bg) thay vì cả khung; z-index 3 để
   hero nổi trên các phần đứng sau (đầu trang vẫn 100). */
.gt-hero {
    position: relative; z-index: 3; isolation: isolate; display: flex; align-items: flex-end;
    min-height: clamp(720px, 100vh, 920px); padding: 200px 0 64px; color: #fff; background: var(--gt-g900);
}
.gt-hero__bg { position: absolute; inset: 0; z-index: -4; overflow: hidden; }
.gt-hero__slide { position: absolute; inset: 0; opacity: 0; transition: opacity 1.4s ease; }
.gt-hero__slide.is-on { opacity: 1; }
.gt-hero__slide img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.08); animation: gtKen 20s ease-out forwards; }
@keyframes gtKen { to { transform: scale(1); } }
.gt-hero__shade {
    position: absolute; inset: 0; z-index: -3;
    background: linear-gradient(180deg, rgba(6, 38, 24, .62) 0%, rgba(6, 38, 24, .12) 32%, rgba(6, 38, 24, .08) 52%, rgba(6, 38, 24, .78) 100%);
}
.gt-hero__word { position: absolute; left: 0; right: 0; top: 150px; z-index: -2; text-align: center; pointer-events: none; }
/* Không nhập chữ lớn: bỏ khung cao hết màn hình + phần đệm chừa cho chữ → nội dung nằm sát dưới header (~64px) */
.gt-hero--noword { min-height: 0; padding-top: 196px; }
.gt-hero__word span {
    display: inline-block; max-width: 100%; padding: 0 2vw; font-size: clamp(60px, 14.5vw, 240px); font-weight: 900 !important;
    line-height: 1; letter-spacing: -.02em; text-transform: uppercase; white-space: nowrap; color: transparent;
    background: linear-gradient(180deg, #fff 35%, rgba(255, 255, 255, .25) 100%); -webkit-background-clip: text; background-clip: text;
    filter: drop-shadow(0 10px 30px rgba(0, 0, 0, .12));
}
.gt-hero__fg { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.gt-hero__flight { position: absolute; right: 12%; top: 58%; z-index: -1; width: min(420px, 32vw); color: rgba(255, 255, 255, .7); }
.gt-hero__video { position: absolute; right: 5%; top: 47%; z-index: 2; width: 126px; height: 126px; display: grid; place-items: center; color: #fff; }
.gt-hero__ring { position: absolute; inset: 0; fill: #fff; font-size: 10.5px; font-weight: 700; letter-spacing: .32em; animation: gtSpin 16s linear infinite; }
.gt-hero__play {
    width: 64px; height: 64px; display: grid; place-items: center; border-radius: 50%; background: var(--gt-grad); color: #fff;
    box-shadow: 0 0 0 10px rgba(141, 192, 72, .25); animation: gtPulse 2.4s ease-out infinite; transition: transform .25s;
}
.gt-hero__play svg { margin-left: 3px; fill: currentColor; }
.gt-hero__video:hover .gt-hero__play { transform: scale(1.06); }
@keyframes gtSpin { to { transform: rotate(360deg); } }
@keyframes gtPulse { 0% { box-shadow: 0 0 0 0 rgba(141, 192, 72, .45); } 100% { box-shadow: 0 0 0 22px rgba(141, 192, 72, 0); } }

.gt-hero__inner { position: relative; z-index: 1; }
.gt-hero__intro { margin-bottom: 22px; }
.gt-hero__kicker {
    display: inline-flex; align-items: center; gap: 8px; padding: 8px 16px; border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, .28); background: rgba(255, 255, 255, .12); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
    font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
}
.gt-hero__kicker svg { color: var(--gt-lime); }
.gt-hero__title {
    margin: 14px 0 0; max-width: 780px; text-wrap: balance; color: #fff; font-size: clamp(26px, 3vw, 42px); font-weight: 800 !important;
    line-height: 1.22; text-shadow: 0 2px 24px rgba(0, 0, 0, .28);
}
.gt-hero__tabs {
    display: inline-flex; flex-wrap: wrap; gap: 6px; padding: 8px 8px 0; border-radius: 22px 22px 0 0;
    border: 1px solid rgba(255, 255, 255, .26); border-bottom: 0; background: rgba(255, 255, 255, .14);
    -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
}
.gt-hero__tab {
    display: inline-flex; align-items: center; gap: 8px; height: 46px; padding: 0 20px; border: 0; border-radius: 14px 14px 0 0;
    background: transparent; color: rgba(255, 255, 255, .92); font-size: 15px; font-weight: 600; cursor: pointer; transition: background .25s, color .25s;
}
.gt-hero__tab:hover { background: rgba(255, 255, 255, .12); color: #fff; }
.gt-hero__tab.is-on { background: #fff; color: var(--gt-primary); }
.gt-hero__panel {
    padding: 18px; border-radius: 0 24px 24px 24px; border: 1px solid rgba(255, 255, 255, .26);
    background: rgba(255, 255, 255, .14); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); box-shadow: 0 30px 70px rgba(0, 0, 0, .2);
}
.gt-hero__pane { display: none; }
.gt-hero__pane.is-on { display: block; animation: gtFade .35s ease; }
@keyframes gtFade { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.gt-hero__ptitle { margin: 0 4px 12px; color: #fff; font-size: 17px; font-weight: 700; }

/* Bọc các form-search có sẵn (tour / khách sạn) thành 1 thanh trắng: ô cách nhau bằng vạch, nút xanh cao bằng thanh */
.gt-hero .gt-hero__form { position: static; margin: 0; padding: 0; transform: none; width: auto; background: transparent; }
.gt-hero__form .box-search, .gt-hero__form form.vne_form { margin: 0 !important; padding: 0 !important; background: transparent !important; box-shadow: none !important; border: 0 !important; }
.gt-hero__form .g-field-search {
    display: flex !important; align-items: stretch; gap: 8px; margin: 0 !important; padding: 8px !important;
    border-radius: 18px !important; background: #fff !important; box-shadow: none !important;
}
.gt-hero__form .g-field-search > .row { flex: 1; display: flex; flex-wrap: nowrap; margin: 0 !important; --bs-gutter-x: 0; }
.gt-hero__form .g-field-search > .row > [class*="col-"] {
    position: relative; flex: 1 1 0; width: auto; max-width: none; margin: 0 !important; padding: 8px 18px !important;
    border: 0 !important; border-right: 1px solid var(--gt-line) !important; background: transparent !important;
}
.gt-hero__form .g-field-search > .row > [class*="col-"]:last-child { border-right: 0 !important; }
.gt-hero__form .form-group, .gt-hero__form .form-content { margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; }
.gt-hero__form label { display: block; margin: 0 0 4px !important; color: var(--gt-muted) !important; font-size: 13px !important; font-weight: 600 !important; text-transform: none !important; }
.gt-hero__form .form-control:not(.check-in-out),
.gt-hero__form .render,
.gt-hero__form .inputDate { padding: 0 !important; min-height: 28px; height: auto; border: 0 !important; background: transparent !important; box-shadow: none !important; color: var(--gt-ink) !important; font-size: 17px !important; font-weight: 700 !important; }
.gt-hero__form .form-control::placeholder { color: #a5b1a9; font-weight: 500; }
.gt-hero__form .date-icon, .gt-hero__form .form-content > svg { display: none; }
.gt-hero__form .g-field-search > .d-flex { padding: 0 !important; align-items: stretch !important; }
.gt-hero__form .btn-search {
    display: inline-flex !important; align-items: center; justify-content: center; gap: 10px; min-width: 150px; height: auto; min-height: 60px;
    padding: 0 28px !important; border: 0 !important; border-radius: 14px !important; background: var(--gt-grad) !important; color: #fff !important;
    font-size: 16px !important; font-weight: 700 !important; box-shadow: 0 10px 24px rgba(27, 143, 70, .3); transition: transform .25s, box-shadow .25s;
}
.gt-hero__form .btn-search:hover { transform: translateY(-2px); box-shadow: 0 14px 30px rgba(27, 143, 70, .38); }
.gt-hero__form .list-tag-location { margin-top: 12px; }
.gt-hero__form .list-tag-location .tag { padding: 6px 14px; border-radius: 999px; background: rgba(255, 255, 255, .16); border: 1px solid rgba(255, 255, 255, .3); color: #fff; font-size: 13px; }
.gt-hero__form .list-tag-location .tag:hover { background: #fff; color: var(--gt-primary); }
/* Form vé máy bay (FlightConnect) có khung riêng: chỉ cho nền trắng + bo góc */
.gt-hero__form--flight { background: #fff !important; border-radius: 18px; padding: 10px !important; color: var(--gt-ink); }

/* Form vé vui chơi + ô visa (chỉ có ở kiểu này) */
.gt-qform, .gt-qcta { display: flex; align-items: stretch; gap: 8px; padding: 8px; border-radius: 18px; background: #fff; color: var(--gt-text); }
.gt-qform__field { flex: 1; display: flex; flex-direction: column; justify-content: center; margin: 0; padding: 8px 18px; }
.gt-qform__field span { margin-bottom: 4px; color: var(--gt-muted); font-size: 13px; font-weight: 600; }
.gt-qform__field input { width: 100%; padding: 0; border: 0; outline: 0; background: transparent; color: var(--gt-ink); font-size: 17px; font-weight: 700; box-shadow: none !important; }
.gt-qform__field input::placeholder { color: #a5b1a9; font-weight: 500; }
.gt-qform__btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-width: 150px; min-height: 60px; padding: 0 28px;
    border: 0; border-radius: 14px; background: var(--gt-grad); color: #fff !important; font-size: 16px; font-weight: 700; text-decoration: none !important;
    box-shadow: 0 10px 24px rgba(27, 143, 70, .3);
}
.gt-qcta { align-items: center; gap: 16px; padding-left: 18px; }
.gt-qcta p { flex: 1; margin: 0; font-size: 15.5px; line-height: 1.6; color: var(--gt-ink); }
.gt-qcta__ic { flex-shrink: 0; width: 50px; height: 50px; display: grid; place-items: center; border-radius: 14px; background: var(--gt-mint); color: var(--gt-primary); }

@media (max-width: 1199.98px) {
    .gt-hero__video { top: 44%; width: 104px; height: 104px; }
    .gt-hero__flight { display: none; }
}
@media (max-width: 991.98px) {
    .gt-hero { padding-top: 300px; min-height: 0; }
    .gt-hero.gt-hero--noword { padding-top: 140px; min-height: 0; }
    .gt-hero__word { top: 150px; }
    .gt-hero__video { top: 150px; right: 24px; }
    .gt-hero__tabs { display: flex; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; max-width: 100%; border-radius: 20px 20px 0 0; }
    .gt-hero__tabs::-webkit-scrollbar { display: none; }
    .gt-hero__tab { flex-shrink: 0; padding: 0 16px; }
    .gt-hero__panel { border-radius: 0 0 22px 22px; padding: 14px; }
    .gt-hero__form .g-field-search, .gt-qform { flex-direction: column; }
    .gt-hero__form .g-field-search > .row { flex-direction: column; }
    .gt-hero__form .g-field-search > .row > [class*="col-"] { border-right: 0 !important; border-bottom: 1px solid var(--gt-line) !important; padding: 12px 14px !important; }
    .gt-hero__form .btn-search, .gt-qform__btn { width: 100%; min-height: 54px; }
    .gt-qcta { flex-wrap: wrap; padding: 14px; }
    .gt-qcta .gt-qform__btn { width: 100%; }
}
@media (max-width: 575.98px) {
    .gt-hero { padding: 200px 0 28px; }
    .gt-hero.gt-hero--noword { padding-top: 122px; }
    .gt-hero__word { top: 104px; }
    .gt-hero__word span { font-size: 13.5vw; }
    .gt-hero__video { display: none; }
    .gt-hero__ring { font-size: 9px; }
    .gt-hero__play { width: 46px; height: 46px; }
    .gt-hero__intro { margin-bottom: 16px; }
    .gt-hero__kicker { font-size: 11.5px; letter-spacing: .1em; }
    .gt-hero__tab { height: 42px; font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
    .gt-hero__slide img, .gt-hero__ring, .gt-hero__play { animation: none; }
}

/* 7. Lưới, tab, thẻ sản phẩm + khối Nổi bật theo dịch vụ (Danang24h_multiple_type kiểu gt_tabs) ------------------- */
.gt-grid { display: grid; gap: 24px; }
.gt-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.gt-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1199.98px) { .gt-grid--4 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 991.98px) { .gt-grid--4, .gt-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .gt-grid { gap: 18px; } }
/* Điện thoại: hàng thẻ trượt ngang (đỡ dài trang), thấy mép thẻ sau để biết còn nữa */
@media (max-width: 575.98px) {
    .gt-grid--4, .gt-grid--3 {
        display: grid; grid-auto-flow: column; grid-auto-columns: 82%; grid-template-columns: none; gap: 14px;
        overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 16px; margin: 0 -16px; padding: 4px 16px 14px; scrollbar-width: none;
    }
    .gt-grid--4::-webkit-scrollbar, .gt-grid--3::-webkit-scrollbar { display: none; }
    .gt-grid--4 > *, .gt-grid--3 > * { scroll-snap-align: start; }
}

.gt-tabs { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: -16px 0 36px; }
.gt-tabs__btn {
    height: 44px; padding: 0 22px; border-radius: 999px; border: 1.5px solid var(--gt-line); background: #fff;
    color: var(--gt-ink); font-size: 15px; font-weight: 600; cursor: pointer; transition: all .25s;
}
.gt-tabs__btn:hover { border-color: var(--gt-brand); color: var(--gt-brand); }
.gt-tabs__btn.is-on { border-color: transparent; background: var(--gt-grad); color: #fff; box-shadow: 0 8px 20px rgba(27, 143, 70, .28); }
@media (max-width: 575.98px) {
    .gt-tabs { flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; margin: -8px -16px 24px; padding: 0 16px 4px; scrollbar-width: none; }
    .gt-tabs::-webkit-scrollbar { display: none; }
    .gt-tabs__btn { flex-shrink: 0; height: 40px; padding: 0 18px; font-size: 14px; }
}
.gt-trend__pane { display: none; }
.gt-trend__pane.is-on { display: block; animation: gtFade .4s ease; }

.gt-card {
    position: relative; display: flex; flex-direction: column; min-width: 0; overflow: hidden; border-radius: var(--gt-radius);
    background: #fff; border: 1px solid var(--gt-line); box-shadow: 0 2px 10px rgba(16, 36, 26, .04);
    transition: transform .35s var(--gt-ease), box-shadow .35s var(--gt-ease), border-color .35s;
}
.gt-card:hover { transform: translateY(-6px); box-shadow: var(--gt-shadow-lg); border-color: transparent; }
.gt-card__img { position: relative; display: block; aspect-ratio: 4 / 3; overflow: hidden; background: var(--gt-mint); }
.gt-card__img img, .gt-card__img .gt-noimg { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--gt-ease); }
.gt-card:hover .gt-card__img img { transform: scale(1.07); }
.gt-card__img::after { content: ""; position: absolute; inset: auto 0 0 0; height: 40%; background: linear-gradient(0deg, rgba(6, 38, 24, .35), transparent); pointer-events: none; }
.gt-card__badge { position: absolute; top: 14px; left: 14px; z-index: 2; }
.gt-card__badge--right { left: auto; right: 64px; }
.gt-card__wish { position: absolute; top: 12px; right: 12px; z-index: 3; }
.gt-card__wish .service-wishlist {
    position: static; width: 40px; height: 40px; display: grid; place-items: center; margin: 0; border-radius: 50%;
    background: rgba(255, 255, 255, .92); color: var(--gt-ink); cursor: pointer; transition: all .25s; box-shadow: 0 4px 12px rgba(0, 0, 0, .12);
}
.gt-card__wish .service-wishlist i { display: none; }
.gt-card__wish .service-wishlist:hover { color: #e5484d; transform: scale(1.06); }
.gt-card__wish .service-wishlist.active { color: #e5484d; }
.gt-card__wish .service-wishlist.active svg { fill: currentColor; }
.gt-card__wish .service-wishlist.loading { opacity: .6; pointer-events: none; }
.gt-card__body { display: flex; flex-direction: column; flex: 1; padding: 18px 20px 20px; }
.gt-card__meta { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 22px; margin-bottom: 8px; }
.gt-card__loc { display: inline-flex; align-items: center; gap: 6px; min-width: 0; color: var(--gt-brand); font-size: 13px; font-weight: 600; }
.gt-card__loc, .gt-card__addr { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gt-card__loc svg, .gt-card__addr svg { flex-shrink: 0; }
.gt-card__stars { display: inline-flex; gap: 2px; color: var(--gt-amber); }
.gt-card__stars svg { fill: currentColor; }
.gt-card__title { margin: 0 0 10px; font-size: 18px; font-weight: 700 !important; line-height: 1.4; }
.gt-card__title a {
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
    color: var(--gt-ink); text-decoration: none; transition: color .2s;
}
.gt-card__title a:hover { color: var(--gt-brand); }
.gt-card__info { display: flex; flex-wrap: wrap; gap: 8px 14px; margin-bottom: 14px; color: var(--gt-text); font-size: 13.5px; }
.gt-card__info span { display: inline-flex; align-items: center; gap: 6px; min-width: 0; }
.gt-card__info svg { color: var(--gt-g500); flex-shrink: 0; }
.gt-card__foot {
    display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-top: auto; padding-top: 14px;
    border-top: 1px dashed var(--gt-line);
}
.gt-card__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; min-width: 0; line-height: 1.2; }
.gt-card__price small { width: 100%; color: var(--gt-muted); font-size: 12.5px; }
.gt-card__price strong { color: var(--gt-primary); font-size: 20px; font-weight: 800 !important; }
.gt-card__price del { color: var(--gt-muted); font-size: 14px; }
.gt-card__unit { color: var(--gt-muted); font-size: 13px; margin-left: -6px; }
.gt-card__go {
    flex-shrink: 0; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%;
    background: var(--gt-mint); color: var(--gt-primary); text-decoration: none; transition: all .3s;
}
.gt-card:hover .gt-card__go, .gt-card__go:hover { background: var(--gt-grad); color: #fff; transform: rotate(45deg); }
.gt-card__go--text { width: auto; height: 38px; padding: 0 14px; border-radius: 999px; font-size: 13.5px; font-weight: 700; white-space: nowrap; }
.gt-card:hover .gt-card__go--text, .gt-card__go--text:hover { transform: none; }

/* Hiện dần khi cuộn tới (greentour.js gắn .is-in) */
.gt-js [data-gt-reveal] { opacity: 0; transform: translateY(18px); transition: opacity .7s var(--gt-ease), transform .7s var(--gt-ease); }
.gt-js [data-gt-reveal].is-in { opacity: 1; transform: none; }
.gt-card[data-gt-reveal].is-in:hover { transform: translateY(-6px); }
@media (prefers-reduced-motion: reduce) { [data-gt-reveal] { opacity: 1; transform: none; transition: none; } }

/* 8. Hai dải chữ chạy chéo (vne_list_categories kiểu gt_ribbon) ------------------------------------------------- */
.gt-ribbon { position: relative; overflow: hidden; padding: 64px 0; }
.gt-ribbon__band { position: relative; display: flex; overflow: hidden; padding: 16px 0; white-space: nowrap; }
.gt-ribbon__band--dark { background: var(--gt-g800); transform: rotate(3deg) scale(1.06); }
.gt-ribbon__band--grad { z-index: 1; margin-top: -52px; background: var(--gt-grad); transform: rotate(-3deg) scale(1.06); box-shadow: 0 16px 40px rgba(27, 143, 70, .25); }
.gt-ribbon__track { display: flex; flex-shrink: 0; width: max-content; animation: gtMarquee 60s linear infinite; }
.gt-ribbon__track--rev { animation-direction: reverse; animation-duration: 55s; }
.gt-ribbon__band:hover .gt-ribbon__track { animation-play-state: paused; }
.gt-ribbon__item { display: inline-flex; align-items: center; gap: 26px; padding-right: 26px; color: #fff !important; font-size: 24px; font-weight: 800; letter-spacing: -.01em; text-decoration: none; }
.gt-ribbon__item i { display: inline-grid; place-items: center; color: var(--gt-lime); font-style: normal; }
.gt-ribbon__band--grad .gt-ribbon__item i { color: rgba(255, 255, 255, .85); }
@keyframes gtMarquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (max-width: 575.98px) {
    .gt-ribbon { padding: 26px 0; }
    .gt-ribbon__band { padding: 11px 0; }
    .gt-ribbon__band--dark { transform: rotate(2deg) scale(1.08); }
    .gt-ribbon__band--grad { margin-top: 6px; transform: rotate(-2deg) scale(1.08); }
    .gt-ribbon__item { font-size: 18px; gap: 18px; padding-right: 18px; }
}
@media (prefers-reduced-motion: reduce) { .gt-ribbon__track { animation: none; } }

/* 9. Lưới 6 ô điểm đến so le (vne_list_location layout gt_bento) ------------------------------------------------- */
.gt-dest__grid {
    display: grid; gap: 22px; grid-template-columns: 1fr 1.35fr .85fr .85fr; grid-template-rows: 255px 255px;
    grid-template-areas: "a c d d" "b c e f";
}
.gt-dest__item--1 { grid-area: a; } .gt-dest__item--2 { grid-area: b; } .gt-dest__item--3 { grid-area: c; }
.gt-dest__item--4 { grid-area: d; } .gt-dest__item--5 { grid-area: e; } .gt-dest__item--6 { grid-area: f; }
/* Ít hơn 6 địa điểm: lưới đều cho khỏi hở ô */
.gt-dest__grid--1, .gt-dest__grid--2, .gt-dest__grid--3, .gt-dest__grid--4, .gt-dest__grid--5 {
    grid-template-areas: none; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); grid-template-rows: 300px;
}
.gt-dest__grid--1 .gt-dest__item, .gt-dest__grid--2 .gt-dest__item, .gt-dest__grid--3 .gt-dest__item,
.gt-dest__grid--4 .gt-dest__item, .gt-dest__grid--5 .gt-dest__item { grid-area: auto; }
.gt-dest__item { position: relative; display: block; overflow: hidden; border-radius: 24px; background: var(--gt-mint); color: #fff; text-decoration: none; isolation: isolate; }
.gt-dest__item img, .gt-dest__item .gt-noimg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--gt-ease); }
.gt-dest__item:hover img { transform: scale(1.08); }
.gt-dest__shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(6, 38, 24, 0) 45%, rgba(6, 38, 24, .78) 100%); transition: background .4s; }
.gt-dest__item:hover .gt-dest__shade { background: linear-gradient(180deg, rgba(6, 38, 24, .1) 20%, rgba(6, 38, 24, .85) 100%); }
.gt-dest__text { position: absolute; left: 20px; right: 70px; bottom: 18px; display: flex; flex-direction: column; gap: 6px; align-items: flex-start; }
.gt-dest__name {
    display: inline-flex; align-items: center; gap: 6px; max-width: 100%; padding: 7px 14px; border-radius: 999px;
    background: #fff; color: var(--gt-ink); font-size: 16px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.gt-dest__name svg { color: var(--gt-brand); flex-shrink: 0; }
.gt-dest__count { padding-left: 4px; color: rgba(255, 255, 255, .92); font-size: 13.5px; font-weight: 600; }
.gt-dest__go {
    position: absolute; right: 18px; bottom: 18px; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%;
    background: var(--gt-grad); color: #fff; opacity: 0; transform: translateY(10px) rotate(-45deg); transition: all .4s var(--gt-ease);
}
.gt-dest__item:hover .gt-dest__go { opacity: 1; transform: none; }
@media (max-width: 991.98px) {
    .gt-dest__grid { grid-template-columns: 1fr 1fr; grid-template-rows: repeat(4, 220px); grid-template-areas: "c a" "c b" "d d" "e f"; }
}
@media (max-width: 575.98px) {
    .gt-dest__grid { gap: 12px; grid-template-rows: 200px 150px 150px 170px 150px; grid-template-areas: "c c" "a b" "d d" "d d" "e f"; }
    .gt-dest__grid--1, .gt-dest__grid--2, .gt-dest__grid--3, .gt-dest__grid--4, .gt-dest__grid--5 { grid-template-columns: 1fr 1fr; grid-template-rows: none; grid-auto-rows: 170px; }
    .gt-dest__item { border-radius: 18px; }
    .gt-dest__text { left: 12px; right: 12px; bottom: 12px; }
    .gt-dest__name { font-size: 14px; padding: 6px 11px; }
    .gt-dest__count { font-size: 12px; }
    .gt-dest__go { display: none; }
}

/* 10. Tour đề xuất — thẻ ảnh lớn (vne_list_tour kiểu gt_recommend) ---------------------------------------------- */
.gt-rcard {
    position: relative; display: flex; flex-direction: column; min-width: 0; overflow: hidden; border-radius: 24px; background: #fff;
    box-shadow: 0 6px 24px rgba(16, 36, 26, .07); transition: transform .35s var(--gt-ease), box-shadow .35s var(--gt-ease);
}
.gt-rcard:hover { transform: translateY(-6px); box-shadow: var(--gt-shadow-lg); }
.gt-rcard__img { position: relative; display: block; height: 270px; overflow: hidden; color: #fff; text-decoration: none; background: var(--gt-mint); }
/* Khung ảnh là thẻ <a>: bootstrap "a:hover { color: xanh dương }" làm chữ trên ảnh đổi màu khi rê chuột → khoá màu trắng */
.gt-rcard__img:hover, .gt-rcard__img:focus, .gt-rcard__img:hover *, .gt-dest__item:hover, .gt-dest__item:focus,
.gt-card__img:hover, .gt-post__link:hover { color: #fff; text-decoration: none; }
.gt-rcard__top, .gt-rcard__price { color: #fff; text-shadow: 0 1px 10px rgba(0, 0, 0, .45); }
.gt-rcard:hover .gt-rcard__img::before { background: linear-gradient(180deg, rgba(6, 38, 24, .6) 0%, rgba(6, 38, 24, .05) 32%, rgba(6, 38, 24, .1) 48%, rgba(6, 38, 24, .88) 100%); }
.gt-rcard__img img, .gt-rcard__img .gt-noimg { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--gt-ease); }
.gt-rcard:hover .gt-rcard__img img { transform: scale(1.07); }
.gt-rcard__img::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(6, 38, 24, .55) 0%, transparent 30%, transparent 50%, rgba(6, 38, 24, .82) 100%); }
.gt-rcard__top { position: absolute; z-index: 2; top: 14px; left: 16px; right: 64px; display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 13px; font-weight: 700; }
.gt-rcard__top span { display: inline-flex; align-items: center; gap: 6px; }
.gt-rcard__price { position: absolute; z-index: 2; left: 18px; right: 18px; bottom: 16px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; line-height: 1.2; }
.gt-rcard__price small { width: 100%; font-size: 13px; opacity: .9; }
.gt-rcard__price strong { font-size: 22px; font-weight: 800 !important; }
.gt-rcard__price del { font-size: 14px; opacity: .8; }
.gt-rcard__body { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 18px 18px 22px; text-align: center; }
.gt-rcard__title { margin: 0; font-size: 18px; font-weight: 700 !important; line-height: 1.4; }
.gt-rcard__title a { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; color: var(--gt-ink); text-decoration: none; }
.gt-rcard__title a:hover { color: var(--gt-brand); }
.gt-rcard__addr { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--gt-muted); font-size: 14px; }
.gt-rcard__addr svg { margin-right: 5px; vertical-align: -2px; color: var(--gt-brand); }
.gt-sec--forest .gt-rcard { box-shadow: 0 10px 30px rgba(0, 0, 0, .25); }

/* 11. Giới thiệu + 3 ảnh + dải số liệu (vietfood_about_info kiểu gt_deliver) -------------------------------------- */
.gt-deliver { position: relative; padding: 96px 0 0; background: #fff; }
.gt-deliver__top { display: grid; grid-template-columns: 1.2fr 1fr; gap: 56px; align-items: end; margin-bottom: 44px; }
.gt-deliver__head .gt-head__kicker { margin-bottom: 16px; }
.gt-deliver__title { margin: 0; color: var(--gt-ink); font-size: clamp(28px, 3.2vw, 44px); font-weight: 800 !important; line-height: 1.18; letter-spacing: -.015em; text-wrap: balance; }
.gt-deliver__title em { display: block; text-wrap: balance; font-style: normal; background: var(--gt-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.gt-deliver__intro p { margin: 0 0 22px; font-size: 16.5px; line-height: 1.75; color: var(--gt-text); }
.gt-deliver__proof { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.gt-deliver__avatars { display: flex; }
.gt-deliver__avatars img { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; border: 3px solid #fff; box-shadow: 0 4px 12px rgba(0, 0, 0, .12); }
.gt-deliver__avatars img + img { margin-left: -14px; }
.gt-deliver__review { display: flex; flex-direction: column; gap: 3px; color: var(--gt-ink); font-size: 14.5px; font-weight: 600; }
.gt-deliver__stars { display: inline-flex; gap: 2px; color: var(--gt-amber); }
.gt-deliver__stars svg { fill: currentColor; }
.gt-deliver__gallery { position: relative; z-index: 1; display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 24px; }
.gt-deliver__gallery--2 { grid-template-columns: 2fr 1fr; }
.gt-deliver__gallery--1 { grid-template-columns: 1fr; }
.gt-deliver__img { position: relative; height: 420px; margin: 0; overflow: hidden; border-radius: 28px; box-shadow: 0 24px 50px rgba(6, 38, 24, .22); }
.gt-deliver__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--gt-ease); }
.gt-deliver__img:hover img { transform: scale(1.05); }
.gt-deliver__img figcaption { position: absolute; left: 16px; bottom: 16px; padding: 6px 14px; border-radius: 999px; background: rgba(255, 255, 255, .92); color: var(--gt-ink); font-size: 13px; font-weight: 700; }
.gt-deliver__band { position: relative; margin-top: -190px; padding: 250px 0 70px; background: var(--gt-grad-dark); overflow: hidden; }
.gt-deliver__band::before {
    content: ""; position: absolute; inset: 0; opacity: .5;
    background: radial-gradient(520px 260px at 85% 100%, rgba(141, 192, 72, .28), transparent 70%), radial-gradient(420px 240px at 5% 20%, rgba(27, 143, 70, .35), transparent 70%);
}
.gt-deliver__nums { position: relative; display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 24px; text-align: center; }
.gt-deliver__num { display: flex; flex-direction: column; gap: 6px; padding: 0 10px; }
.gt-deliver__num + .gt-deliver__num { border-left: 1px solid rgba(255, 255, 255, .12); }
.gt-deliver__num b { font-size: clamp(36px, 4vw, 56px); font-weight: 900 !important; line-height: 1.05; background: linear-gradient(180deg, #fff 20%, var(--gt-lime-2) 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.gt-deliver__num span { color: rgba(255, 255, 255, .78); font-size: 15px; font-weight: 600; }
@media (max-width: 991.98px) {
    .gt-deliver { padding-top: 64px; }
    .gt-deliver__top { grid-template-columns: 1fr; gap: 20px; }
    .gt-deliver__img { height: 320px; }
}
@media (max-width: 575.98px) {
    .gt-deliver__gallery, .gt-deliver__gallery--2 { grid-template-columns: 1fr 1fr; gap: 12px; }
    .gt-deliver__img { height: 190px; border-radius: 20px; }
    .gt-deliver__img:first-child { grid-column: 1 / -1; height: 230px; }
    .gt-deliver__band { margin-top: -110px; padding: 150px 0 48px; }
    .gt-deliver__nums { grid-template-columns: 1fr 1fr; gap: 26px 10px; }
    .gt-deliver__num + .gt-deliver__num { border-left: 0; }
}

/* 12. Đội ngũ — ảnh chân dung dọc (vietfood_teams kiểu gt_portrait) ------------------------------------------------ */
.gt-person { position: relative; margin: 0; overflow: hidden; border-radius: 24px; background: var(--gt-mint); }
.gt-person__img { aspect-ratio: 3 / 4; }
.gt-person__img img, .gt-person__img .gt-noimg { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--gt-ease); }
.gt-person:hover .gt-person__img img { transform: scale(1.06); }
.gt-person__cap {
    position: absolute; left: 12px; right: 12px; bottom: 12px; display: flex; flex-direction: column; gap: 2px; padding: 14px 16px;
    border-radius: 18px; background: rgba(255, 255, 255, .9); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
    text-align: center; transition: transform .4s var(--gt-ease);
}
.gt-person__cap strong { color: var(--gt-ink); font-size: 17px; font-weight: 700; }
.gt-person__cap span { color: var(--gt-brand); font-size: 14px; font-weight: 600; }
.gt-person__cap small {
    display: inline-flex; align-items: center; justify-content: center; gap: 5px; max-height: 0; overflow: hidden; opacity: 0;
    color: var(--gt-text); font-size: 13px; transition: max-height .4s var(--gt-ease), opacity .4s, margin .4s;
}
.gt-person__cap small svg { color: var(--gt-brand); }
.gt-person:hover .gt-person__cap small { max-height: 40px; opacity: 1; margin-top: 4px; }
@media (hover: none) { .gt-person__cap small { max-height: 40px; opacity: 1; margin-top: 4px; } }

/* 13. Đánh giá — 3 cột tự cuộn dọc (Danang24h_review kiểu gt_columns) --------------------------------------------- */
.gt-testi__cols {
    position: relative; display: grid; grid-template-columns: repeat(var(--gt-cols, 3), minmax(0, 1fr)); gap: 24px; height: 640px; overflow: hidden;
    -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 12%, #000 88%, transparent 100%);
    mask-image: linear-gradient(180deg, transparent 0, #000 12%, #000 88%, transparent 100%);
}
.gt-testi__cols--1 { --gt-cols: 1; max-width: 520px; margin: 0 auto; }
.gt-testi__cols--2 { --gt-cols: 2; }
.gt-testi__col { min-width: 0; overflow: hidden; }
.gt-testi__col--all { display: none; }
.gt-testi__track { display: flex; flex-direction: column; gap: 24px; animation: gtScrollUp var(--gt-dur, 40s) linear infinite; }
.gt-testi__track--rev { animation-direction: reverse; }
.gt-testi__cols:hover .gt-testi__track { animation-play-state: paused; }
@keyframes gtScrollUp { from { transform: translateY(0); } to { transform: translateY(calc(-50% - 12px)); } }
.gt-quote { margin: 0; padding: 28px 28px 24px; border-radius: 22px; background: #fff; border: 1px solid var(--gt-line); box-shadow: 0 6px 20px rgba(16, 36, 26, .05); }
.gt-sec--white .gt-quote { background: var(--gt-mint-2); }
.gt-quote__mark { display: inline-grid; place-items: center; width: 46px; height: 46px; margin-bottom: 14px; border-radius: 14px; background: var(--gt-grad); color: #fff; }
.gt-quote blockquote { margin: 0 0 18px; color: var(--gt-ink); font-size: 15.5px; line-height: 1.7; }
.gt-quote figcaption { display: flex; align-items: center; gap: 12px; padding-top: 16px; border-top: 1px solid var(--gt-line); }
.gt-quote figcaption img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; }
.gt-quote__who { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.gt-quote__who strong { color: var(--gt-ink); font-size: 16px; font-weight: 700; }
.gt-quote__who small { color: var(--gt-muted); font-size: 13px; }
.gt-quote__stars { display: inline-flex; gap: 1px; color: #d6dcd8; }
.gt-quote__stars .is-on { color: var(--gt-amber); }
.gt-quote__stars svg { fill: currentColor; }
@media (max-width: 991.98px) {
    .gt-testi__cols { --gt-cols: 2; }
    .gt-testi__cols > .gt-testi__col:nth-child(3) { display: none; }
}
@media (max-width: 575.98px) {
    .gt-testi__cols { --gt-cols: 1; height: 560px; }
    .gt-testi__cols > .gt-testi__col { display: none !important; }
    .gt-testi__cols > .gt-testi__col--all { display: block !important; }
    .gt-quote { padding: 22px 20px 18px; }
}
@media (prefers-reduced-motion: reduce) { .gt-testi__track { animation: none; } .gt-testi__cols { height: auto; overflow: visible; -webkit-mask-image: none; mask-image: none; } }

/* 14. Vì sao chọn — nền ảnh + thẻ kính + chữ lớn chạy (vne_about_text kiểu gt_glass) ------------------------------- */
.gt-why { position: relative; isolation: isolate; overflow: hidden; padding: 100px 0 0; color: #fff; background: var(--gt-g900); }
.gt-why__bg { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.gt-why__shade { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(6, 38, 24, .92) 0%, rgba(6, 38, 24, .6) 45%, rgba(6, 38, 24, .88) 100%); }
.gt-why .gt-head__title { color: #fff; }
.gt-why .gt-head__kicker { color: var(--gt-lime); }
.gt-why .gt-head__desc { color: rgba(255, 255, 255, .78); }
.gt-why .gt-head__title em { background: linear-gradient(90deg, var(--gt-lime-2), var(--gt-lime)); -webkit-background-clip: text; background-clip: text; }
.gt-why__item {
    padding: 30px 26px; border-radius: 24px; border: 1px solid rgba(255, 255, 255, .2); background: rgba(255, 255, 255, .08);
    -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); text-align: center; transition: transform .35s var(--gt-ease), background .35s;
}
.gt-why__item:hover { transform: translateY(-6px); background: rgba(255, 255, 255, .14); }
.gt-why__icon { width: 66px; height: 66px; margin: 0 auto 18px; display: grid; place-items: center; border-radius: 50%; color: #fff; box-shadow: 0 0 0 8px rgba(255, 255, 255, .08); }
.gt-why__icon img { width: 32px; height: 32px; object-fit: contain; }
.gt-why__icon svg { width: 28px; height: 28px; }
.gt-why__icon--green { background: var(--gt-brand); }
.gt-why__icon--lime { background: var(--gt-lime); color: var(--gt-g900); }
.gt-why__icon--amber { background: var(--gt-amber); }
.gt-why__icon--teal { background: #0e9384; }
.gt-why__icon--sky { background: #0ea5e9; }
.gt-why__item h3 { margin: 0 0 10px; color: #fff; font-size: 19px; font-weight: 700 !important; }
.gt-why__item p { margin: 0; color: rgba(255, 255, 255, .78); font-size: 15px; line-height: 1.65; }
.gt-why__marquee { display: flex; overflow: hidden; margin-top: 64px; padding: 22px 0 30px; }
.gt-why__track { display: flex; flex-shrink: 0; width: max-content; animation: gtMarquee 40s linear infinite; }
.gt-why__word {
    display: inline-flex; align-items: center; gap: 22px; padding-right: 22px; white-space: nowrap;
    font-size: clamp(34px, 5vw, 40px); font-weight: 900; line-height: 1; letter-spacing: -.01em; text-transform: uppercase; color: #fff;
}
.gt-why__word--outline { color: transparent; -webkit-text-stroke: 1.5px rgba(255, 255, 255, .75); }
.gt-why__word i {
    display: inline-grid; place-items: center; flex-shrink: 0; width: 1em; height: 1em; border-radius: 50%; font-style: normal;
    background: var(--gt-grad); color: #fff; -webkit-text-stroke: 0;
}
.gt-why__word i svg { width: .42em; height: .42em; }
@media (max-width: 575.98px) {
    .gt-why { padding-top: 64px; }
    .gt-why__grid { grid-auto-columns: 78%; }
    .gt-why__marquee { margin-top: 44px; padding: 16px 0 26px; }
    .gt-why__word { gap: 14px; padding-right: 14px; }
}
@media (prefers-reduced-motion: reduce) { .gt-why__track { animation: none; } }

/* 15. Tin tức — thẻ ảnh lớn, khung kính (Danang24h_new kiểu gt_overlay) ------------------------------------------- */
.gt-post { position: relative; height: 500px; overflow: hidden; border-radius: 26px; background: var(--gt-mint); isolation: isolate; }
.gt-post__link { position: absolute; inset: 0; z-index: -1; }
.gt-post__link img, .gt-post__link .gt-noimg { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--gt-ease); }
.gt-post:hover .gt-post__link img { transform: scale(1.07); }
.gt-post::after { content: ""; position: absolute; inset: 40% 0 0; z-index: -1; background: linear-gradient(180deg, transparent, rgba(6, 38, 24, .55)); pointer-events: none; }
.gt-post__cat { position: absolute; top: 18px; left: 18px; padding: 7px 14px; border-radius: 999px; background: rgba(255, 255, 255, .92); color: var(--gt-primary); font-size: 13px; font-weight: 700; }
.gt-post__panel {
    position: absolute; left: 14px; right: 14px; bottom: 14px; padding: 18px 20px; border-radius: 20px; color: #fff;
    border: 1px solid rgba(255, 255, 255, .22); background: rgba(6, 38, 24, .45); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
}
.gt-post__date { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 8px; color: rgba(255, 255, 255, .85); font-size: 13px; }
.gt-post__title { margin: 0; font-size: 19px; font-weight: 700 !important; line-height: 1.4; }
.gt-post__title a { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; color: #fff; text-decoration: none; }
.gt-post__more {
    display: inline-flex; align-items: center; gap: 6px; max-height: 0; margin-top: 0; overflow: hidden; opacity: 0;
    color: var(--gt-lime-2); font-size: 14px; font-weight: 700; text-decoration: none; transition: all .4s var(--gt-ease);
}
.gt-post:hover .gt-post__more { max-height: 30px; margin-top: 10px; opacity: 1; }
@media (hover: none) { .gt-post__more { max-height: 30px; margin-top: 10px; opacity: 1; } }
@media (max-width: 991.98px) { .gt-post { height: 430px; } }
@media (max-width: 575.98px) { .gt-post { height: 400px; } }

/* 16. Dải logo đối tác (vietfood_partner kiểu gt_marquee) --------------------------------------------------------- */
.gt-partners { padding: 30px 0 64px; background: #fff; }
.gt-partners__title { display: flex; align-items: center; gap: 18px; margin-bottom: 24px; color: var(--gt-muted); font-size: 14px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.gt-partners__title::before, .gt-partners__title::after { content: ""; flex: 1; height: 1px; background: var(--gt-line); }
.gt-partners__band {
    display: flex; overflow: hidden;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent); mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
}
.gt-partners__track { display: flex; align-items: center; flex-shrink: 0; width: max-content; animation: gtMarquee 45s linear infinite; }
.gt-partners__band:hover .gt-partners__track { animation-play-state: paused; }
.gt-partners__logo { display: grid; place-items: center; width: 190px; height: 76px; margin-right: 22px; padding: 12px 22px; border-radius: 16px; border: 1px solid var(--gt-line); background: #fff; }
/* Logo hiện đủ màu ngay (không phủ xám/mờ chờ rê chuột) */
.gt-partners__logo { transition: border-color .3s, box-shadow .3s; }
.gt-partners__logo img { max-width: 100%; max-height: 46px; object-fit: contain; }
.gt-partners__logo:hover { border-color: var(--gt-primary); box-shadow: 0 8px 22px rgba(16, 36, 26, .08); }
@media (max-width: 575.98px) { .gt-partners__logo { width: 150px; height: 64px; margin-right: 14px; } }
@media (prefers-reduced-motion: reduce) { .gt-partners__track { animation: none; flex-wrap: wrap; } }

/* ==========================================================================
   17. Trang Về chúng tôi (dựng theo bố cục demo about-us, màu Greentours)
   ========================================================================== */

/* 17.1 Banner đầu trang con (vietfood_banner_breadcrumb kiểu gt_banner) */
.gt-pbanner {
    position: relative; isolation: isolate; overflow: hidden; display: grid; place-items: center; min-height: 280px;
    padding: 72px 0 64px; text-align: center; color: #fff; background: var(--gt-grad-dark);
}
.gt-pbanner__bg { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: center 64%; }
.gt-pbanner::before {
    content: ""; position: absolute; inset: 0; z-index: -1;
    background: linear-gradient(180deg, rgba(6, 38, 24, .5) 0%, rgba(6, 38, 24, .62) 55%, rgba(6, 38, 24, .82) 100%);
}
.gt-pbanner__title {
    margin: 0 0 16px; color: #fff; font-size: clamp(30px, 4vw, 48px); font-weight: 800; line-height: 1.15;
    letter-spacing: -.01em; text-shadow: 0 2px 22px rgba(0, 0, 0, .3);
}
.gt-pbanner__crumb {
    display: inline-flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; padding: 8px 18px;
    border-radius: 999px; border: 1px solid rgba(255, 255, 255, .24); background: rgba(255, 255, 255, .12);
    -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); font-size: 14.5px;
}
.gt-pbanner__crumb a { display: inline-flex; align-items: center; gap: 6px; color: rgba(255, 255, 255, .88); text-decoration: none; }
.gt-pbanner__crumb a:hover { color: var(--gt-lime-2); }
.gt-pbanner__crumb > svg { color: var(--gt-lime); }
.gt-pbanner__crumb span { color: var(--gt-lime-2); font-weight: 600; }
@media (max-width: 575.98px) { .gt-pbanner { min-height: 200px; padding: 48px 0 44px; } }

/* 17.2 Giới thiệu chia đôi — ảnh ghép + nội dung (vne_about kiểu gt_split) */
.gt-asplit__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 72px; align-items: center; }
.gt-asplit__media { position: relative; padding: 46px 0 34px; }
.gt-asplit__dots {
    position: absolute; top: 0; left: -28px; z-index: 0; width: 200px; height: 200px; opacity: .6;
    background-image: radial-gradient(var(--gt-lime) 1.7px, transparent 1.9px); background-size: 16px 16px;
}
.gt-asplit__main {
    position: relative; z-index: 1; margin-right: 90px; aspect-ratio: 4 / 3.7; overflow: hidden; border-radius: 26px;
    background: var(--gt-mint); box-shadow: var(--gt-shadow-lg);
}
.gt-asplit__main img, .gt-asplit__main .gt-noimg { width: 100%; height: 100%; object-fit: cover; }
.gt-asplit__sub {
    position: absolute; top: 0; right: 0; z-index: 2; width: 46%; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 20px;
    border: 6px solid #fff; background: var(--gt-mint); box-shadow: var(--gt-shadow-lg);
}
.gt-asplit__sub img { width: 100%; height: 100%; object-fit: cover; }
.gt-asplit__badge {
    position: absolute; right: 28px; bottom: 0; z-index: 3; display: flex; align-items: center; gap: 12px; padding: 14px 20px 14px 14px;
    border-radius: 18px; background: #fff; box-shadow: var(--gt-shadow-lg); animation: gtFloat 5s ease-in-out infinite;
}
@keyframes gtFloat { 50% { transform: translateY(-8px); } }
.gt-asplit__badge-ic { flex-shrink: 0; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; background: var(--gt-grad-diag); color: #fff; }
.gt-asplit__badge strong { display: block; color: var(--gt-ink); font-size: 16px; font-weight: 800; line-height: 1.3; }
.gt-asplit__badge small { display: block; color: var(--gt-muted); font-size: 13px; }
.gt-asplit .gt-head__kicker { margin-bottom: 10px; }
.gt-asplit .gt-head__kicker::before { display: none; }
.gt-asplit__title { margin: 0 0 18px; color: var(--gt-ink); font-size: clamp(28px, 3vw, 40px); font-weight: 800 !important; line-height: 1.22; letter-spacing: -.01em; }
.gt-asplit__title span, .gt-asplit__title em { display: block; text-wrap: balance; }
.gt-asplit__title em { font-style: normal; background: var(--gt-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.gt-asplit__desc { color: var(--gt-text); font-size: 16px; line-height: 1.75; }
.gt-asplit__desc p { margin: 0 0 12px; }
.gt-asplit__points { display: grid; gap: 16px; margin: 22px 0 0; padding: 0; list-style: none; }
.gt-asplit__points li { display: flex; align-items: center; gap: 16px; }
.gt-asplit__ic { flex-shrink: 0; width: 54px; height: 54px; display: grid; place-items: center; border-radius: 50%; color: #fff; }
.gt-asplit__ic img { width: 26px; height: 26px; object-fit: contain; }
.gt-asplit__ic--green { background: var(--gt-brand); box-shadow: 0 0 0 7px var(--gt-mint); }
.gt-asplit__ic--amber { background: var(--gt-amber); box-shadow: 0 0 0 7px #fff4df; }
.gt-asplit__points p { margin: 0; color: var(--gt-text); font-size: 15.5px; line-height: 1.6; }
.gt-asplit__points strong { display: block; margin-bottom: 2px; color: var(--gt-ink); font-size: 16.5px; font-weight: 700; }
.gt-asplit__note { margin-top: 24px; padding-top: 20px; border-top: 1px dashed var(--gt-line); }
.gt-asplit__note h3 { margin: 0 0 6px; color: var(--gt-brand); font-size: 14px; font-weight: 800 !important; letter-spacing: .08em; text-transform: uppercase; }
.gt-asplit__note p { margin: 0; color: var(--gt-text); font-size: 15.5px; line-height: 1.7; }
@media (max-width: 991.98px) {
    .gt-asplit__grid { grid-template-columns: 1fr; gap: 44px; }
    .gt-asplit__media { width: 100%; max-width: 600px; margin: 0 auto; }
}
@media (max-width: 575.98px) {
    .gt-asplit__media { padding: 34px 0 30px; }
    .gt-asplit__main { margin-right: 44px; }
    .gt-asplit__sub { width: 48%; border-width: 4px; }
    .gt-asplit__badge { right: 8px; padding: 10px 14px 10px 10px; }
    .gt-asplit__badge-ic { width: 38px; height: 38px; }
    .gt-asplit__dots { left: -16px; width: 140px; height: 140px; }
    .gt-asplit__points li { align-items: flex-start; gap: 14px; }
    .gt-asplit__ic { width: 46px; height: 46px; }
}

/* Ngôi sao trang trí (các khối trang Về chúng tôi) */
.gt-spark {
    position: absolute; z-index: 0; width: 34px; height: 34px; pointer-events: none; background: var(--gt-lime);
    clip-path: polygon(50% 0, 61% 39%, 100% 50%, 61% 61%, 50% 100%, 39% 61%, 0 50%, 39% 39%);
}
.gt-spark--a { top: 44px; right: 7%; background: var(--gt-brand); }
.gt-spark--b { bottom: 54px; left: 2%; width: 26px; height: 26px; background: var(--gt-amber); }
.gt-spark--c { top: 70px; right: 14%; width: 28px; height: 28px; }
.gt-wplain, .gt-wcards, .gt-tcards { position: relative; overflow: hidden; }
@media (max-width: 767.98px) { .gt-spark { display: none; } }

/* 17.3 "Vì sao chọn" kiểu nhẹ (vne_about_text kiểu gt_plain) */
.gt-wplain .gt-wrap { position: relative; z-index: 1; }
.gt-wplain .gt-head { max-width: none; margin-bottom: 40px; }
.gt-wplain .gt-head__kicker::before { display: none; }
.gt-wplain .gt-head__desc { margin-left: 0; }
.gt-wplain__grid { gap: 32px; }
.gt-wplain__icon {
    width: 58px; height: 58px; margin-bottom: 18px; display: grid; place-items: center; border-radius: 50%;
    background: var(--gt-g800); color: var(--gt-lime-2); box-shadow: 0 0 0 6px rgba(27, 143, 70, .1); transition: background .3s, color .3s;
}
.gt-wplain__icon svg { width: 26px; height: 26px; }
.gt-wplain__icon img { width: 28px; height: 28px; object-fit: contain; }
.gt-wplain__item:hover .gt-wplain__icon { background: var(--gt-grad-diag); color: #fff; }
.gt-wplain__item h3 { margin: 0 0 8px; color: var(--gt-ink); font-size: 18px; font-weight: 700 !important; }
.gt-wplain__item p { margin: 0; color: var(--gt-text); font-size: 15px; line-height: 1.65; }
@media (max-width: 575.98px) { .gt-wplain__grid { grid-auto-columns: 80%; } }

/* 17.4 Thẻ khung trắng — đội ngũ / đoàn khách (vietfood_teams kiểu gt_card) */
.gt-tcard {
    position: relative; margin: 0; padding: 10px 10px 18px; border-radius: 20px; border: 1px solid var(--gt-line); background: #fff;
    box-shadow: 0 6px 20px rgba(16, 36, 26, .05); transition: transform .35s var(--gt-ease), box-shadow .35s;
}
.gt-tcard:hover { box-shadow: var(--gt-shadow-lg); }
.gt-tcard__img { aspect-ratio: 1 / 1; overflow: hidden; border-radius: 14px; background: var(--gt-mint); }
.gt-tcard__img img, .gt-tcard__img .gt-noimg { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--gt-ease); }
.gt-tcard:hover .gt-tcard__img img { transform: scale(1.06); }
.gt-tcard__cap {
    position: relative; display: flex; flex-direction: column; align-items: center; gap: 2px; margin: -30px 14px 0; padding: 12px 12px 10px;
    border-radius: 14px; background: #fff; box-shadow: 0 8px 22px rgba(16, 36, 26, .1); text-align: center;
}
.gt-tcard__cap strong { color: var(--gt-ink); font-size: 16.5px; font-weight: 700; line-height: 1.35; }
.gt-tcard__cap span { color: var(--gt-brand); font-size: 13.5px; font-weight: 600; }
.gt-tcard__cap small { color: var(--gt-muted); font-size: 13px; }
.gt-tcard__link { color: inherit; text-decoration: none; }
.gt-tcard__link::after { content: ""; position: absolute; inset: 0; z-index: 2; }
.gt-tcard__link:hover strong { color: var(--gt-brand); }
.gt-tcards .gt-tcard[data-gt-reveal].is-in:hover { transform: translateY(-6px); }
.gt-tcards .gt-btn--grad { background: var(--gt-g800); box-shadow: none; }
.gt-tcards .gt-btn--grad:hover { background: var(--gt-grad); }

/* 17.5 Dải con số (vietfood_about_info kiểu gt_counters) */
.gt-counters { position: relative; isolation: isolate; overflow: hidden; padding: 78px 0; background: #fff; }
.gt-counters::before {
    content: ""; position: absolute; inset: 0; z-index: -1;
    background: radial-gradient(ellipse 46% 70% at 50% 50%, rgba(141, 192, 72, .2), rgba(141, 192, 72, 0) 70%);
}
.gt-counters__bar { position: absolute; top: 50%; z-index: -1; width: 70px; height: 16px; border-radius: 4px; }
.gt-counters__bar--l { left: 0; transform: translateY(-50%) skewY(-8deg); background: var(--gt-brand); }
.gt-counters__bar--r { right: 0; transform: translateY(-50%) skewY(-8deg); background: var(--gt-lime); }
.gt-counters .gt-head { margin-bottom: 36px; }
.gt-counters__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.gt-counters__grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.gt-counters__grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.gt-counter { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; }
.gt-counter__label { display: inline-flex; align-items: center; gap: 7px; font-size: 14.5px; font-weight: 700; }
.gt-counter b { color: var(--gt-ink); font-size: clamp(34px, 3.6vw, 48px); font-weight: 800; line-height: 1.05; letter-spacing: -.01em; }
.gt-counter--green .gt-counter__label { color: var(--gt-brand); }
.gt-counter--teal .gt-counter__label { color: #0e9384; }
.gt-counter--amber .gt-counter__label { color: #c47d00; }
.gt-counter--lime .gt-counter__label { color: #5f8f1f; }
@media (max-width: 767.98px) {
    .gt-counters { padding: 56px 0; }
    .gt-counters__grid, .gt-counters__grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 34px; }
    .gt-counters__bar { display: none; }
    .gt-counter__label { flex-direction: column; gap: 4px; font-size: 13.5px; text-wrap: balance; }
}

/* 17.6 Thẻ trắng có số thứ tự — sứ mệnh (vne_about_text kiểu gt_cards) */
.gt-wcards .gt-wrap { position: relative; z-index: 1; }
.gt-wcards__list { display: flex; flex-wrap: wrap; justify-content: center; gap: 24px; }
.gt-wcard {
    display: flex; flex-direction: column; flex: 0 1 calc((100% - 48px) / 3); padding: 26px 24px 20px; border-radius: 20px;
    border: 1px solid var(--gt-line); background: #fff; box-shadow: 0 8px 26px rgba(16, 36, 26, .06); transition: box-shadow .35s, transform .35s var(--gt-ease);
}
.gt-wcard[data-gt-reveal].is-in:hover { transform: translateY(-6px); box-shadow: var(--gt-shadow-lg); }
.gt-wcard h3 { margin: 0 0 10px; color: var(--gt-ink); font-size: 18px; font-weight: 700 !important; }
.gt-wcard p { flex: 1; margin: 0 0 20px; color: var(--gt-text); font-size: 15px; line-height: 1.7; }
.gt-wcard__foot { display: flex; align-items: center; gap: 12px; padding-top: 16px; border-top: 1px solid var(--gt-line); }
.gt-wcard__icon { flex-shrink: 0; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; color: #fff; }
.gt-wcard__icon svg { width: 20px; height: 20px; }
.gt-wcard__icon img { width: 22px; height: 22px; object-fit: contain; }
.gt-wcard__foot small { color: var(--gt-muted); font-size: 13px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }
.gt-wcard__no { margin-left: auto; padding: 4px 10px; border-radius: 8px; background: #fff4df; color: #9a6100; font-size: 13px; font-weight: 800; }
@media (max-width: 991.98px) { .gt-wcard { flex-basis: calc((100% - 24px) / 2); } }
@media (max-width: 575.98px) { .gt-wcard { flex-basis: 100%; } }
@media (prefers-reduced-motion: reduce) { .gt-asplit__badge { animation: none; } }

/* Popup video YouTube (main.js openYouTube → Fancybox bản mới): bỏ khung trắng 32px mặc định, nền đen bo góc.
   Fancybox giữ cao 720px cả trên điện thoại → ép khung 16:9, co theo bề ngang và chiều cao màn hình. */
.fancybox__slide.has-iframe .f-html {
    width: min(1280px, 100%, calc((100vh - 60px) * 16 / 9)) !important; height: auto !important; aspect-ratio: 16 / 9;
    padding: 0 !important; overflow: hidden; border-radius: 16px; background: #000 !important;
}
.fancybox__slide.has-iframe .f-iframe { display: block; width: 100%; height: 100%; }