/* Overlay loader */
#page-loader {
  position: fixed;
  inset: 0;
  display: grid;
  place-content: center;
  background: white;
  z-index: 10000;
  transition: opacity 0.3s ease;
}

/* Loader chữ với pattern chạy */
.loader {
  width: fit-content;
  line-height: 1.5;
  font-family: system-ui, sans-serif;
  font-weight: bold;
  text-transform: uppercase;
  color: transparent;
  -webkit-text-stroke: 1px #000;
  background: radial-gradient(1.13em at 50% 1.6em, #000 99%, transparent 101%) calc(50% - 1.6em) 0/3.2em
      100% text,
    radial-gradient(1.13em at 50% -0.8em, transparent 99%, #000 101%) 50% 0.8em/3.2em 100% repeat-x
      text;
  -webkit-background-clip: text;
  background-clip: text;
  animation: loader-pattern 2s linear infinite;
  font-size: 4rem;
}

/* Text nội dung loader */
.loader:before {
  content: 'QUANGDA';
}

/* Animation chạy pattern ngang chữ */
@keyframes loader-pattern {
  to {
    background-position: calc(50% + 1.6em) 0, calc(50% + 3.2em) 0.8em;
  }
}

/* Text nhỏ phía dưới */
#page-loader b {
  font-size: 1rem;
  text-align: center;
  display: block;
}