/* An academy on the apex (/solutions/<slug> with an academy, and its track pages
   /solutions/<slug>/<track>). Loaded AFTER site.css, solutions.css and
   package.css (the request dialog's styles live there). acad-* classes only.
   Colors use --semantic-*/--base-* tokens so dark mode flips for free. */

/* ── Hero "What's inside" card: real counts, no mock-up ──────────────────── */
.acad-inside { background: var(--semantic-background-bg-surface); border: 1px solid var(--semantic-border-border-subtle); border-radius: 1.25rem; box-shadow: 0 20px 50px -24px rgba(20,20,40,.25); padding: 1.4rem 1.5rem; display: flex; flex-direction: column; gap: 1.1rem; }
.acad-inside__head { display: flex; flex-direction: column; gap: 0.2rem; }
.acad-inside__label { font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.09em; color: var(--semantic-text-text-tertiary); }
.acad-inside__sub { font-size: 0.85rem; color: var(--semantic-text-text-secondary); }
.acad-inside__figures { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; }
.acad-inside__figure { padding: 0.8rem 0.9rem; border-radius: 0.85rem; background: var(--semantic-background-bg-page); border: 1px solid var(--semantic-border-border-subtle); display: flex; flex-direction: column-reverse; gap: 0.15rem; }
.acad-inside__figure dt { font-size: 0.78rem; color: var(--semantic-text-text-tertiary); }
.acad-inside__figure dd { margin: 0; font-size: 1.45rem; font-weight: 700; letter-spacing: -0.01em; line-height: 1.15; }
.acad-inside__law { display: flex; gap: 0.6rem; align-items: flex-start; padding: 0.75rem 0.9rem; border-radius: 0.85rem; background: var(--base-primary-primary-50); color: var(--base-primary-primary-700); font-size: 0.82rem; line-height: 1.45; text-decoration: none; }
.dark .acad-inside__law { background: color-mix(in srgb, var(--base-primary-primary-500) 16%, var(--base-neutral-neutral-800)); color: var(--base-primary-primary-200); }
.acad-inside__law .pub-icon { flex: none; width: 1.05rem; height: 1.05rem; margin-top: 0.1rem; }
.acad-inside__law strong { display: block; }
.acad-inside__foot { margin: 0; font-size: 0.78rem; color: var(--semantic-text-text-tertiary); }

.acad-source { white-space: nowrap; color: var(--base-primary-primary-600); font-weight: 600; }
.dark .acad-source { color: var(--base-primary-primary-300); }

/* ── What it covers: one card per subject group ──────────────────────────── */
.acad-coverage { margin-top: 3rem; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(20rem, 100%), 1fr)); align-items: start; }
.acad-group { background: var(--semantic-background-bg-surface); border: 1px solid var(--semantic-border-border-default); border-radius: var(--pub-radius); padding: 1.3rem 1.4rem; }
.acad-group__head { display: flex; justify-content: space-between; align-items: baseline; gap: 0.75rem; }
.acad-group__name { margin: 0; font-size: 1.05rem; font-weight: 600; }
.acad-group__count { flex: none; font-size: 0.75rem; font-weight: 600; padding: 0.2rem 0.55rem; border-radius: var(--pub-radius-pill); background: var(--base-primary-primary-50); color: var(--base-primary-primary-700); }
.dark .acad-group__count { background: color-mix(in srgb, var(--base-primary-primary-500) 18%, var(--base-neutral-neutral-800)); color: var(--base-primary-primary-300); }
.acad-group__blurb { margin: 0.55rem 0 0; font-size: 0.88rem; line-height: 1.5; color: var(--semantic-text-text-secondary); }
.acad-group__subjects { list-style: none; margin: 0.9rem 0 0; padding: 0.75rem 0 0; border-top: 1px solid var(--semantic-border-border-subtle); display: flex; flex-direction: column; gap: 0.4rem; }
.acad-group__subjects li { display: flex; justify-content: space-between; gap: 0.75rem; font-size: 0.85rem; line-height: 1.4; }
.acad-group__n { flex: none; color: var(--semantic-text-text-tertiary); font-variant-numeric: tabular-nums; }

/* ── Tracks, by level ────────────────────────────────────────────────────── */
.acad-level { margin-top: 2.75rem; }
.acad-level__head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.4rem 1rem; margin-bottom: 1rem; }
.acad-level__name { margin: 0; display: flex; align-items: center; gap: 0.6rem; font-size: 1.2rem; font-weight: 600; }
.acad-level__n { width: 1.75rem; height: 1.75rem; border-radius: 50%; display: grid; place-items: center; font-size: 0.85rem; background: var(--base-primary-primary-500); color: #fff; }
.acad-level__lead { margin: 0; font-size: 0.92rem; color: var(--semantic-text-text-secondary); }
.acad-tracks { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(17rem, 100%), 1fr)); }
.acad-track { display: flex; flex-direction: column; gap: 0.5rem; padding: 1.2rem 1.3rem; border-radius: var(--pub-radius); border: 1px solid var(--semantic-border-border-default); background: var(--semantic-background-bg-surface); color: inherit; text-decoration: none; transition: border-color 0.15s ease, transform 0.15s ease; }
.acad-track:hover { border-color: var(--base-primary-primary-300, #b9b4f5); transform: translateY(-2px); }
.acad-track__title { margin: 0; font-size: 1.02rem; font-weight: 600; line-height: 1.35; }
.acad-track__for { margin: 0; font-size: 0.84rem; line-height: 1.45; color: var(--semantic-text-text-secondary); }
.acad-track__meta { margin-top: auto; padding-top: 0.4rem; display: flex; flex-wrap: wrap; gap: 0.35rem 0.9rem; font-size: 0.78rem; color: var(--semantic-text-text-tertiary); }

/* ── Find your track: a table that stacks on a phone ─────────────────────── */
.acad-finder { margin: 3rem auto 0; max-width: 60rem; border: 1px solid var(--semantic-border-border-default); border-radius: var(--pub-radius); overflow: hidden; background: var(--semantic-background-bg-surface); }
.acad-finder__row { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 1.4fr); gap: 1rem; padding: 0.85rem 1.2rem; font-size: 0.9rem; line-height: 1.45; border-top: 1px solid var(--semantic-border-border-subtle); }
.acad-finder__row--head { border-top: none; background: var(--semantic-background-bg-page); font-size: 0.74rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: var(--semantic-text-text-tertiary); }
.acad-finder__who { font-weight: 500; }
.acad-finder__then { color: var(--semantic-text-text-secondary); }
.acad-finder a { color: var(--base-primary-primary-600); font-weight: 600; text-decoration: none; }
.dark .acad-finder a { color: var(--base-primary-primary-300); }
.acad-finder a:hover { text-decoration: underline; }

/* Four steps: two by two, or four across when there is room (never 3 + 1). */
.acad-how { margin-top: 3rem; grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 52rem; margin-inline: auto; }
@media (min-width: 72rem) { .acad-how { grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: none; } }
@media (max-width: 40rem) { .acad-how { grid-template-columns: 1fr; } }

/* ── Sources ─────────────────────────────────────────────────────────────── */
.acad-sources__figures { margin: 2.25rem auto 0; max-width: 46rem; text-align: center; font-size: 1.05rem; color: var(--semantic-text-text-secondary); }
.acad-sources__figures strong { color: var(--semantic-text-text-primary); }
.acad-publishers { list-style: none; margin: 1.5rem auto 0; padding: 0; max-width: 60rem; display: flex; flex-wrap: wrap; justify-content: center; gap: 0.55rem; }
.acad-publishers li { display: inline-flex; align-items: baseline; gap: 0.5rem; padding: 0.5rem 0.9rem; border-radius: var(--pub-radius-pill); border: 1px solid var(--semantic-border-border-default); background: var(--semantic-background-bg-surface); font-size: 0.86rem; }
.acad-publishers a { color: var(--semantic-text-text-primary); font-weight: 500; text-decoration: none; }
.acad-publishers a:hover { text-decoration: underline; }
.acad-publishers__n { font-size: 0.74rem; color: var(--semantic-text-text-tertiary); }
.acad-law { margin: 2rem auto 0; max-width: 40rem; display: flex; align-items: center; gap: 0.75rem; padding: 0.9rem 1.1rem; border-radius: var(--pub-radius); border: 1px solid var(--base-primary-primary-100); background: var(--base-primary-primary-50); color: var(--base-primary-primary-700); font-size: 0.92rem; line-height: 1.45; text-decoration: none; }
.dark .acad-law { background: color-mix(in srgb, var(--base-primary-primary-500) 14%, var(--base-neutral-neutral-800)); border-color: color-mix(in srgb, var(--base-primary-primary-500) 28%, var(--base-neutral-neutral-800)); color: var(--base-primary-primary-200); }
.acad-law .pub-icon { flex: none; width: 1.15rem; height: 1.15rem; }
.acad-law span { flex: 1; }

.acad-orgs { align-items: start; }

/* ── Track page ──────────────────────────────────────────────────────────── */
.acad-hero__headline { margin: 0; font-size: 1.3rem; font-weight: 600; line-height: 1.4; color: var(--semantic-text-text-primary); }
.acad-hero__note { margin: 0; max-width: 34rem; font-size: 0.88rem; line-height: 1.55; color: var(--semantic-text-text-secondary); }
.acad-facts { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.45rem; }
.acad-facts li { display: inline-flex; align-items: center; gap: 0.35rem; padding: 0.3rem 0.7rem; border-radius: var(--pub-radius-pill); border: 1px solid var(--semantic-border-border-default); background: var(--semantic-background-bg-surface); font-size: 0.8rem; color: var(--semantic-text-text-secondary); }
.acad-facts .pub-icon { width: 0.9rem; height: 0.9rem; }

/* Practice question card (hero and the practice section). */
.acad-qcard { background: var(--semantic-background-bg-surface); border: 1px solid var(--semantic-border-border-subtle); border-radius: 1.25rem; box-shadow: 0 20px 50px -24px rgba(20,20,40,.2); padding: 1.3rem 1.4rem; display: flex; flex-direction: column; gap: 0.6rem; }
.acad-qcard__label { font-size: 0.66rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.09em; color: var(--base-warning-warning-600); }
.acad-qcard__note { margin: 0; font-size: 0.76rem; line-height: 1.45; color: var(--semantic-text-text-tertiary); }
.acad-questions { margin-top: 3rem; display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(24rem, 100%), 1fr)); align-items: start; }

/* A question that answers without a script: a radio per choice, and :has()
   marks the right one once any is picked. */
.acad-q { margin: 0; padding: 0; border: none; min-width: 0; display: flex; flex-direction: column; gap: 0.4rem; }
.acad-q__text { padding: 0; margin-bottom: 0.45rem; font-size: 0.95rem; font-weight: 600; line-height: 1.45; }
.acad-q__opt { position: relative; display: flex; align-items: flex-start; gap: 0.55rem; padding: 0.55rem 0.75rem; border-radius: 0.55rem; border: 1px solid var(--semantic-border-border-subtle); background: var(--semantic-background-bg-page); font-size: 0.86rem; line-height: 1.45; color: var(--semantic-text-text-secondary); cursor: pointer; }
.acad-q__opt:hover { border-color: var(--semantic-border-border-strong); }
.acad-q__opt input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.acad-q__opt:has(input:focus-visible) { outline: 2px solid var(--semantic-border-border-brand); outline-offset: 1px; }
.acad-q__opt .pub-icon { flex: none; width: 1rem; height: 1rem; margin-top: 0.1rem; color: var(--semantic-border-border-default); }
.acad-q:has(input:checked) .acad-q__opt { cursor: default; }
.acad-q:has(input:checked) .acad-q__opt.is-correct { border-color: var(--base-success-success-500); background: var(--base-success-success-50); color: var(--base-success-success-700); font-weight: 600; }
.dark .acad-q:has(input:checked) .acad-q__opt.is-correct { background: color-mix(in srgb, var(--base-success-success-500) 18%, transparent); color: var(--base-success-success-300); }
.acad-q:has(input:checked) .acad-q__opt.is-correct .pub-icon { color: currentColor; }
.acad-q__opt:not(.is-correct):has(input:checked) { border-color: var(--base-error-error-500, #c53030); color: var(--semantic-text-text-primary); }
.acad-q__verdict { display: none; margin: 0.3rem 0 0; font-size: 0.82rem; font-weight: 600; }
.acad-q__verdict--right { color: var(--base-success-success-600); }
.acad-q__verdict--wrong { color: var(--base-error-error-500, #c53030); }
.acad-q:has(.is-correct input:checked) .acad-q__verdict--right { display: block; }
.acad-q:has(.acad-q__opt:not(.is-correct) input:checked) .acad-q__verdict--wrong { display: block; }

/* The plan: one row per step, opening to its topics. */
.acad-steps { list-style: none; margin: 3rem auto 0; padding: 0; max-width: 52rem; display: flex; flex-direction: column; gap: 0.75rem; }
.acad-step { background: var(--semantic-background-bg-surface); border: 1px solid var(--semantic-border-border-default); border-radius: var(--pub-radius); overflow: hidden; }
.acad-step > summary { list-style: none; cursor: pointer; display: flex; align-items: flex-start; gap: 0.9rem; padding: 1rem 1.2rem; }
.acad-step > summary::-webkit-details-marker { display: none; }
.acad-step > summary > .pub-icon { flex: none; width: 1.1rem; height: 1.1rem; margin-top: 0.3rem; color: var(--semantic-text-text-tertiary); transition: transform 0.15s ease; }
.acad-step[open] > summary > .pub-icon { transform: rotate(180deg); }
.acad-step__n { flex: none; width: 1.9rem; height: 1.9rem; border-radius: 50%; display: grid; place-items: center; font-weight: 700; font-size: 0.85rem; background: var(--base-primary-primary-50); color: var(--base-primary-primary-700); }
.dark .acad-step__n { background: color-mix(in srgb, var(--base-primary-primary-500) 18%, var(--base-neutral-neutral-800)); color: var(--base-primary-primary-300); }
.acad-step__body { flex: 1; display: flex; flex-direction: column; gap: 0.25rem; min-width: 0; }
.acad-step__title { font-weight: 600; line-height: 1.4; }
.acad-step__summary { font-size: 0.88rem; line-height: 1.5; color: var(--semantic-text-text-secondary); }
.acad-step__count { flex: none; margin-top: 0.2rem; font-size: 0.76rem; color: var(--semantic-text-text-tertiary); white-space: nowrap; }
.acad-step__topics { margin: 0; padding: 0.2rem 1.2rem 1.1rem 4rem; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(16rem, 100%), 1fr)); gap: 0.35rem 1.5rem; font-size: 0.86rem; line-height: 1.45; color: var(--semantic-text-text-secondary); }

/* Who it's for. */
.acad-who { margin: 2.5rem auto 0; max-width: 44rem; display: flex; flex-direction: column; gap: 0.9rem; }
.acad-who > div { display: grid; grid-template-columns: 8rem minmax(0, 1fr); gap: 1rem; padding-bottom: 0.9rem; border-bottom: 1px solid var(--semantic-border-border-subtle); }
.acad-who dt { font-size: 0.8rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: var(--semantic-text-text-tertiary); padding-top: 0.15rem; }
.acad-who dd { margin: 0; line-height: 1.55; }
.acad-who a { color: var(--base-primary-primary-600); font-weight: 600; }
.dark .acad-who a { color: var(--base-primary-primary-300); }

.acad-back { margin: 2.25rem 0 0; text-align: center; }

/* ── Responsive ─────────────────────────────────────────────────────────── */
@media (max-width: 48rem) {
  .acad-finder__row--head { display: none; }
  .acad-finder__row { grid-template-columns: 1fr; gap: 0.3rem; }
  .acad-finder__row:nth-child(2) { border-top: none; }
  .acad-step__count { display: none; }
  .acad-step__topics { padding-left: 1.2rem; }
  .acad-who > div { grid-template-columns: 1fr; gap: 0.3rem; }
}
@media (max-width: 26rem) {
  .acad-inside__figures { grid-template-columns: 1fr 1fr; gap: 0.5rem; }
  .acad-inside__figure dd { font-size: 1.2rem; }
}