/* ==========================================================================
   Page: 404 — Không tìm thấy trang
   Bootstrap-first (container/row/col + utilities); custom chỉ cho typography 404.
   ========================================================================== */
.error-404 {
  display: flex;
  align-items: center;
  min-height: 100vh;
  padding: calc(var(--navbar-height) + var(--space-16)) 0 var(--space-20);
  background-image: linear-gradient(180deg, #f8faff 0%, #eef5fe 100%);
}

/* Số 404 lớn — gradient xanh thương hiệu (như .section-title) */
.error-404__code {
  margin: 0;
  font-family: var(--font-family);
  font-size: clamp(120px, 22vw, 220px);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.04em;
  background-image: linear-gradient(91deg, #6598ea 20%, #1b5bd2 80%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.error-404__title {
  margin: var(--space-2) 0 var(--space-4);
  font-family: var(--font-family);
  font-size: clamp(28px, 4vw, 40px);
  font-weight: 800;
  line-height: 1.3;
  color: var(--color-text-main);
}

.error-404__desc {
  margin: 0 auto var(--space-8);
  max-width: 520px;
  font-size: var(--font-size-lg);
  font-weight: 400;
  line-height: 1.6;
  color: var(--color-text-secondary);
}