/* =========================================================
   ObeGames – lớp giao diện làm mới (nạp sau cùng trên mọi trang công khai)
   - Giữ nguyên nội dung chữ, chỉ thay đổi cách trình bày
   - Bỏ khung viền quanh chữ, thêm ảnh minh hoạ cho các thẻ
   ========================================================= */

:root {
    --obe-accent: #79d8ff;
    --obe-text: #f4f7ff;
    --obe-muted: #9aa6c4;
    --obe-line: rgba(255, 255, 255, .08);
    --obe-card: linear-gradient(180deg, #111a38 0%, #0a1027 100%);
    --obe-radius: 18px;
}

/* ---------- 1. Tắt màn hình chờ (tăng tốc hiển thị) ---------- */
#de-loader {
    display: none !important;
}

/* ---------- 2. Nhãn mục: bỏ khung viền quanh chữ ---------- */
body .subtitle,
body .home-services-kicker,
body .home-tier3-kicker,
body .shield-badge {
    display: inline-flex !important;
    align-items: center;
    gap: 10px;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: none !important;
    box-shadow: none !important;
    color: var(--obe-accent) !important;
    font-size: 12.5px !important;
    font-weight: 800 !important;
    letter-spacing: .12em !important;
    line-height: 1.4 !important;
    text-transform: uppercase;
}

body .subtitle:not(.blink)::before,
body .home-services-kicker::before {
    content: "";
    display: inline-block;
    width: 22px;
    height: 2px;
    border-radius: 2px;
    background: linear-gradient(90deg, #8b7bff, #38b6ff);
}

body .home-tier3-kicker i,
body .shield-badge .shield-badge-icon {
    display: none !important;
}

/* ---------- 3. Thẻ có ảnh minh hoạ (dùng chung) ---------- */
.obe-card-media {
    position: relative;
    overflow: hidden;
    aspect-ratio: 16 / 10;
    margin: 0 0 22px;
    border-radius: 14px;
    background: #0a0f1f;
}

.obe-card-media img {
    display: block;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    object-fit: cover;
    transition: transform .5s ease;
}

article:hover > .obe-card-media img,
.why-obegames-feature:hover .obe-card-media img {
    transform: scale(1.03);
}

/* =========================================================
   TRANG CHỦ
   ========================================================= */

/* Hero: hộp số liệu đè lên ảnh -> hàng số liệu gọn bên dưới ảnh */
@media (min-width: 992px) {
    .home-hero-section .d_wrap {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-end;
    }

    .home-hero-section .d_wrap > img {
        flex: 0 0 100%;
    }

    .home-hero-section .d_wrap_sm-box {
        position: static !important;
        flex: 1 1 0;
        min-width: 0;
        margin: 0 !important;
        padding: 4px 20px !important;
        border: 0 !important;
        border-left: 1px solid var(--obe-line) !important;
        border-radius: 0 !important;
        background: none !important;
        box-shadow: none !important;
        text-align: left;
        transform: none !important;
    }

    .home-hero-section .d_wrap_sm-box.b1 {
        border-left: 0 !important;
        padding-left: 0 !important;
    }

    .home-hero-section .d_wrap_sm-box i {
        display: none !important;
    }

    .home-hero-section .d_wrap_sm-box h3 {
        color: #fff;
        font-size: 26px !important;
        letter-spacing: -.02em;
    }

    .home-hero-section .d_wrap_sm-box h6 {
        margin: 2px 0 0;
        color: var(--obe-muted) !important;
        font-size: 13px !important;
    }
}

/* Dải địa điểm: chữ nhỏ và nhạt hơn */
.de-marquee-list.s2 .d-item-txt {
    font-size: 38px !important;
    color: rgba(255, 255, 255, .2) !important;
    -webkit-text-stroke: 0 !important;
}

.de-marquee-list.s2 .d-item-txt img {
    width: 34px !important;
    height: 34px !important;
}

/* Dịch vụ: giữ ảnh cũ, bỏ khung, ảnh nằm trên nền sân khấu */
.home-service-card {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.home-service-card::after {
    display: none !important;
}

.home-service-card:hover {
    transform: none !important;
    box-shadow: none !important;
}

.home-service-graphic {
    height: 230px;
    margin: 0 0 22px !important;
    border: 1px solid var(--obe-line);
    border-radius: var(--obe-radius);
    background:
        radial-gradient(70% 80% at 50% 100%, rgba(124, 92, 255, .38), transparent 70%),
        linear-gradient(180deg, #141b3d, #0c1129);
}

.home-service-graphic img {
    width: auto !important;
    max-width: 78% !important;
    height: 168px !important;
    object-fit: contain;
    filter: drop-shadow(0 20px 30px rgba(0, 0, 0, .45));
    transition: transform .3s ease;
}

.home-service-card:hover .home-service-graphic img {
    transform: translateY(-6px) scale(1.03);
}

.home-service-card h3,
.home-service-card p,
.home-service-card .home-service-link {
    padding: 0 4px;
}

.home-service-card h3 {
    text-align: left !important;
}

.home-service-card p {
    color: var(--obe-muted) !important;
}

/* Vì sao chọn ObeGames: icon riêng, căn trái */
.why-obegames-feature {
    padding: 8px 6px;
    text-align: left !important;
}

.why-obegames-feature img.obe-hex-icon {
    width: 84px;
    height: 84px;
    margin: 0 0 18px !important;
}

.why-obegames-feature h4,
.why-obegames-feature p {
    text-align: left !important;
}

.why-obegames-feature p {
    color: var(--obe-muted);
}

/* Datacenter Tier-3: bỏ khung panel, ảnh lớn bo góc */
.home-tier3-panel {
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
    box-shadow: none !important;
}

.home-tier3-panel::before,
.home-tier3-panel::after {
    display: none !important;
}

.home-tier3-visual {
    overflow: hidden;
    border: 0 !important;
    border-radius: 22px !important;
    box-shadow: 0 40px 90px rgba(0, 0, 0, .5) !important;
}

.home-tier3-visual img {
    border-radius: 22px !important;
}

.home-tier3-points li {
    padding: 14px 0 !important;
    border-top: 1px solid var(--obe-line);
}

/* Đánh giá khách hàng: thẻ nhẹ, không viền */
.de_testi.type-2 blockquote {
    border: 0 !important;
    border-radius: 18px !important;
    background: rgba(255, 255, 255, .04) !important;
}

/* =========================================================
   TRANG VPS
   ========================================================= */

/* Dải thông số: bỏ khung ngoài */
.vps-trust-grid {
    border: 0 !important;
    border-radius: 0 !important;
    background: none !important;
    box-shadow: none !important;
}

.vps-trust-item {
    border-color: var(--obe-line) !important;
}

/* 6 thẻ hạ tầng: bỏ khung, dạng danh sách gọn có đường kẻ */
.vps-feature-grid {
    gap: 0 40px !important;
}

.vps-feature-grid article {
    min-height: 0 !important;
    padding: 26px 0 !important;
    border: 0 !important;
    border-top: 1px solid var(--obe-line) !important;
    border-radius: 0 !important;
    background: none !important;
    box-shadow: none !important;
}

/* Nhu cầu sử dụng: thẻ ảnh */
.vps-usecase-grid {
    gap: 22px !important;
}

.vps-usecase-grid article {
    display: block !important;
    padding: 14px 14px 24px !important;
    border: 1px solid var(--obe-line) !important;
    border-radius: 20px !important;
    background: var(--obe-card) !important;
}

.vps-usecase-grid article > div:last-child {
    padding: 0 10px;
}

.vps-usecase-grid h3 {
    font-size: 19px !important;
}

.vps-usecase-grid p {
    font-size: 14px !important;
}

/* Thanh toán: thẻ icon, viền mảnh */
.vps-billing-cards article {
    border: 1px solid var(--obe-line) !important;
    border-radius: 18px !important;
    background: var(--obe-card) !important;
    box-shadow: none !important;
}

/* 3 bước: bỏ khung, dạng dòng thời gian */
.vps-steps-grid article,
.dedicated-step-grid article {
    padding: 24px 0 0 !important;
    border: 0 !important;
    border-top: 2px solid rgba(121, 216, 255, .35) !important;
    border-radius: 0 !important;
    background: none !important;
    box-shadow: none !important;
}

/* =========================================================
   TRANG MÁY CHỦ VẬT LÝ
   ========================================================= */

.dedicated-trust-grid {
    border: 0 !important;
    border-radius: 0 !important;
    background: none !important;
}

.dedicated-trust-grid > div {
    border-color: var(--obe-line) !important;
}

.dedicated-benefit-grid {
    gap: 0 40px !important;
}

.dedicated-benefit-grid article {
    min-height: 0 !important;
    padding: 26px 0 !important;
    border: 0 !important;
    border-top: 1px solid var(--obe-line) !important;
    border-radius: 0 !important;
    background: none !important;
}

.dedicated-usecase-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 22px !important;
}

.dedicated-usecase-grid article {
    min-height: 0 !important;
    padding: 14px 14px 24px !important;
    border: 1px solid var(--obe-line) !important;
    border-radius: 20px !important;
    background: var(--obe-card) !important;
}

.dedicated-usecase-grid h3,
.dedicated-usecase-grid p {
    padding: 0 10px;
}

.dedicated-usecase-grid h3 {
    font-size: 19px !important;
}

.dedicated-usecase-grid p {
    font-size: 14px !important;
}

/* =========================================================
   TRANG BẢO VỆ DDOS
   ========================================================= */

/* 3 thẻ nhỏ dưới hero: bỏ khung */
.shield-mini-grid {
    gap: 0 !important;
}

.shield-mini-card {
    padding: 4px 26px !important;
    border: 0 !important;
    border-left: 1px solid var(--obe-line) !important;
    border-radius: 0 !important;
    background: none !important;
    box-shadow: none !important;
}

.shield-mini-card:first-child {
    padding-left: 0 !important;
    border-left: 0 !important;
}

/* 4 lớp phòng thủ: thẻ icon, viền mảnh */
.shield-layer-card {
    border: 1px solid var(--obe-line) !important;
    border-radius: 18px !important;
    background: var(--obe-card) !important;
}

.shield-layer-card::after {
    display: none !important;
}

.shield-layer-card-featured {
    border-color: rgba(139, 123, 255, .45) !important;
}

/* Bỏ các góc kẻ trang trí trên thẻ */
body .shield-mini-card::before,
body .shield-feature-grid article::before,
body .shield-layer-card::before,
body .shield-process-list article::before,
body .shield-assurance-card::before {
    display: none !important;
}

/* 4 bước triển khai: bỏ khung từng bước, giữ số thứ tự và đường nối */
body .shield-process-list article {
    border: 0 !important;
    background: none !important;
    box-shadow: none !important;
}

/* Ảnh mô hình triển khai: bỏ khung kẻ bao quanh ảnh */
.shield-operation-section .col-lg-6 > div > div {
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
    box-shadow: none !important;
}

.shield-operation-section .col-lg-6 > div > div > img {
    border-radius: 20px !important;
}

/* 6 thẻ quản lý: bỏ khung */
.shield-feature-grid {
    gap: 0 40px !important;
}

.shield-feature-grid article {
    min-height: 0 !important;
    padding: 26px 0 !important;
    border: 0 !important;
    border-top: 1px solid var(--obe-line) !important;
    border-radius: 0 !important;
    background: none !important;
    box-shadow: none !important;
}

.shield-feature-grid article:hover {
    transform: none !important;
}

/* Website & Game Server: giữ hình, bo góc mềm hơn */
.shield-usecase-card {
    border-color: var(--obe-line) !important;
    border-radius: 20px !important;
}

/* Khối cam kết: bỏ khung viền ngoài */
.shield-assurance-card {
    border: 0 !important;
    border-radius: 24px !important;
    box-shadow: none !important;
}

/* =========================================================
   MOBILE
   ========================================================= */
@media (max-width: 991px) {
    .dedicated-usecase-grid {
        grid-template-columns: 1fr !important;
    }

    .shield-mini-card {
        padding: 14px 0 !important;
        border-left: 0 !important;
        border-top: 1px solid var(--obe-line) !important;
    }

    .shield-mini-card:first-child {
        border-top: 0 !important;
    }
}

@media (max-width: 767px) {
    .vps-feature-grid,
    .dedicated-benefit-grid,
    .shield-feature-grid {
        gap: 0 !important;
    }

    .home-service-graphic {
        height: 200px;
    }

    .home-service-graphic img {
        height: 140px !important;
    }
}

/* =========================================================
   TRANG CHÍNH SÁCH / ĐIỀU KHOẢN: bố cục đọc, bỏ khung bao văn bản
   ========================================================= */
.obe-legal-container {
    width: min(100% - 32px, 820px) !important;
}

.obe-legal-card {
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: none !important;
    box-shadow: none !important;
}

.obe-legal-card + .obe-legal-card {
    margin-top: 40px;
    padding-top: 40px !important;
    border-top: 1px solid var(--obe-line) !important;
}


/* =========================================================
   BỘ ICON RIÊNG OBEGAMES (isometric 3D)
   ========================================================= */
.obe-hex-icon {
    display: block;
    flex: none;
    max-width: none !important;
    filter: drop-shadow(0 10px 18px rgba(0, 60, 200, .25));
}

/* Bỏ ô nền cũ bao quanh icon (icon isometric đã có bệ riêng) */
.vps-feature-icon,
.vps-billing-icon,
.shield-layer-icon,
.shield-feature-grid article > span {
    width: auto !important;
    height: auto !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
    box-shadow: none !important;
}

.vps-feature-icon,
.vps-billing-icon,
.shield-layer-icon {
    display: inline-block !important;
    margin-bottom: 18px !important;
}

.vps-feature-icon .obe-hex-icon,
.vps-billing-icon .obe-hex-icon,
.shield-layer-icon .obe-hex-icon,
.shield-feature-grid .obe-hex-icon {
    width: 72px;
    height: 72px;
}

.shield-feature-grid article > span {
    flex: 0 0 72px !important;
}

.dedicated-benefit-grid .obe-hex-icon {
    width: 72px;
    height: 72px;
    margin-bottom: 16px;
}

/* Dải thông số: icon nhỏ 44px */
.vps-trust-item {
    gap: 12px !important;
}

.vps-trust-item .obe-hex-icon,
.dedicated-trust-grid .obe-hex-icon {
    width: 52px;
    height: 52px;
}

.dedicated-trust-grid > div {
    grid-template-columns: 52px 1fr !important;
    column-gap: 12px !important;
}

.dedicated-trust-grid .obe-hex-icon {
    grid-row: 1 / 3;
    align-self: center;
}

/* Thẻ Website / Game Server trang DDoS: icon lớn */
.shield-usecase-visual .obe-hex-icon {
    position: relative;
    z-index: 2;
    width: 120px;
    height: 120px;
}

/* =========================================================
   HEADER PC: logo cùng hàng menu, menu to và nằm giữa
   ========================================================= */
@media (min-width: 1200px) {
    /* Bỏ logo ở thanh tiện ích phía trên, giữ tiện ích ở góc phải */
    body header.obegames-unified-header .obe-header-top-logo {
        display: none !important;
    }

    body header.obegames-unified-header .obe-header-utility-wrap .container {
        justify-content: flex-end !important;
    }

    body header.obegames-unified-header:not(.smaller) > .container {
        padding-top: 34px !important;
    }

    /* Hiện logo trong hàng menu */
    body header.obegames-unified-header:not(.smaller) .obe-header-main-logo-col {
        display: flex !important;
        flex: 0 0 auto !important;
        align-items: center;
    }

    body header.obegames-unified-header:not(.smaller) #logo img.logo-main {
        height: 64px !important;
        max-height: 64px !important;
    }

    /* Menu nằm giữa */
    body header.obegames-unified-header:not(.smaller) .de-flex.sm-pt10 > .header-col-mid,
    body header.obegames-unified-header.smaller .de-flex.sm-pt10 > .header-col-mid {
        flex: 1 1 auto !important;
        display: flex !important;
        justify-content: center !important;
        margin: 0 !important;
    }

    body header.obegames-unified-header:not(.smaller) #mainmenu,
    body header.obegames-unified-header.smaller #mainmenu {
        display: flex !important;
        align-items: center;
        justify-content: center;
        gap: 6px;
        margin: 0 auto !important;
        float: none !important;
        text-align: center !important;
    }

    /* Chữ menu to hơn */
    body header.obegames-unified-header:not(.smaller) #mainmenu > li > a,
    body header.obegames-unified-header.smaller #mainmenu > li > a {
        font-size: 16.5px !important;
        font-weight: 600 !important;
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    /* Bỏ khoảng cách 22px thừa của style.css -> các mục menu gần nhau hơn */
    body header.obegames-unified-header:not(.smaller) #mainmenu > li,
    body header.obegames-unified-header.smaller #mainmenu > li {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

/* =========================================================
   MENU NHỎ PHÍA TRÊN (PC): Gửi ticket · Khuyến mãi · Tin tức · Tài liệu · Tìm kiếm · Ngôn ngữ
   ========================================================= */
@media (min-width: 1200px) {
    /* Tài liệu & Tin tức đã chuyển lên menu nhỏ -> ẩn ở menu chính */
    body header.obegames-unified-header #mainmenu > li.obe-mainmenu-top-moved {
        display: none !important;
    }

    body header.obegames-unified-header .obe-header-utility {
        gap: 6px;
    }

    body header.obegames-unified-header .obe-header-utility-link,
    body header.obegames-unified-header .obe-header-utility-summary {
        position: relative;
        gap: 8px;
        min-height: 32px;
        padding: 0 12px;
        color: rgba(255, 255, 255, .82) !important;
        font-size: 13.5px !important;
        font-weight: 500;
    }

    body header.obegames-unified-header .obe-header-utility-link i,
    body header.obegames-unified-header .obe-header-utility-item > summary i {
        font-size: 14px !important;
        color: #79d8ff;
    }

    body header.obegames-unified-header .obe-header-utility-promo {
        color: #ffb85c !important;
    }

    body header.obegames-unified-header .obe-header-utility-promo i {
        color: #ff9f43 !important;
    }

    body header.obegames-unified-header .obe-header-utility-hot {
        top: -6px;
        right: -2px;
    }

    /* Mục đang xem: chữ trắng + vạch chân màu thương hiệu */
    body header.obegames-unified-header .obe-header-utility-link.active {
        color: #ffffff !important;
    }

    body header.obegames-unified-header .obe-header-utility-link.active::after {
        content: "";
        position: absolute;
        left: 12px;
        right: 12px;
        bottom: -4px;
        height: 2px;
        border-radius: 2px;
        background: linear-gradient(90deg, #2f6bff, #00c8ff);
    }

    /* Tìm kiếm: ô thả xuống nền tối, không đẩy lệch các mục khác */
    body header.obegames-unified-header .obe-header-utility-wrap {
        z-index: 45 !important;
    }

    body header.obegames-unified-header .obe-header-search {
        position: relative;
    }

    body header.obegames-unified-header .obe-header-search[open] > .obe-header-utility-summary {
        display: inline-flex !important;
        color: #ffffff !important;
        background: rgba(255, 255, 255, .08);
    }

    body header.obegames-unified-header .obe-header-search-panel {
        position: absolute !important;
        top: calc(100% + 10px);
        right: 0;
        z-index: 60;
        width: 320px !important;
        margin: 0 !important;
        padding: 10px !important;
        border: 1px solid rgba(121, 216, 255, .18) !important;
        border-radius: 14px !important;
        background: rgba(10, 16, 38, .96) !important;
        box-shadow: 0 24px 60px rgba(0, 0, 0, .45) !important;
        -webkit-backdrop-filter: blur(10px) !important;
        backdrop-filter: blur(10px) !important;
    }

    body header.obegames-unified-header .obe-header-search-form {
        height: 40px !important;
    }

    body header.obegames-unified-header .obe-header-search-form input {
        height: 40px !important;
        padding: 0 14px !important;
        border: 1px solid rgba(121, 216, 255, .22) !important;
        border-right: 0 !important;
        border-radius: 10px 0 0 10px !important;
        background: rgba(255, 255, 255, .06) !important;
        color: #ffffff !important;
        font-size: 14px !important;
        line-height: 40px !important;
    }

    body header.obegames-unified-header .obe-header-search-form input::placeholder {
        color: rgba(255, 255, 255, .5) !important;
    }

    body header.obegames-unified-header .obe-header-search-form button {
        flex: 0 0 44px !important;
        width: 44px !important;
        height: 40px !important;
        border-radius: 0 10px 10px 0 !important;
        background: linear-gradient(135deg, #1f5bff 0%, #00c8ff 100%) !important;
    }
}

/* =========================================================
   TRANG BẢO MẬT WEBSITE (quét & dọn mã độc)
   ========================================================= */
.websec-hero-visual {
    width: 100%;
    max-width: 560px;
    overflow: hidden;
    border-radius: 24px;
    box-shadow: 0 40px 90px rgba(0, 0, 0, .5);
}

.websec-hero-visual img {
    display: block;
    width: 100%;
    height: auto;
}

/* Header PC: bỏ số thứ tự nhỏ trên các mục menu chính (giống bố cục ZHost) */
@media (min-width: 1200px) {
    body header.obegames-unified-header #mainmenu > li::before {
        content: none !important;
        display: none !important;
    }
}

/* Trang Bảo mật Website: khối so le ảnh trái/phải (kiểu Vietnix) */
.websec-zz {
    display: grid;
    gap: 80px;
    margin-top: 20px;
}

.websec-zz-row {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
    gap: 64px;
    align-items: center;
}

.websec-zz-row.is-reverse .websec-zz-media {
    order: 2;
}

.websec-zz-media {
    overflow: hidden;
    border-radius: 22px;
    box-shadow: 0 30px 70px rgba(0, 0, 0, .45);
}

.websec-zz-media img {
    display: block;
    width: 100%;
    height: auto;
}

.websec-zz-label {
    display: inline-block;
    margin-bottom: 12px;
    color: var(--obe-accent);
    font-size: 12.5px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.websec-zz-copy h3 {
    margin: 0 0 12px;
    color: #fff;
    font-size: clamp(24px, 2.4vw, 32px);
    font-weight: 800;
    line-height: 1.25;
}

.websec-zz-copy p {
    margin: 0 0 20px;
    color: var(--obe-muted);
    font-size: 16px;
    line-height: 1.7;
}

.websec-zz-copy ul {
    display: grid;
    gap: 12px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.websec-zz-copy li {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    color: #dbe3f7;
    font-size: 15px;
    line-height: 1.55;
}

.websec-zz-copy li i {
    margin-top: 3px;
    color: #2fd38a;
    font-size: 16px;
}

@media (max-width: 991px) {
    .websec-zz {
        gap: 56px;
    }

    .websec-zz-row {
        grid-template-columns: 1fr;
        gap: 28px;
    }

    .websec-zz-row.is-reverse .websec-zz-media {
        order: 0;
    }
}

/* =========================================================
   BỐ CỤC SO LE ẢNH TRÁI/PHẢI (VPS, Máy chủ vật lý, DDoS)
   ========================================================= */
.obe-zz {
    display: grid;
    gap: 80px;
    margin-top: 28px;
}

.obe-zz-row {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
    gap: 64px;
    align-items: center;
}

.obe-zz-row.is-reverse .obe-zz-media {
    order: 2;
}

.obe-zz-media {
    overflow: hidden;
    border-radius: 22px;
    box-shadow: 0 30px 70px rgba(0, 0, 0, .45);
}

.obe-zz-media img {
    display: block;
    width: 100%;
    height: auto;
}

.obe-zz-label {
    display: inline-block;
    margin-bottom: 18px;
    color: var(--obe-accent);
    font-size: 12.5px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.obe-zz-item {
    display: flex;
    gap: 14px;
    align-items: flex-start;
}

.obe-zz-item + .obe-zz-item {
    margin-top: 26px;
}

.obe-zz-item > i {
    margin-top: 5px;
    color: #2fd38a;
    font-size: 18px;
}

.obe-zz-item h3 {
    margin: 0 0 8px;
    color: #fff;
    font-size: clamp(20px, 1.9vw, 24px);
    font-weight: 800;
    line-height: 1.3;
}

.obe-zz-item p {
    margin: 0;
    color: var(--obe-muted);
    font-size: 15.5px;
    line-height: 1.7;
}

@media (max-width: 991px) {
    .obe-zz {
        gap: 56px;
    }

    .obe-zz-row {
        grid-template-columns: 1fr;
        gap: 28px;
    }

    .obe-zz-row.is-reverse .obe-zz-media {
        order: 0;
    }
}

/* =========================================================
   BẢNG GIÁ VPS: hiện đầy đủ các gói dạng lưới (PC 3 gói / hàng, tablet 2 gói / hàng)
   Mobile (< 768px) giữ nguyên kiểu vuốt ngang như cũ
   ========================================================= */
@media (min-width: 768px) {
    .vps-plans-slider-shell {
        width: 100% !important;
        max-width: 1180px;
        padding: 0 !important;
    }

    .vps-plans-slider-shell::before,
    .vps-plans-slider-shell::after,
    .vps-plans-slider-shell .vps-slider-nav {
        display: none !important;
    }

    .vps-plans-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 24px !important;
        overflow: visible !important;
        padding: 8px 0 !important;
        scroll-snap-type: none !important;
        cursor: default !important;
    }

    .vps-plans-grid .vps-plan-card {
        flex: none !important;
        width: 100% !important;
        max-width: none !important;
    }

    .vps-plans-grid .vps-plan-card,
    .vps-plans-grid .vps-plan-card * {
        user-select: text !important;
    }
}

@media (min-width: 1100px) {
    .vps-plans-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

/* Máy chủ vật lý: ảnh minh hoạ thay cho bảng thông số chữ */
.dedicated-overview-visual {
    width: 100%;
    max-width: 580px;
    margin-left: auto;
    overflow: hidden;
    border-radius: 24px;
    box-shadow: 0 40px 90px rgba(0, 0, 0, .5);
}

.dedicated-overview-visual img {
    display: block;
    width: 100%;
    height: auto;
}

/* Footer: ô tìm kiếm bài viết */
body .obegames-footer-v48 .blog-footer-search,
body .obegames-detail-footer .blog-footer-search {
    position: relative !important;
    display: flex !important;
    align-items: center;
    width: 100%;
    max-width: 320px;
    height: 50px !important;
    padding: 5px !important;
    border: 1px solid rgba(121, 216, 255, .18) !important;
    border-radius: 14px !important;
    background: rgba(255, 255, 255, .04) !important;
    box-shadow: none !important;
    transition: border-color .2s ease, background .2s ease, box-shadow .2s ease;
}

body .obegames-footer-v48 .blog-footer-search:focus-within,
body .obegames-detail-footer .blog-footer-search:focus-within {
    border-color: rgba(0, 200, 255, .55) !important;
    background: rgba(255, 255, 255, .06) !important;
    box-shadow: 0 0 0 4px rgba(0, 160, 255, .12) !important;
}

body .blog-footer-search .obe-footer-search-icon {
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    color: rgba(255, 255, 255, .45);
    font-size: 14px;
    pointer-events: none;
}

body .obegames-footer-v48 .blog-footer-search .form-control,
body .obegames-detail-footer .blog-footer-search input {
    flex: 1 1 auto;
    min-width: 0;
    height: 38px !important;
    margin: 0 !important;
    padding: 0 10px 0 34px !important;
    border: 0 !important;
    border-radius: 10px !important;
    outline: none !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #fff !important;
    font-size: 14px !important;
}

body .blog-footer-search .form-control::placeholder,
body .blog-footer-search input::placeholder {
    color: rgba(255, 255, 255, .45) !important;
}

body .obegames-footer-v48 .blog-footer-search button,
body .obegames-detail-footer .blog-footer-search button {
    position: static !important;
    flex: none;
    width: auto !important;
    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;
    line-height: 38px !important;
    padding: 0 18px !important;
    border: 0 !important;
    border-radius: 10px !important;
    background: linear-gradient(135deg, #1f5bff 0%, #00c8ff 100%) !important;
    color: #fff !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    cursor: pointer;
}

body .obegames-footer-v48 .blog-footer-search button:hover,
body .obegames-detail-footer .blog-footer-search button:hover {
    filter: brightness(1.1);
}

/* Dải địa điểm: thanh gạch nằm giữa theo chiều cao chữ */
.de-marquee-list.s2 .d-item-txt {
    line-height: 64px !important;
    vertical-align: middle;
}

.de-marquee-list.s2 .d-item-txt img {
    margin-top: 0 !important;
    vertical-align: middle;
}

.de-marquee-list.s2 .d-item {
    line-height: 64px !important;
}

.de-marquee-list.s2 .d-item-display {
    display: inline-flex !important;
    align-items: center;
    height: 64px;
    line-height: 64px !important;
    vertical-align: middle;
}

.de-marquee-list.s2 .d-item-block {
    transform: none !important;
    vertical-align: middle;
    height: 4px !important;
}

/* =========================================================
   Trang chủ – "Tin tức, kiến thức và ưu đãi": bỏ khung viền từng bài,
   ngăn các cột bằng thanh dọc mảnh
   ========================================================= */
.latest-update-grid {
    column-gap: 60px !important;
    row-gap: 44px !important;
}

.latest-update-card {
    position: relative;
    height: auto;
    padding: 0;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible;
}

.latest-update-card:hover {
    transform: none !important;
    box-shadow: none !important;
}

.latest-update-image {
    border: 1px solid rgba(121, 143, 255, .14);
    border-radius: 14px;
}

.latest-update-body {
    padding: 20px 0 0 !important;
}

.latest-update-card:hover .latest-update-title a {
    color: #7fb2ff;
}

/* Thanh dọc nằm giữa khoảng cách 2 cột */
.latest-update-card::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: -30px;
    width: 1px;
    background: linear-gradient(180deg, rgba(121, 143, 255, 0), rgba(121, 143, 255, .28) 15%, rgba(121, 143, 255, .28) 85%, rgba(121, 143, 255, 0));
    pointer-events: none;
    display: none;
}

@media (min-width: 992px) {
    .latest-update-card:not(:nth-child(3n + 1))::after { display: block; }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .latest-update-grid { column-gap: 48px !important; }
    .latest-update-card::after { left: -24px; }
    .latest-update-card:nth-child(2n)::after { display: block; }
    .latest-update-card:last-child:nth-child(odd) { max-width: calc(50% - 24px) !important; }
}

@media (max-width: 767.98px) {
    .latest-update-grid { row-gap: 0 !important; }
    .latest-update-card + .latest-update-card {
        margin-top: 28px;
        padding-top: 28px;
        border-top: 1px solid rgba(121, 143, 255, .16) !important;
    }
}

/* MẪU B: bài dạng gọn – ảnh vuông nhỏ bên trái, chữ bên phải, ngăn cột bằng thanh dọc liền */
.latest-update-grid { column-gap: 56px !important; row-gap: 36px !important; align-items: stretch !important; }
.latest-update-card {
    display: grid !important;
    grid-template-columns: 92px minmax(0, 1fr);
    column-gap: 18px;
    align-items: start;
}
.latest-update-image {
    aspect-ratio: 1 / 1 !important;
    border: 0 !important;
    border-radius: 16px !important;
    background: radial-gradient(circle at 50% 40%, rgba(43,184,255,.18), transparent 60%), #111a33 !important;
}
.latest-update-image .latest-update-brand-img { width: 46px !important; height: 46px !important; }
.latest-update-badge { display: none !important; }
.latest-update-body { padding: 0 !important; }
.latest-update-meta { margin-bottom: 6px !important; font-size: 12.5px !important; }
.latest-update-meta::after {
    content: attr(data-type);
}
.latest-update-title { font-size: 17px !important; line-height: 1.45 !important; margin-bottom: 8px !important; }
.latest-update-excerpt {
    display: -webkit-box !important; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
    font-size: 14px !important; margin-bottom: 10px !important;
}
.latest-update-card::after {
    left: -28px !important;
    background: rgba(121, 143, 255, .22) !important;
}
.latest-update-card::before {
    content: ""; position: absolute; left: 0; top: -14px; width: 0; height: 2px;
    background: linear-gradient(90deg, #6a5cff, #27b7ff); transition: width .3s ease;
}
.latest-update-card:hover::before { width: 64px; }
@media (max-width: 767.98px) {
    .latest-update-card { grid-template-columns: 76px minmax(0, 1fr); }
}
@media (max-width: 767.98px) {
    .latest-update-card + .latest-update-card { margin-top: 20px !important; padding-top: 20px !important; }
    .latest-update-body { min-height: 0 !important; }
    .latest-update-grid { row-gap: 0 !important; }
}
/* Mẫu B – nhãn giảm giá trong ô ảnh nhỏ (tab Khuyến mãi) */
.latest-update-discount {
    right: 50% !important;
    bottom: 8px !important;
    transform: translateX(50%);
    padding: 3px 8px !important;
    border-radius: 6px !important;
    font-size: 11px !important;
    white-space: nowrap;
}
.latest-update-image img:not(.latest-update-brand-img) {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
/* Tab Khuyến mãi: % giảm hiển thị dạng nhãn nhỏ trên dòng ngày */
.latest-update-discount-tag {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 6px;
    background: linear-gradient(135deg, #6b38ff, #238de9);
    color: #fff;
    font-size: 11.5px;
    font-weight: 800;
    line-height: 1.5;
}

/* =========================================================
   Trang chủ – Dịch vụ & "Tại sao nên chọn ObeGames": bỏ khung ảnh, ngăn cột bằng thanh dọc
   ========================================================= */
.home-services-grid { column-gap: 60px !important; row-gap: 48px !important; }
.home-service-card { position: relative; }
.home-service-graphic {
    border: 0 !important;
    border-radius: 0 !important;
    background: radial-gradient(55% 60% at 50% 70%, rgba(124, 92, 255, .22), transparent 72%) !important;
}
.home-service-card h3, .home-service-card p, .home-service-card .home-service-link { padding: 0 !important; }
.home-service-card::before,
.why-obegames-feature::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 1px;
    background: linear-gradient(180deg, rgba(121, 143, 255, 0), rgba(121, 143, 255, .28) 15%, rgba(121, 143, 255, .28) 85%, rgba(121, 143, 255, 0));
    pointer-events: none;
    display: none;
}
.home-service-card::before { left: -30px; }
.why-obegames-feature { position: relative; height: 100%; padding: 8px 14px 8px 18px !important; }
.why-obegames-feature::before { left: -12px; }
@media (min-width: 1200px) {
    .home-service-card:not(:nth-child(3n + 1))::before { display: block; }
}
@media (min-width: 768px) and (max-width: 1199.98px) {
    .home-services-grid { column-gap: 48px !important; }
    .home-service-card::before { left: -24px; }
    .home-service-card:nth-child(2n)::before { display: block; }
}
@media (min-width: 992px) {
    .col-lg-3 + .col-lg-3 > .why-obegames-feature::before { display: block; }
}
@media (min-width: 768px) and (max-width: 991.98px) {
    .col-lg-3:nth-child(odd) > .why-obegames-feature::before { display: block; }
}

/* =========================================================
   Trang VPS – "Một nền tảng VPS cho nhiều nhu cầu":
   danh sách bên trái, ảnh lớn bên phải (rê/bấm để đổi). Điện thoại: danh sách kèm ảnh.
   ========================================================= */
.vps-usecase-stage { display: none; }

@media (min-width: 992px) {
    .vps-usecase-grid.is-tabs {
        display: grid !important;
        grid-template-columns: minmax(0, .9fr) minmax(0, 1.25fr) !important;
        gap: 0 56px !important;
        align-items: center;
    }
    .vps-usecase-grid.is-tabs article {
        grid-column: 1;
        display: block !important;
        padding: 20px 22px 20px 26px !important;
        border: 0 !important;
        border-left: 2px solid rgba(121, 143, 255, .18) !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        cursor: pointer;
        outline: none;
        transition: background .25s ease, border-color .25s ease;
    }
    .vps-usecase-grid.is-tabs article + article { margin-top: 6px; }
    .vps-usecase-grid.is-tabs article .obe-card-media { display: none !important; }
    .vps-usecase-grid.is-tabs article > div:last-child { padding: 0 !important; }
    .vps-usecase-grid.is-tabs article h3 { margin: 4px 0 0 !important; color: #aab6cc !important; font-size: 19px !important; transition: color .25s ease; }
    .vps-usecase-grid.is-tabs article p { display: none; margin-top: 6px !important; font-size: 14px !important; }
    .vps-usecase-grid.is-tabs article:hover h3,
    .vps-usecase-grid.is-tabs article:focus-visible h3 { color: #fff !important; }
    .vps-usecase-grid.is-tabs article.is-active {
        border-left-color: #6a7bff !important;
        background: linear-gradient(90deg, rgba(106, 123, 255, .12), transparent 85%) !important;
    }
    .vps-usecase-grid.is-tabs article.is-active h3 { color: #fff !important; }
    .vps-usecase-grid.is-tabs article.is-active p { display: block; }
    .vps-usecase-grid.is-tabs .vps-usecase-stage {
        display: block;
        grid-column: 2;
        grid-row: 1 / span 4;
        overflow: hidden;
        aspect-ratio: 16 / 10;
        border-radius: 18px;
    }
    .vps-usecase-stage img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
        animation: obeUsecaseFade .35s ease;
    }
}

@keyframes obeUsecaseFade { from { opacity: .35; } to { opacity: 1; } }

/* =========================================================
   Trang Bảo vệ DDoS – "Kiểm soát tấn công từ lớp mạng đến ứng dụng":
   các lớp xếp chồng thành hàng ngang, ngăn bằng đường kẻ mảnh
   ========================================================= */
.shield-layer-grid {
    display: flex !important;
    flex-direction: column;
    gap: 0 !important;
    max-width: 1120px;
    margin: 0 auto;
    border-top: 1px solid rgba(121, 143, 255, .18);
}

.shield-layer-card {
    position: relative;
    display: grid !important;
    grid-template-columns: 110px minmax(0, 1.05fr) minmax(0, 1fr);
    grid-template-areas: "code head list" "code desc list";
    column-gap: 40px;
    row-gap: 6px;
    align-items: start;
    padding: 30px 8px !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(121, 143, 255, .18) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    transition: background .25s ease;
}

.shield-layer-card:hover {
    background: linear-gradient(90deg, rgba(106, 123, 255, .08), transparent 70%) !important;
}

.shield-layer-card .shield-layer-code {
    grid-area: code;
    position: static !important;
    font-size: 46px !important;
    font-weight: 900;
    line-height: 1;
    background: linear-gradient(135deg, #7c6bff, #27b7ff);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent !important;
    opacity: 1 !important;
}

.shield-layer-card .shield-layer-icon { display: none !important; }

.shield-layer-card h3 { grid-area: head; margin: 0 !important; font-size: 21px !important; }
.shield-layer-card > p { grid-area: desc; margin: 0 !important; }

.shield-layer-card ul {
    grid-area: list;
    margin: 0 !important;
    padding-left: 22px !important;
    border-left: 1px solid rgba(121, 143, 255, .18);
}

.shield-layer-card .shield-layer-tag {
    position: absolute !important;
    top: 32px !important;
    right: 8px !important;
    left: auto !important;
    z-index: 2;
    width: auto !important;
    padding: 3px 10px !important;
    border-radius: 999px !important;
    font-size: 11.5px !important;
    white-space: nowrap;
    transform: none !important;
}

@media (max-width: 991.98px) {
    .shield-layer-card {
        grid-template-columns: 64px minmax(0, 1fr);
        grid-template-areas: "code head" "code desc" "code list";
        column-gap: 18px;
        row-gap: 10px;
        padding: 24px 4px !important;
    }
    .shield-layer-card .shield-layer-code { font-size: 32px !important; }
    .shield-layer-card h3 { font-size: 18px !important; }
    .shield-layer-card ul { padding-left: 0 !important; border-left: 0; }
    .shield-layer-card .shield-layer-tag { position: static !important; grid-column: 2; justify-self: start; order: -1; }
}

/* =========================================================
   Trang Máy chủ vật lý – "Một máy chủ, nhiều mô hình triển khai": giống trang VPS
   ========================================================= */
@media (min-width:992px){
.dedicated-usecase-grid.is-tabs{display:grid!important;grid-template-columns:minmax(0,.9fr) minmax(0,1.25fr)!important;gap:0 56px!important;align-items:center}
.dedicated-usecase-grid.is-tabs article{grid-column:1;display:block!important;padding:20px 22px 20px 26px!important;border:0!important;border-left:2px solid rgba(121,143,255,.18)!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;cursor:pointer}
.dedicated-usecase-grid.is-tabs article+article{margin-top:6px}
.dedicated-usecase-grid.is-tabs article .obe-card-media{display:none!important}
.dedicated-usecase-grid.is-tabs article h3{margin:0!important;color:#aab6cc!important;font-size:19px!important}
.dedicated-usecase-grid.is-tabs article p{display:none;margin-top:6px!important;font-size:14px!important}
.dedicated-usecase-grid.is-tabs article.is-active{border-left-color:#6a7bff!important;background:linear-gradient(90deg,rgba(106,123,255,.12),transparent 85%)!important}
.dedicated-usecase-grid.is-tabs article.is-active h3{color:#fff!important}
.dedicated-usecase-grid.is-tabs article.is-active p{display:block}
.dedicated-usecase-grid.is-tabs .vps-usecase-stage{display:block;grid-column:2;grid-row:1/span 4;border-radius:18px;overflow:hidden;aspect-ratio:16/10}
.dedicated-usecase-grid.is-tabs .vps-usecase-stage img{width:100%;height:100%;object-fit:cover;display:block}
}

/* =========================================================
   Trang Bảo vệ DDoS – "Bảo vệ chuyên biệt cho Website và Game Server" & "Phòng thủ hiệu quả…"
   ========================================================= */
@media (min-width: 992px) {
.shield-usecase-grid{display:grid!important;grid-template-columns:1fr 1fr!important;gap:0 96px!important;position:relative;max-width:1120px;margin:0 auto}
.shield-usecase-grid::before{content:"";position:absolute;top:0;bottom:0;left:50%;width:1px;background:linear-gradient(180deg,rgba(121,143,255,0),rgba(121,143,255,.3) 15%,rgba(121,143,255,.3) 85%,rgba(121,143,255,0))}
.shield-usecase-card{display:grid!important;grid-template-columns:96px 1fr;column-gap:24px;align-items:start;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;overflow:visible!important}
.shield-usecase-visual{min-height:0!important;height:auto!important;padding:0!important;background:transparent!important;border:0!important;display:flex!important;flex-direction:column;align-items:center;gap:10px}
.shield-usecase-visual::before,.shield-usecase-visual::after{display:none!important}
.shield-usecase-visual img{width:96px!important;height:96px!important}
.shield-usecase-visual span{position:static!important;padding:3px 10px!important;border-radius:999px!important;font-size:11px!important;white-space:nowrap}
.shield-usecase-card>div:last-child{padding:0!important}
.shield-usecase-card h3{margin-top:6px!important;font-size:22px!important}
.shield-usecase-card::before,.shield-usecase-card::after{display:none!important}
.shield-usecase-visual{box-shadow:none!important;background:none!important}
.shield-usecase-visual img{background:none!important;box-shadow:none!important;filter:drop-shadow(0 10px 22px rgba(39,140,255,.35))}
.shield-assurance-card{display:grid!important;grid-template-columns:260px minmax(0,1fr)!important;gap:56px!important;align-items:center;padding:44px 0!important;border:0!important;border-top:1px solid rgba(121,143,255,.18)!important;border-bottom:1px solid rgba(121,143,255,.18)!important;border-radius:0!important;background:radial-gradient(40% 80% at 12% 50%,rgba(39,120,255,.14),transparent 70%)!important;box-shadow:none!important}
.shield-assurance-visual{order:-1}
.shield-assurance-checks{display:grid!important;grid-template-columns:repeat(3,1fr);gap:0 36px!important;margin-top:24px!important}
.shield-assurance-checks span{position:relative;display:flex!important;align-items:flex-start;gap:10px;font-size:14.5px!important}
.shield-assurance-checks span+span::before{content:"";position:absolute;left:-18px;top:2px;bottom:2px;width:1px;background:rgba(121,143,255,.25)}
}
@media (max-width: 991.98px) {
.shield-usecase-card::before,.shield-usecase-card::after{display:none!important}
.shield-assurance-checks span{font-size:14.5px!important}
}

/* =========================================================
   Câu hỏi thường gặp (DDoS, VPS, Máy chủ vật lý): đánh số, chỉ dùng đường kẻ
   ========================================================= */
.vps-faq-section .vps-section-heading h2{text-transform:none!important}
.vps-faq-list,.dedicated-faq-grid,.shield-faq-list{display:block!important;counter-reset:faq;border-top:1px solid rgba(121,143,255,.18)}
.vps-faq-list details,.dedicated-faq-grid details,.shield-faq-list details{counter-increment:faq;margin:0!important;padding:0!important;border:0!important;border-bottom:1px solid rgba(121,143,255,.18)!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
.vps-faq-list summary,.dedicated-faq-grid summary,.shield-faq-list summary{display:flex!important;align-items:center;gap:18px;padding:22px 4px!important;font-size:16.5px!important}
.vps-faq-list summary::before,.dedicated-faq-grid summary::before,.shield-faq-list summary::before{content:counter(faq,decimal-leading-zero);flex:0 0 34px;color:#6f7cff;font-weight:800;font-size:15px}
.vps-faq-list summary>span,.dedicated-faq-grid summary{flex:1}
.vps-faq-list details[open] summary,.dedicated-faq-grid details[open] summary,.shield-faq-list details[open] summary{color:#fff}
.vps-faq-answer,.dedicated-faq-grid details>p,.shield-faq-list details>div{padding:0 4px 22px 56px!important;margin:0!important}
.vps-faq-list summary,.dedicated-faq-grid summary,.shield-faq-list summary{justify-content:flex-start!important;text-align:left!important}
.dedicated-faq-grid summary i,.shield-faq-list summary>span,.vps-faq-list summary>i{margin-left:auto!important;flex:0 0 auto}
.dedicated-faq-grid{max-width:none!important;width:100%;grid-template-columns:1fr!important}
.shield-faq-list details::before,.shield-faq-list details::after,.dedicated-faq-grid details::before,.dedicated-faq-grid details::after{display:none!important}
.shield-faq-list summary{flex-direction:row!important}
@media (min-width: 992px) {
.vps-faq-section .container,.dedicated-faq .container{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.3fr);gap:0 64px;align-items:start}
.vps-faq-section .vps-section-heading,.dedicated-faq .dedicated-section-heading{text-align:left!important;margin:0!important;position:sticky;top:120px}
.vps-faq-section .vps-section-heading>*,.dedicated-faq .dedicated-section-heading>*{text-align:left!important;margin-left:0!important}
}

/* =========================================================
   Trang chủ – hero: hàng số liệu dưới nút, ngăn bằng thanh dọc
   ========================================================= */
.hero-stats {
    display: flex;
    margin-top: 36px;
    padding-top: 28px;
    border-top: 1px solid rgba(121, 143, 255, .18);
}
.hero-stat {
    flex: 1 1 0;
    min-width: 0;
    padding: 0 26px;
    border-left: 1px solid rgba(121, 143, 255, .22);
}
.hero-stat:first-child { padding-left: 0; border-left: 0; }
.hero-stat strong {
    display: block;
    font-size: 34px;
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -.02em;
    background: linear-gradient(135deg, #fff, #9fb6ff);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}
.hero-stat span {
    display: block;
    margin-top: 6px;
    color: #98a6ba;
    font-size: 14px;
    font-weight: 500;
}
@media (max-width: 575.98px) {
    .hero-stats { margin-top: 26px; padding-top: 22px; }
    .hero-stat { padding: 0 12px; }
    .hero-stat strong { font-size: 24px; }
    .hero-stat span { font-size: 12.5px; }
}

/* Footer – thông tin liên hệ hỗ trợ thay cho đoạn giới thiệu */
.footer-contact-list { margin: 18px 0 22px; padding: 0; list-style: none; }
.footer-contact-list li { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 14px; }
.footer-contact-list i {
    flex: 0 0 36px; width: 36px; height: 36px; display: grid; place-items: center;
    border-radius: 10px; background: rgba(106, 123, 255, .14); color: #8fa8ff; font-size: 14px;
}
.footer-contact-list small { display: block; margin-bottom: 2px; color: #8b97ad; font-size: 12.5px; }
.footer-contact-list a { color: #e6ecf8 !important; font-weight: 600; text-decoration: none; }
.footer-contact-list a:hover { color: #7fb2ff !important; }

/* Footer – 2 chứng chỉ: nhãn nhỏ + huy hiệu xếp ngang, thanh dọc ngăn */
.footer-certificates { margin-top: 6px; padding-top: 16px; border-top: 1px solid rgba(121, 143, 255, .16); }
.footer-cert-label { display: block; margin-bottom: 12px; color: #8b97ad; font-size: 12.5px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }
.footer-certificates .cert-images { display: flex !important; align-items: center; gap: 0 !important; }
.footer-certificates .cert-images a { display: flex; align-items: center; height: 30px; padding: 0 16px; background: none !important; border: 0 !important; box-shadow: none !important; }
.footer-certificates .cert-images a:first-child { padding-left: 0; }
.footer-certificates .cert-images a + a { border-left: 1px solid rgba(121, 143, 255, .25) !important; }
.footer-certificates .cert-images img { height: 28px !important; width: auto !important; border-radius: 4px; background: #fff; padding: 2px 4px; }


/* ===== Trang Tin tức - Kiến thức & Tài liệu: hero gọn + thanh công cụ (mẫu C), 20 bài/trang ===== */
.news-hero, .blog-hero { padding-bottom: 0 !important; }
.news-hero h1, .blog-hero h1 { font-size: clamp(30px, 4vw, 40px) !important; line-height: 1.2 !important; margin-bottom: 8px !important; max-width: none !important; }
.news-hero p, .blog-hero p { font-size: 16px !important; margin-bottom: 0 !important; }
.obe-hero-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 28px; padding: 14px 0; border-top: 1px solid rgba(121, 143, 255, .16); border-bottom: 1px solid rgba(121, 143, 255, .16); }
.obe-hero-toolbar .news-filter-tabs { margin: 0 !important; display: flex !important; gap: 10px; }
.obe-hero-toolbar .news-filter-tabs a { border-radius: 999px; padding: 7px 18px; }
.obe-hero-toolbar-note { color: #8b97ad; font-size: 14px; font-weight: 600; }
.obe-hero-toolbar .blog-search { margin: 0 !important; width: 420px; max-width: 100%; padding: 5px; }
.obe-hero-toolbar .blog-search input { height: 40px; padding: 8px 14px; }
.obe-hero-toolbar .blog-search button { height: 40px; padding: 0 16px; }
.news-hero + .blog-section, .blog-hero + .blog-section { padding-top: 40px !important; }

/* 6 bài đầu 2 cột cạnh sidebar, phần còn lại 3 cột toàn chiều ngang */
.blog-layout.obe-layout-split > .obe-grid-wide,
.blog-layout.obe-layout-split > .obe-public-pagination { grid-column: 1 / -1; min-width: 0; }
.blog-layout > .obe-grid-wide { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 991.98px) {
    .blog-layout.obe-layout-split > .obe-content-column { order: 1; }
    .blog-layout.obe-layout-split > .obe-grid-wide { order: 2; margin-top: 25px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .blog-layout.obe-layout-split > .obe-public-pagination { order: 3; }
    .blog-layout.obe-layout-split > .blog-sidebar { order: 4; margin-top: 34px !important; }
}
@media (max-width: 767.98px) {
    .obe-hero-toolbar { flex-direction: column; align-items: stretch; gap: 14px; }
    .obe-hero-toolbar .blog-search { width: 100%; }
}
@media (max-width: 700px) {
    .blog-layout.obe-layout-split > .obe-grid-wide { grid-template-columns: 1fr; }
}

/* =========================================================
   Trang chủ – chuyển sang dịch vụ bảo mật (19/10/2026)
   ========================================================= */
.home-hero-section h1.home-sec-title { font-size: clamp(34px, 4.4vw, 54px); line-height: 1.12; margin: 0 0 18px; }
.home-sec-title span { background: linear-gradient(135deg, #b6a8ff, #5bd2ff); -webkit-background-clip: text; background-clip: text; color: transparent; }
.home-sec-cta { display: flex; flex-wrap: wrap; gap: 12px; }
.home-sec-cta .btn-main.btn-line { background: transparent !important; border: 1px solid rgba(124, 92, 255, .8) !important; color: #fff !important; }
.home-sec-cta .btn-main.btn-line:hover { background: rgba(124, 92, 255, .16) !important; }

.home-sec-symptoms { padding: 0 !important; border-top: 1px solid var(--obe-line, rgba(121,143,255,.16)); border-bottom: 1px solid var(--obe-line, rgba(121,143,255,.16)); background: #0a0f1d; }
.home-sec-symptoms .container { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 26px; padding-top: 18px; padding-bottom: 18px; font-size: 14px; color: #c9d2e6; }
.home-sec-symptoms strong { color: #ff8a9c; }
.home-sec-symptoms span { display: inline-flex; align-items: center; gap: 8px; }
.home-sec-symptoms span::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #ff5d7a; flex: none; }
.home-services-lead { color: var(--obe-muted, #9aa6bf); margin: 10px 0 0; text-align: center; }

.home-sec-steps { padding: 20px 0 40px !important; }
.home-sec-steps-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 40px; }
.home-sec-steps-grid article { position: relative; padding: 0 28px; }
.home-sec-steps-grid article:first-child { padding-left: 0; }
.home-sec-steps-grid article + article { border-left: 1px solid rgba(121, 143, 255, .2); }
.home-sec-steps-grid b { display: block; font-size: 44px; font-weight: 900; line-height: 1; background: linear-gradient(135deg, #7c5cff, #29b8ff); -webkit-background-clip: text; background-clip: text; color: transparent; }
.home-sec-steps-grid h4 { font-size: 18px; margin: 14px 0 8px; }
.home-sec-steps-grid p { color: var(--obe-muted, #9aa6bf); font-size: 14.5px; line-height: 1.65; margin: 0; }

.home-sec-signs { padding: 90px 0 !important; background: #080d18; scroll-margin-top: 110px; }
.home-sec-signs-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; }
.home-sec-signs-list { list-style: none; padding: 0; margin: 20px 0 0; columns: 2; column-gap: 30px; }
.home-sec-signs-list li { break-inside: avoid; display: flex; gap: 10px; padding: 13px 0; border-bottom: 1px solid rgba(121, 143, 255, .16); color: #d5dcea; font-size: 15px; }
.home-sec-signs-list li::before { content: "!"; flex: none; width: 20px; height: 20px; border-radius: 50%; background: rgba(255, 93, 122, .18); color: #ff8a9c; font-weight: 900; font-size: 12px; display: grid; place-items: center; }
.home-sec-check-box { padding: 34px; border-radius: 14px; border: 1px solid rgba(124, 92, 255, .35); background: linear-gradient(135deg, rgba(124, 92, 255, .18), rgba(41, 184, 255, .08)); }
.home-sec-check-box h3 { font-size: 26px; margin: 0 0 10px; }
.home-sec-check-box p { color: #b7c2d6; line-height: 1.7; margin-bottom: 22px; }
.home-sec-why { padding-top: 90px !important; padding-bottom: 20px !important; }

.home-sec-band { padding: 70px 0 0 !important; }
.home-sec-band-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 40px 48px; border-radius: 16px; background: linear-gradient(135deg, #2a1f6b, #0f3a6b); }
.home-sec-band-inner h3 { font-size: 30px; margin: 0 0 8px; }
.home-sec-band-inner p { margin: 0; color: #c9d6f0; }
.home-sec-band-btn { flex: none; display: inline-flex; align-items: center; gap: 8px; padding: 14px 24px; border-radius: 8px; background: #fff; color: #2a1f6b !important; font-weight: 800; }
.home-sec-band-btn:hover { background: #e9e5ff; }

@media (max-width: 991.98px) {
    .home-sec-steps-grid { grid-template-columns: 1fr 1fr; row-gap: 34px; }
    .home-sec-steps-grid article:nth-child(3) { border-left: 0; padding-left: 0; }
    .home-sec-signs-grid { grid-template-columns: 1fr; gap: 36px; }
    .home-sec-band-inner { flex-direction: column; align-items: flex-start; padding: 32px 28px; }
}
@media (max-width: 575.98px) {
    .home-sec-steps-grid { grid-template-columns: 1fr; }
    .home-sec-steps-grid article { padding: 0 !important; border-left: 0 !important; }
    .home-sec-signs-list { columns: 1; }
    .home-sec-symptoms .container { gap: 8px 18px; font-size: 13px; }
    .home-sec-band-inner h3 { font-size: 24px; }
}

/* =========================================================
   Thư viện Plugins (/plugins, /plugins/ten-plugin) – 21/10/2026
   ========================================================= */
.plg-page { padding-bottom: 80px; }
.plg-hero { padding: 150px 0 0; }
.plg-hero h1 { font-size: clamp(32px, 4vw, 42px); margin: 0 0 8px; }
.plg-hero p { color: var(--obe-muted, #9aa6bf); margin: 0; max-width: 760px; }
.plg-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 26px; padding: 14px 0; border-top: 1px solid rgba(121, 143, 255, .16); border-bottom: 1px solid rgba(121, 143, 255, .16); }
.plg-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.plg-chips a { padding: 7px 16px; border-radius: 999px; border: 1px solid rgba(121, 143, 255, .2); background: #0b1122; color: #c9d2e6; font-size: 14px; }
.plg-chips a.active, .plg-chips a:hover { background: linear-gradient(135deg, #7c5cff, #29b8ff); border-color: transparent; color: #fff; }
.plg-search { display: flex; gap: 8px; flex: none; }
.plg-search input, .plg-search select { height: 42px; padding: 0 12px; border-radius: 8px; border: 1px solid rgba(121, 143, 255, .2); background: #0b1122; color: #fff; font-size: 14px; }
.plg-search input { width: 220px; }
.plg-search button { width: 42px; border: 0; border-radius: 8px; background: linear-gradient(135deg, #7c5cff, #29b8ff); color: #fff; }
.plg-list-section { padding-top: 30px; }
.plg-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.plg-card { display: flex; flex-direction: column; gap: 12px; padding: 26px 28px; border-bottom: 1px solid rgba(121, 143, 255, .16); }
.plg-card:not(:nth-child(3n + 1)) { border-left: 1px solid rgba(121, 143, 255, .16); }
.plg-card:nth-child(3n + 1) { padding-left: 0; }
.plg-card-top { display: flex; align-items: center; gap: 14px; color: #fff; }
.plg-card-top strong { display: block; font-size: 18px; }
.plg-card-top small { color: var(--obe-muted, #9aa6bf); font-size: 13px; }
.plg-card p { flex: 1; margin: 0; color: var(--obe-muted, #9aa6bf); font-size: 14px; line-height: 1.6; }
.plg-icon { flex: none; width: 56px; height: 56px; border-radius: 12px; overflow: hidden; display: grid; place-items: center; background: #121a30; border: 1px solid rgba(121, 143, 255, .2); }
.plg-icon img { width: 100%; height: 100%; object-fit: cover; }
.plg-icon.is-letter { background: color-mix(in srgb, var(--plg) 16%, #0d1226); border-color: color-mix(in srgb, var(--plg) 40%, transparent); color: var(--plg); font-weight: 900; font-size: 22px; }
.plg-icon-lg { width: 96px; height: 96px; border-radius: 20px; font-size: 38px !important; }
.plg-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.plg-tags span { padding: 3px 8px; border-radius: 6px; background: rgba(124, 92, 255, .14); color: #b8abff; font-size: 12px; font-weight: 700; }
.plg-tags span.is-green { background: rgba(46, 230, 166, .12); color: #5ee6b4; }
.plg-card-foot { display: flex; align-items: center; justify-content: space-between; color: var(--obe-muted, #9aa6bf); font-size: 13px; }
.plg-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 9px 16px; border-radius: 8px; background: linear-gradient(135deg, #7c5cff, #29b8ff); color: #fff !important; font-weight: 800; font-size: 13px; }
.plg-btn:hover { filter: brightness(1.1); }
.plg-btn-lg { display: flex; width: 100%; padding: 15px; font-size: 15px; margin-bottom: 14px; }
.plg-btn.is-disabled { background: #2a3150; color: #9aa6bf !important; }
.plg-pager { display: flex; justify-content: center; gap: 8px; margin-top: 34px; }
.plg-pager a { width: 40px; height: 40px; border-radius: 8px; border: 1px solid rgba(121, 143, 255, .2); display: grid; place-items: center; color: #fff; }
.plg-pager a.active { background: linear-gradient(135deg, #7c5cff, #29b8ff); border-color: transparent; }
.plg-custom-cta { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 50px; padding: 30px 36px; border-radius: 14px; border: 1px solid rgba(124, 92, 255, .35); background: linear-gradient(135deg, rgba(124, 92, 255, .18), rgba(41, 184, 255, .08)); }
.plg-custom-cta h3 { margin: 0 0 6px; font-size: 22px; }
.plg-custom-cta p { margin: 0; color: #b7c2d6; }
.plg-breadcrumb { padding-top: 150px; color: var(--obe-muted, #9aa6bf); font-size: 14px; }
.plg-breadcrumb a { color: #9aa6bf; }
.plg-breadcrumb span { color: #fff; }
.plg-detail { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 40px; padding-top: 30px; }
.plg-detail-head { display: flex; gap: 22px; align-items: flex-start; padding-bottom: 26px; border-bottom: 1px solid rgba(121, 143, 255, .16); }
.plg-detail-head h1 { font-size: clamp(28px, 3.4vw, 38px); margin: 0 0 8px; }
.plg-detail-head p { color: #b7c2d6; margin: 0 0 14px; line-height: 1.6; }
.plg-content { padding-top: 10px; }
.plg-sub-title { font-size: 22px; margin: 40px 0 14px; }
.plg-versions { border: 1px solid rgba(121, 143, 255, .16); border-radius: 12px; }
.plg-version { display: flex; justify-content: space-between; gap: 16px; padding: 14px 18px; }
.plg-version + .plg-version { border-top: 1px solid rgba(121, 143, 255, .16); }
.plg-version small { display: block; color: var(--obe-muted, #9aa6bf); }
.plg-version > a { color: #8fd6ff; font-weight: 700; flex: none; }
.plg-changelog { margin-top: 6px; color: #b7c2d6; font-size: 14px; }
.plg-side { display: flex; flex-direction: column; gap: 20px; }
.plg-side-card { padding: 24px; border-radius: 14px; border: 1px solid rgba(121, 143, 255, .16); background: #0b1122; }
.plg-side-card dl { margin: 0; }
.plg-side-card dl div { display: flex; justify-content: space-between; gap: 10px; padding: 10px 0; border-bottom: 1px solid rgba(121, 143, 255, .16); font-size: 14px; }
.plg-side-card dl div:last-child { border-bottom: 0; }
.plg-side-card dt { color: var(--obe-muted, #9aa6bf); font-weight: 400; }
.plg-side-card dd { margin: 0; font-weight: 700; text-align: right; }
.plg-side-cta { padding: 22px; border-radius: 14px; border: 1px solid rgba(124, 92, 255, .35); background: linear-gradient(135deg, rgba(124, 92, 255, .18), rgba(41, 184, 255, .08)); }
.plg-side-cta h3 { font-size: 18px; margin: 0 0 6px; }
.plg-side-cta p { color: #b7c2d6; font-size: 14px; }
@media (max-width: 991.98px) {
    .plg-toolbar { flex-direction: column; align-items: stretch; }
    .plg-search { flex-wrap: wrap; }
    .plg-search input { flex: 1; width: auto; }
    .plg-grid { grid-template-columns: 1fr 1fr; }
    .plg-card, .plg-card:nth-child(3n + 1) { padding: 22px 20px; border-left: 0; }
    .plg-card:nth-child(2n) { border-left: 1px solid rgba(121, 143, 255, .16); }
    .plg-card:nth-child(2n + 1) { padding-left: 0; }
    .plg-detail { grid-template-columns: 1fr; }
    .plg-hero, .plg-breadcrumb { padding-top: 130px; }
}
@media (max-width: 575.98px) {
    .plg-grid { grid-template-columns: 1fr; }
    .plg-card, .plg-card:nth-child(n) { padding: 20px 0; border-left: 0; }
    .plg-detail-head { flex-direction: column; }
    .plg-custom-cta { flex-direction: column; align-items: flex-start; }
}

/* =========================================================
   Trang chủ – dịch vụ phát triển game (21/10/2026)
   ========================================================= */
.home-game-platforms strong { color: #8fd6ff !important; font-size: 13px; letter-spacing: .12em; text-transform: uppercase; }
.home-game-platforms span { font-weight: 700; }
.home-game-platforms span::before { display: none !important; }
.home-game-platforms span i { width: 12px; height: 12px; border-radius: 3px; display: inline-block; }
.home-sec-signs-list.is-check li::before { content: "✓"; background: rgba(46, 230, 166, .16); color: #2ee6a6; }

.home-tech-section { padding: 80px 0 40px !important; }
.home-tech-orbit { position: relative; max-width: 1100px; height: 560px; margin: 40px auto 0; background: radial-gradient(40% 45% at 50% 50%, rgba(124, 92, 255, .18), transparent 70%); }
.home-tech-ring { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); border: 1px dashed rgba(121, 143, 255, .2); border-radius: 50%; pointer-events: none; }
.home-tech-ring.is-inner { width: 46%; height: 62%; }
.home-tech-ring.is-outer { width: 84%; height: 88%; }
.home-tech-item { position: absolute; transform: translate(-50%, -50%); display: flex; flex-direction: column; align-items: center; gap: 8px; animation: obeTechFloat 6s ease-in-out infinite; animation-delay: var(--d, 0s); }
.home-tech-item.is-center { left: 50%; top: 50%; animation: none; }
.home-tech-bubble { display: grid; place-items: center; border-radius: 50%; background: linear-gradient(160deg, #1a2244, #0d1226); border: 1.5px solid #343e72; box-shadow: 0 18px 40px rgba(0, 0, 0, .45), inset 0 1px 0 rgba(255, 255, 255, .06); overflow: hidden; }
.home-tech-bubble img { width: 62%; height: 62%; object-fit: contain; }
.home-tech-initials { font-weight: 900; color: #b8abff; }
.home-tech-item b { font-size: 13px; color: #aab4c8; font-weight: 600; white-space: nowrap; }
.home-tech-item.is-center .home-tech-bubble { width: 150px; height: 150px; border-color: #6f6bff; box-shadow: 0 0 60px rgba(124, 92, 255, .45), 0 18px 40px rgba(0, 0, 0, .45); }
.home-tech-item.is-center .home-tech-initials { font-size: 40px; }
.home-tech-item.is-center b { font-size: 16px; color: #fff; }
.home-tech-item.is-inner .home-tech-bubble { width: 96px; height: 96px; }
.home-tech-item.is-inner .home-tech-initials { font-size: 26px; }
.home-tech-item.is-outer .home-tech-bubble { width: 64px; height: 64px; }
.home-tech-item.is-outer .home-tech-initials { font-size: 17px; }
.home-tech-item.is-outer b { font-size: 12px; }
@keyframes obeTechFloat { 0%, 100% { margin-top: 0; } 50% { margin-top: -8px; } }
@media (prefers-reduced-motion: reduce) { .home-tech-item { animation: none; } }
@media (max-width: 767.98px) {
    .home-tech-orbit { height: auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px 10px; background: none; margin-top: 30px; }
    .home-tech-ring { display: none; }
    .home-tech-item, .home-tech-item.is-center { position: static; transform: none; animation: none; }
    .home-tech-item.is-center { grid-column: 1 / -1; }
    .home-tech-item.is-center .home-tech-bubble { width: 110px; height: 110px; }
    .home-tech-item.is-inner .home-tech-bubble, .home-tech-item.is-outer .home-tech-bubble { width: 64px; height: 64px; }
    .home-tech-item b { white-space: normal; text-align: center; }
}

/* Menu 6 mục dịch vụ game: không xuống dòng, thu gọn khoảng cách trên màn hình vừa */
body header.obegames-unified-header #mainmenu > li > a { white-space: nowrap; }
@media (min-width: 992px) and (max-width: 1439.98px) {
    body header.obegames-unified-header:not(.smaller) #mainmenu > li > a,
    body header.obegames-unified-header.smaller #mainmenu > li > a {
        font-size: 15px !important;
        padding-left: 9px !important;
        padding-right: 9px !important;
    }
}
.hero-stat strong { white-space: nowrap; }
/* Số liệu hero dạng chữ (Mã nguồn / Bảo hành / 24/7): chữ nhỏ hơn để không bị cắt */
.home-hero-section .hero-stat strong { font-size: 28px; padding-right: 2px; }
@media (max-width: 575.98px) { .home-hero-section .hero-stat strong { font-size: 20px; } }
/* Hero trang chủ: chữ không bị header (logo + menu) đè lên */
@media (min-width: 992px) {
    body.home-page .home-hero-section { padding-top: 135px !important; }
    body.home-page.no-active-header-promotion .home-hero-section { padding-top: 120px !important; }
}
/* Dòng "…và nhiều ngôn ngữ, nền tảng khác" dưới vòng logo công nghệ */
.home-tech-more { max-width: 900px; margin: 34px auto 0; text-align: center; }
.home-tech-more p { color: var(--obe-muted, #9aa6bf); margin: 0 0 16px; }
.home-tech-more p strong { color: #fff; }
.home-tech-more-list { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.home-tech-more-list span { padding: 7px 14px; border-radius: 999px; border: 1px solid rgba(121, 143, 255, .22); background: #0b1122; color: #c9d2e6; font-size: 13.5px; }

/* Mục công nghệ – mẫu 4: giới thiệu bên trái, nút nhóm + lưới logo bên phải (21/10/2026) */
.home-tech-layout { display: grid; grid-template-columns: 360px minmax(0, 1fr); gap: 56px; align-items: start; }
.home-tech-intro h2 { font-size: clamp(28px, 3vw, 36px); line-height: 1.22; margin: 0 0 14px; }
.home-tech-intro p { color: var(--obe-muted, #9aa6bf); line-height: 1.7; }
.home-tech-stat { margin: 22px 0 26px; }
.home-tech-stat b { display: block; font-size: 32px; font-weight: 900; background: linear-gradient(135deg, #b6a8ff, #5bd2ff); -webkit-background-clip: text; background-clip: text; color: transparent; }
.home-tech-stat span { color: var(--obe-muted, #9aa6bf); font-size: 13px; }
.home-tech-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 22px; }
.home-tech-tabs button { padding: 9px 16px; border-radius: 999px; border: 1px solid rgba(121, 143, 255, .22); background: #0b1122; color: #c9d2e6; font-size: 14px; font-weight: 700; cursor: pointer; }
.home-tech-tabs button em { font-style: normal; font-weight: 400; opacity: .6; margin-left: 4px; }
.home-tech-tabs button.active, .home-tech-tabs button:hover { background: linear-gradient(135deg, #7c5cff, #29b8ff); border-color: transparent; color: #fff; }
.home-tech-tabs button.active em { opacity: .85; }
.home-tech-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border-top: 1px solid rgba(121, 143, 255, .16); border-left: 1px solid rgba(121, 143, 255, .16); }
.home-tech-grid[hidden] { display: none; }
.home-tech-tile { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 24px 8px; border-right: 1px solid rgba(121, 143, 255, .16); border-bottom: 1px solid rgba(121, 143, 255, .16); transition: background .2s; }
.home-tech-tile:hover { background: rgba(124, 92, 255, .07); }
.home-tech-icon { width: 56px; height: 56px; border-radius: 12px; display: grid; place-items: center; overflow: hidden; background: #0f1530; border: 1px solid rgba(121, 143, 255, .2); }
.home-tech-icon img { width: 78%; height: 78%; object-fit: contain; }
.home-tech-icon .home-tech-initials { font-size: 16px; font-weight: 900; color: #b8abff; }
.home-tech-tile b { font-size: 14px; color: #d5dcea; font-weight: 600; text-align: center; }
.home-tech-note { margin: 16px 0 0; color: var(--obe-muted, #9aa6bf); font-size: 14px; }
@media (max-width: 1199.98px) { .home-tech-layout { grid-template-columns: 1fr; gap: 30px; } .home-tech-intro { max-width: 720px; } }
@media (max-width: 767.98px) {
    .home-tech-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .home-tech-tabs { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; }
    .home-tech-tabs button { flex: none; }
}
/* Lưới logo ngôn ngữ (bỏ nút lọc): logo đặt trên ô nền sáng cho rõ màu */
.home-tech-section.is-grid .home-tech-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.home-tech-icon.has-img { width: 64px; height: 64px; border-radius: 14px; background: #f4f6fc; border-color: transparent; }
.home-tech-icon.has-img img { width: 76%; height: 76%; }
.home-tech-tile.is-more b { color: #8fd6ff; }
@media (max-width: 767.98px) { .home-tech-section.is-grid .home-tech-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
/* Đánh giá khách hàng / Cam kết dịch vụ */
.home-testi-count { font-size: 16px; font-weight: 500; color: var(--obe-muted, #9aa6bf); margin-left: 8px; }
.home-testi-service { display: block; margin-top: 4px; font-size: 12.5px; color: #8fd6ff; }
.home-commit-icon { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: linear-gradient(135deg, #7c5cff, #29b8ff); color: #fff; font-size: 14px; }
.home-commit-icon i { color: #fff !important; }
.home-commit .de_testi_by span { color: #8fd6ff; }