/* Exam Prep public pages (/exam-prep/, /exam-prep/<track>/) on the signed-out design system (DESIGN.md).
 * Loaded after exam-marketing.css + exam-public-b.css; remaps their tokens to pro.css and calms the surfaces. */
.xm-page {
  --mh-text: var(--pr-ink);
  --mh-muted: var(--pr-ink-3);
  --mh-muted-strong: var(--pr-ink-2);
  --mh-accent: var(--pr-accent);
  --mh-accent-ink: var(--pr-link);
  --mh-card-border: var(--pr-line);
  --xm-line: var(--pr-line);
  --xm-glass: color-mix(in srgb, var(--pr-raised) 86%, transparent);
  --xm-radius: 22px;
  --xm-ok: var(--pr-mint);
  padding-block: 40px var(--pr-section);
}
:root[data-theme="light"] .xm-page { --xm-glass: var(--pr-raised); }
.xm-page .xm-glow { display: none; }
.xm-page .xm-title { font-size: clamp(2.5rem, 1.4rem + 4vw, 4.5rem); font-weight: 600; letter-spacing: -.04em; line-height: 1.02; }
:root[dir="rtl"] .xm-page .xm-title { letter-spacing: 0; line-height: 1.25; font-weight: 700; }
.xm-page :is(h2, .xm-h) { font-weight: 600; letter-spacing: -.02em; }
.xm-page .xm-chip { border-radius: 8px; letter-spacing: 0; text-transform: none; font-weight: 600; }
.xm-page .xm-track, .xm-page [class*="card"], .xm-page details { border-radius: 22px; box-shadow: none; }
.xm-page .xm-track--live { border-color: var(--pr-accent); box-shadow: 0 0 0 1px var(--pr-accent) inset; }
.xm-page .xm-price__amount { font-weight: 600; letter-spacing: -.02em; }
.xm-page .xm-link { color: var(--pr-link); }
@media (hover: hover) {
  .xm-page .xm-track { transition: transform .35s var(--pr-ease), border-color .35s var(--pr-ease); }
  .xm-page .xm-track:hover { transform: translateY(-4px); }
}
@media (prefers-reduced-motion: reduce) { .xm-page .xm-track { transition: none; } .xm-page .xm-track:hover { transform: none; } }
/* "What's inside a question": the exam screen in a phone frame (both themes), keeping its own ratio. */
.xm-page .xq-inside__shot--phone { display: flex; justify-content: center; border: 0; background: none; overflow: visible; border-radius: 0; }
.xm-page .xq-inside__phone { width: min(60vw, 280px); }
.xm-page .xq-inside__phone img { aspect-ratio: 600 / 1304; object-fit: initial; height: auto; }
@media (max-width: 1023px) {
  .xm-page .xm-head, .xm-page .xq-inside__grid > div { text-align: center; }
  .xm-page .xq-inside__list { text-align: start; }
}
@media (max-width: 767px) { .xm-page { padding-block: 16px var(--pr-section); } }