/* @media (min-width: 1024px) and (max-width: 1440px) {
  .text-justify-desktop {
    text-align: justify;
  }
} */

@media (max-width: 767.98px) {
    .mt-up-up {
        margin-top: -100px;
    }

    /* .width-font-text {
        width: 380px;
    } */
    /* .width-font-img {
    width: 330px;
  } */

    .text-justify-mobile {
        text-align: justify;
    }

    /* .text-justify-mobile-pad {
      padding-left: 38px;
      padding-right: 38px;
    } */
}

@media (min-width: 768px) and (max-width: 1280px) {
    .mt-up-up-ipad {
        margin-top: -80px;
    }

    .custom-ipad-row {
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: flex-start;
        gap: 2rem;
    }

    .custom-ipad-row > div {
        width: 45%;
        max-width: 100%;
    }

    .ipad-fix-imgs {
        display: flex;
        flex-direction: column;
        gap: 1rem;
        height: auto;
        position: relative;
        margin-top: 100px;
    }

    .ipad-img {
        position: static !important;
        width: 50%;
        height: auto;
        display: block;
    }

    .mission-wrapper {
        position: relative;
        width: 100%;
        padding: 2rem 1rem;
        overflow: visible;
    }

    .mission-img {
        position: static;
        width: 90%;
        height: auto;
        display: block;
    }

    .mission-text {
        position: static;
        width: 90%;
        margin: 2rem auto 0;
    }

    .text-justify-macbook {
        text-align: justify;
    }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .img-tab-1,
    .img-tab-2 {
        position: static !important;
        width: 48%;
        height: auto;
        margin: 1%;
        border-radius: 12px;
        object-fit: cover;
        display: inline-block;
    }

    .position-relative {
        display: flex;
        /* justify-content: center; */
        /* align-items: center; */
        flex-wrap: wrap;
    }

    .position-relative > .d-none.d-md-block {
        padding-bottom: 0 !important;
    }
}

@media (min-width: 768px) and (max-width: 1280px) {
    .mission-img {
        position: static !important;
        width: 90%;
        height: auto;
        display: block;
        margin: 0 auto;
    }

    .mission-text {
        position: static;
        width: 90%;
        margin: 2rem auto 0;
    }
}

@media (min-width: 576px) and (max-width: 767.98px) {
    .col-md-3 {
        flex: 0 0 50%;
        max-width: 50%;
    }
}

@media (max-width: 991.98px) {
    .w-96.h-96 {
        width: clamp(70px, 18vw, 96px) !important;
        height: clamp(70px, 18vw, 96px) !important;
    }
    .gap-3 {
        gap: 1rem !important;
    }
}

@media (max-width: 575.98px) {
    h5.fw-bold {
        font-size: 1.05rem;
    }

    p.text-md {
        font-size: 0.86rem;
    }
}

@media (min-width: 576px) and (max-width: 991.98px) {
    h5.fw-bold {
        font-size: 1.15rem;
    }

    p.text-md {
        font-size: 0.92rem;
    }
}

@media (min-width: 768px) {
    .caption-one {
        font-size: 1.25rem;
    }
}

.responsive-gap {
    flex-wrap: nowrap;
    /* Ngăn logo xuống hàng sớm */
    overflow-x: auto;
    width: 100%;
    /* Nếu quá chật, cho phép scroll ngang nhẹ */
}

.logo-case {
    max-height: 80px;
    max-width: 180px;
    flex-shrink: 1;
    transition: all 0.3s ease-in-out;
}

@media (max-width: 992px) {
    .responsive-gap {
        gap: 30px;
    }

    .logo-case {
        max-height: 65px;
        max-width: 140px;
    }
}

@media (max-width: 575.98px) {
    .h-300 {
        height: auto !important;
    }
}

@media (max-width: 768px) {
    .responsive-gap {
        gap: 20px;
    }
    .mt-mobi-30 {
        margin-top: 30px;
    }
    .logo-case {
        max-height: 55px;
        max-width: 120px;
    }
}

@media (max-width: 576px) {
    .responsive-gap {
        gap: 10px;
    }

    .logo-case {
        max-height: 45px;
        max-width: 100px;
    }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .ipad-center-text {
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

@media (min-width: 992px) {
    .ipad-center-text {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .ipad-center-title {
        text-align: center !important;
        margin-left: auto;
        margin-right: auto;
    }
}

@media (min-width: 992px) {
    .ipad-center-title {
        text-align: left !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
  header {
    display: block !important;
    /* hoặc các thuộc tính khác nếu header bị ẩn */
  }
  .video-home {
    width: 100%;
    max-width: 100vw;
    overflow: hidden;
    /* Thêm padding hoặc margin nếu cần */
  }
  .video-home .banner,
  #video-background {
    width: 100vw;
    height: auto;
    min-height: 250px;
    max-height: 500px;
    object-fit: cover;
    display: block;
    margin: 0 auto;
  }
}