/* Nxtzen Learning — temporary "Coming Soon" placeholder.
   Uses the shared Nxtzen palette/typography (var tokens from styles.css). */
.nl-coming-soon {
  position: relative;
  min-height: calc(100vh - 320px);
  display: flex;
  align-items: center;
  padding: 120px 0;
  background: linear-gradient(180deg, var(--soft), #fff);
  overflow: hidden;
}
/* Subtle technical grid backdrop — decorative only. */
.nl-coming-soon .nl-grid-bg {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(18, 77, 216, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(18, 77, 216, 0.045) 1px, transparent 1px);
  background-size: 48px 48px;
  -webkit-mask-image: radial-gradient(ellipse at 50% 42%, #000 0%, transparent 72%);
  mask-image: radial-gradient(ellipse at 50% 42%, #000 0%, transparent 72%);
  pointer-events: none;
}
.nl-coming-soon .nl-inner {
  position: relative;
  max-width: 680px;
  margin-inline: auto;
  text-align: center;
}
.nl-status {
  display: inline-block;
  font: 700 0.68rem Manrope, sans-serif;
  letter-spacing: 0.16em;
  color: var(--royal);
  background: rgba(18, 77, 216, 0.08);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 7px 16px;
  margin-bottom: 24px;
}
.nl-coming-soon .nl-heading {
  color: var(--navy);
  margin-bottom: 20px;
}
.nl-coming-soon .nl-description {
  color: var(--muted);
  font-size: 1.05rem;
  max-width: 520px;
  margin: 0 auto 8px;
}
.nl-coming-soon .button-row {
  justify-content: center;
}
@media (max-width: 600px) {
  .nl-coming-soon { padding: 84px 0; min-height: 60vh; }
  .nl-coming-soon .button-row { gap: 10px; }
}