/* ===========================================================================
   SERVIRIS Academy — the standalone site.

   The brand system arrives in base.css; this file adds only what belongs to a
   site of its own: the Academy wordmark beside the logo, the language picker,
   the pager under a lesson, and the page that says a lesson is not here.
   ========================================================================= */

.academy { background: #f8fafc; }
.academy main { display: block; }

/* "Academy" is part of the name, set beside the wordmark in the brand's own
   blue rather than stamped over it as a chip. */
.academy-wordmark {
  display: inline-block; margin-left: .38em;
  font-weight: 500; letter-spacing: -.01em; color: #3DA9FC;
  font-size: inherit; line-height: inherit;
}
.landing-nav-word + .academy-wordmark,
.landing-footer-word + .academy-wordmark { vertical-align: baseline; }
.academy-wordmark-footer { color: #7dd3fc; }

/* the lockup keeps the byline under it, exactly as the marketing site does */
.academy .landing-brand-lockup { display: flex; flex-direction: column; align-items: flex-start; }
.academy .landing-nav-byline,
.academy .landing-footer-byline { opacity: 1; }

/* ── the language picker ─────────────────────────────────────────────────── */
.academy-lang { position: relative; }
.academy-lang-menu {
  position: absolute; right: 0; top: calc(100% + 10px); z-index: 60;
  width: 232px; max-height: 60vh; overflow: auto;
  padding: 6px; border-radius: 16px;
  background: #fff; border: 1px solid #e2e8f0;
  box-shadow: 0 24px 60px rgba(15, 23, 42, .16);
}
.academy-lang-menu[hidden] { display: none; }
.academy-lang-menu a {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 12px; border-radius: 10px;
  font-size: 13.5px; font-weight: 600; color: #334155; text-decoration: none;
  transition: background .14s ease, color .14s ease;
}
.academy-lang-menu a:hover { background: #f0f9ff; color: #0369a1; }
.academy-lang-menu a.is-current { background: #0f172a; color: #fff; }
.academy-lang-menu img { width: 18px; height: 18px; border-radius: 999px; object-fit: cover; }

/* ── previous / next, under a lesson ─────────────────────────────────────── */
.academy-pager {
  display: grid; gap: 12px; align-items: stretch; margin-top: 44px;
  grid-template-columns: 1fr;
}
@media (min-width: 860px) { .academy-pager { grid-template-columns: 1fr auto 1fr; } }
.academy-pager a {
  display: flex; align-items: center; gap: 12px;
  padding: 16px 18px; border-radius: 16px;
  background: #fff; border: 1px solid #e2e8f0; text-decoration: none;
  transition: border-color .18s ease, box-shadow .18s ease;
}
.academy-pager a:hover { border-color: #cbd5e1; box-shadow: 0 14px 34px rgba(15, 23, 42, .07); }
.academy-pager small { display: block; font-size: 11.5px; font-weight: 700; color: #94a3b8; }
.academy-pager b { display: block; margin-top: 2px; font-size: 14px; font-weight: 700; color: #0f172a; line-height: 1.35; }
.academy-pager i { color: #94a3b8; font-size: 18px; flex: 0 0 auto; }
.academy-pager-prev i { transform: rotate(180deg); }
.academy-pager-prev { text-align: left; }
.academy-pager-next { text-align: right; justify-content: flex-end; }
.academy-pager-all {
  justify-content: center; font-size: 13px; font-weight: 700; color: #0369a1;
  white-space: nowrap;
}
.academy-pager-all i { color: #0369a1; }

/* ── the page that says a lesson is not here ─────────────────────────────── */
.academy-notfound { padding: 60px 0 80px; text-align: center; }
.academy-notfound-badge {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 7px 16px; border-radius: 999px;
  background: #e0f2fe; color: #0369a1; border: 1px solid #bae6fd;
  font-size: 12.5px; font-weight: 800;
}
.academy-notfound h1 { margin-top: 20px; font-size: 32px; font-weight: 800; color: #0f172a; }
.academy-notfound p { margin: 12px auto 0; max-width: 60ch; font-size: 15.5px; line-height: 1.7; color: #475569; }
.academy-notfound .academy-category-rail { justify-content: center; border-top: 0; margin-top: 28px; }

/* ── the nav of a site that is only lessons ──────────────────────────────── */
.academy .sr-nav .nav-link { font-size: 13.5px; }
@media (max-width: 1023px) { .academy .sr-nav .landing-auth-login { display: none; } }