.learning-backdrop { position:fixed; inset:0; z-index:1200; display:grid; place-items:center; padding:20px; background:rgba(15,23,42,.58); }
.learning-backdrop[hidden] { display:none; }
.learning-dialog { width:min(920px,100%); max-height:min(88dvh,860px); overflow:auto; border:1px solid var(--q-line,#d7dde5); border-radius:16px; background:var(--q-surface,#fff); color:var(--q-ink,#172033); box-shadow:0 24px 70px rgba(15,23,42,.28); }
.learning-head { position:sticky; top:0; z-index:2; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px 20px; border-bottom:1px solid var(--q-line,#d7dde5); background:inherit; }
.learning-title { margin:0; font-size:1.35rem; }
.learning-close,.learning-primary,.learning-secondary,.learning-search { min-height:44px; border-radius:10px; font:inherit; }
.learning-close { min-width:44px; border:0; background:transparent; font-size:1.6rem; cursor:pointer; }
.learning-body { display:grid; grid-template-columns:minmax(260px,.85fr) minmax(340px,1.4fr); grid-template-rows:min-content 1fr; gap:18px; padding:20px; }
.learning-course,.learning-tours,.learning-guide { border:1px solid var(--q-line,#d7dde5); border-radius:12px; padding:16px; }
.learning-course { align-self:start; background:color-mix(in srgb,var(--q-blue,#2463eb) 8%,white); }
.learning-course h3,.learning-tours h3,.learning-guide h3 { margin:.2rem 0 .55rem; }
.learning-eyebrow { margin:0; color:var(--q-blue,#245ee8); font-size:.78rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; }
.learning-muted,.learning-course-hint { color:var(--q-muted,#5d6675); }
.learning-primary,.learning-secondary { border:1px solid var(--q-blue,#245ee8); padding:8px 13px; cursor:pointer; }
.learning-primary { width:100%; background:var(--q-blue,#245ee8); color:#fff; font-weight:700; }
.learning-secondary { background:var(--q-surface,#fff); color:var(--q-blue,#245ee8); }
.learning-tours { grid-column:1; }
.learning-tour-list { display:grid; gap:8px; margin:12px 0 0; padding:0; list-style:none; }
.learning-tour { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.learning-tour-copy { display:grid; min-width:0; }
.learning-tour-copy small { color:var(--q-muted,#5d6675); }
.learning-guide { grid-column:2; grid-row:1 / span 2; }
.learning-search-label { display:block; margin:10px 0 5px; font-weight:650; }
.learning-search { width:100%; border:1px solid var(--q-line,#aeb7c5); padding:8px 12px; background:var(--q-surface,#fff); color:inherit; }
.learning-guide-results { display:grid; gap:10px; margin:14px 0; }
.learning-article { border-top:1px solid var(--q-line,#d7dde5); padding-top:10px; }
.learning-article h4 { margin:0 0 6px; }
.learning-article p { margin:5px 0; line-height:1.48; }
.learning-controls { width:100%; }
.learning-close:focus-visible,.learning-primary:focus-visible,.learning-secondary:focus-visible,.learning-search:focus-visible { outline:3px solid color-mix(in srgb,var(--q-blue,#245ee8) 38%,transparent); outline-offset:2px; }

@media (max-width:700px) {
  .learning-backdrop { padding:0; place-items:stretch; }
  .learning-dialog { width:100%; max-height:100dvh; border-radius:0; }
  .learning-body { grid-template-columns:1fr; padding:14px; }
  .learning-course,.learning-tours,.learning-guide { grid-column:1; grid-row:auto; }
}
@media (max-width:480px) {
  .learning-head { padding:10px 14px; }
  .learning-close,.learning-primary,.learning-secondary,.learning-search { min-height:44px; }
  .learning-tour { align-items:stretch; }
  .learning-tour .learning-secondary { min-width:82px; }
}
