/* Workstream B (2026-10-17): public Exam Prep pages. E1 inline sample questions, E2 equal
   track cards, E6 "What's inside a question". Loaded after exam-marketing.css; theme tokens only. */

/* E2: equal cards; the price/buy block sits at the bottom of every card. */
.xm-tracks { align-items: stretch; }
.xm-tracks .xm-track { height: 100%; }
.xm-tracks .xm-buy { margin-top: auto; }

/* E1: inline sample questions */
.xq-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 1rem; width: 100%; max-width: 52rem; margin-inline: auto; }
.xq-card { padding: clamp(1.1rem, 3vw, 1.6rem); border-radius: 1.4rem; border: 1px solid var(--xm-line);
  background: linear-gradient(165deg, var(--mh-card-highlight, transparent), var(--xm-glass)); display: grid; gap: .85rem; min-width: 0; }
.xq-card__meta { font-size: .8rem; font-weight: 700; color: var(--mh-accent); letter-spacing: .02em; }
.xq-card__stem { font-size: 1.02rem; line-height: 1.7; color: var(--mh-text); overflow-wrap: anywhere; }
.xq-options { list-style: none; padding: 0; margin: 0; display: grid; gap: .5rem; }
.xq-option { display: flex; gap: .65rem; align-items: flex-start; padding: .65rem .85rem; border-radius: .9rem; border: 1px solid var(--xm-line); line-height: 1.55; overflow-wrap: anywhere; }
.xq-option__letter { flex: none; display: inline-grid; place-items: center; width: 1.6rem; height: 1.6rem; border-radius: 50%; font-size: .8rem; font-weight: 800;
  background: color-mix(in srgb, var(--mh-accent) 14%, transparent); color: var(--mh-accent); }
.xq-reveal { border-top: 1px solid var(--xm-line); padding-top: .6rem; }
.xq-reveal summary { cursor: pointer; font-weight: 700; color: var(--mh-accent); min-height: 2.75rem; display: flex; align-items: center; gap: .4rem; list-style: none; }
.xq-reveal summary::-webkit-details-marker { display: none; }
.xq-reveal summary::before { content: ""; width: .5rem; height: .5rem; border-inline-end: 2px solid currentColor; border-block-end: 2px solid currentColor; transform: rotate(-45deg); transition: transform .2s; margin-inline-end: .3rem; }
[dir="rtl"] .xq-reveal summary::before { transform: rotate(45deg); }
.xq-reveal[open] summary::before { transform: rotate(45deg); }
.xq-answer { display: grid; gap: .55rem; padding-top: .35rem; line-height: 1.7; color: var(--mh-muted-strong); }
.xq-answer__correct { padding: .7rem .9rem; border-radius: .9rem; background: color-mix(in srgb, var(--xm-ok) 12%, transparent); border: 1px solid color-mix(in srgb, var(--xm-ok) 40%, transparent); color: var(--mh-text); }
.xq-answer__correct .xq-option__letter { background: color-mix(in srgb, var(--xm-ok) 22%, transparent); color: var(--xm-ok); }
.xq-answer__h { font-size: .85rem; font-weight: 800; color: var(--mh-text); margin-top: .35rem; }
.xq-refs { list-style: disc; padding-inline-start: 1.2rem; margin: 0; display: grid; gap: .25rem; }
.xq-refs a { color: var(--mh-accent); overflow-wrap: anywhere; }
.xq-more { margin-top: .5rem; }
.xq-more .mh-btn-primary { min-height: 3rem; }

/* E6: what's inside a question */
.xq-inside__grid { display: grid; gap: clamp(1.25rem, 4vw, 2.5rem); align-items: center; }
@media (min-width: 900px) { .xq-inside__grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); } }
.xq-inside__shot { margin: 0; border-radius: 1.4rem; overflow: hidden; border: 1px solid var(--xm-line); background: var(--xm-glass); }
.xq-inside__shot img { display: block; width: 100%; height: auto; aspect-ratio: 1200 / 630; object-fit: cover; }
.xq-inside__list { list-style: none; counter-reset: xq; padding: 0; margin: 1rem 0 0; display: grid; gap: .8rem; }
.xq-inside__list li { counter-increment: xq; display: grid; gap: .15rem; padding-inline-start: 2.4rem; position: relative; line-height: 1.6; }
.xq-inside__list li::before { content: counter(xq); position: absolute; inset-inline-start: 0; top: 0; width: 1.8rem; height: 1.8rem; border-radius: 50%; display: grid; place-items: center;
  font-weight: 800; font-size: .85rem; background: color-mix(in srgb, var(--mh-accent) 14%, transparent); color: var(--mh-accent); }
.xq-inside__list span { color: var(--mh-muted-strong); }
.xq-inside .xm-h2, .xq-inside .xm-lede { text-align: start; }