/* Tuy chinh rieng cho thanhconghpt.com - them boi Claude 26/08/2026
   Muc dich: chu tren banner anh de doc hon, nhat la tren dien thoai. */

/* 1. Lop phu toi len anh nen cua banner co chu mau sang */
.banner:has(.text.dark) .banner-bg .bg::after,
.banner:has(.text.dark) .banner-bg::after {
  content: "";
  position: absolute;
  left: 0; right: 0; top: 0; bottom: 0;
  background: linear-gradient(180deg,
      rgba(0, 0, 0, 0.20) 0%,
      rgba(0, 0, 0, 0.42) 40%,
      rgba(0, 0, 0, 0.58) 100%);
  pointer-events: none;
}

/* 2. Chu tren banner: dam hon + do bong de tach khoi anh */
.banner .text-box .text.dark h1,
.banner .text-box .text.dark h2,
.banner .text-box .text.dark h3,
.banner .text-box .text.dark h4 {
  text-shadow: 0 2px 14px rgba(0, 0, 0, 0.65);
  letter-spacing: 0.02em;
}
.banner .text-box .text.dark p {
  text-shadow: 0 1px 10px rgba(0, 0, 0, 0.75);
  font-weight: 500;
}

/* 3. Dien thoai: banner thap lai, chu to vua phai, khong tran ra mep */
@media (max-width: 767px) {
  .banner {
    padding-top: 62vw !important;
    min-height: 260px;
  }
  .banner .text-box {
    width: 90% !important;
    max-width: 90% !important;
  }
  .banner .text-box .text.dark h1,
  .banner .text-box .text.dark h2,
  .banner .text-box .text.dark h3 {
    font-size: 2.1em;
    margin-bottom: 0.45em;
    line-height: 1.15;
  }
  .banner .text-box .text.dark p {
    font-size: 1.02em;
    line-height: 1.6;
    margin-bottom: 0;
  }
}

/* 4. Man hinh rat nho */
@media (max-width: 400px) {
  .banner .text-box .text.dark h1,
  .banner .text-box .text.dark h2,
  .banner .text-box .text.dark h3 { font-size: 1.85em; }
  .banner .text-box .text.dark p { font-size: 0.96em; }
}
