/* Banner section styles */
.relative.pt-70.pb-70.bg-blue-2 {
    position: relative;
    width: 100%;
    padding: 0 !important; /* Reset padding từ các class */
    overflow: hidden;
    background-size: cover;
    background-position: center;
    /* Tính toán tỷ lệ: (295.5 / 1512.8) * 100 = 19.534% */
    padding-top: 19.534% !important;
  }

  /* Lớp overlay cho banner */
  .relative.pt-70.pb-70.bg-blue-2::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: inherit;
    background-size: cover;
    background-position: center;
    opacity: 0.15;
  }

  /* Container trong banner */
  .relative.pt-70.pb-70.bg-blue-2 .container {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    max-width: 1512.8px;
    margin: 0 auto;
    padding: 0 15px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  /* Content wrapper */
  .relative.pt-70.pb-70.bg-blue-2 .row {
    width: 100%;
  }

  /* Responsive cho Tablet */
  @media (max-width: 991px) {
    .relative.pt-70.pb-70.bg-blue-2 {
      /* Giữ nguyên tỷ lệ */
      padding-top: 19.534% !important;
    }

    .relative.pt-70.pb-70.bg-blue-2 .text-40 {
      font-size: 28px !important;
    }

    .relative.pt-70.pb-70.bg-blue-2 .row.justify-center {
      display: none !important;
    }
  }

  /* Responsive cho Mobile */
  @media (max-width: 767px) {
    .relative.pt-70.pb-70.bg-blue-2 {
      /* Giữ nguyên tỷ lệ */
      padding-top: 19.534% !important;
      min-height: unset;
    }

    .relative.pt-70.pb-70.bg-blue-2 .container {
      padding: 10px;
    }

    .relative.pt-70.pb-70.bg-blue-2 .text-40 {
      font-size: 18px !important;
      line-height: 1.3;
      margin: 0 !important;
    }

    .relative.pt-70.pb-70.bg-blue-2 .text-white {
      font-size: 12px;
    }

    .relative.pt-70.pb-70.bg-blue-2 .mt-45 {
      margin-top: 0 !important;
    }

    .relative.pt-70.pb-70.bg-blue-2 .mt-20 {
      margin-top: 5px !important;
    }
  }

  /* Đảm bảo văn bản luôn rõ ràng */
  .relative.pt-70.pb-70.bg-blue-2 h1,
  .relative.pt-70.pb-70.bg-blue-2 .text-white {
    text-shadow: 0 2px 4px rgba(0,0,0,0.2);
  }

  /* Fallback cho trình duyệt cũ */
  @supports not (aspect-ratio: 1512.8/295.5) {
    .relative.pt-70.pb-70.bg-blue-2 {
      height: 0;
      padding-top: 19.534% !important;
    }
  }

/* Mobile & Tablet Breadcrumb Styles */
.mobile-tablet-breadcrumb {
  background-color: #f8f9fa;
  padding: 15px 0;
  margin-top: 80px; /* Để tránh header fixed */
  border-bottom: 1px solid #e9ecef;
}

.mobile-tablet-breadcrumb .text-dark-1 {
  font-size: 14px;
  color: #333;
  font-weight: 500;
}

.mobile-tablet-breadcrumb .icon-chevron-right {
  font-size: 12px;
  color: #666;
}

.mobile-tablet-breadcrumb a:hover {
  color: #28a745;
}

@media (max-width: 991px) {
  .mobile-tablet-breadcrumb {
    margin-bottom: 0;
  }
}

@media (max-width: 767px) {
  .mobile-tablet-breadcrumb {
    padding: 12px 0;
    margin-top: 70px;
  }

  .mobile-tablet-breadcrumb .text-dark-1 {
    font-size: 13px;
  }

  .mobile-tablet-breadcrumb .icon-chevron-right {
    font-size: 10px;
    padding: 0 8px !important;
  }
}