/* Education shares the main site's tokens, typography, navigation and footer. */
.learning-hero { background: var(--ink); color: var(--paper); padding-block: 24px 58px; }
.learning-hero-grid { display: grid; gap: 32px; align-items: center; }
.learning-hero h1 { margin-bottom: 28px; }
.learning-hero h1 em { color: var(--coral); }
.learning-hero p:not(.eyebrow) { color: #d2d6cc; }
.learning-hero figure { margin: 0; max-width: 480px; justify-self: center; }
.learning-hero img { width: 100%; }
.learning-hero figcaption { text-align: center; font: .8rem var(--mono); color: #d2d6cc; }
.learning-hero :focus-visible { outline-color: var(--yellow); }
.learning-crumbs { display: flex !important; flex-direction: row !important; width: auto !important; gap: 12px; margin-bottom: 36px; padding: 0 !important; }
.learning-crumbs a { min-height: 44px; display: inline-flex; align-items: center; text-decoration: underline; }
.learning-intro { padding-top: 24px; }
.learning-intro h1 { font-size: clamp(2.7rem, 6vw, 5rem); overflow-wrap: anywhere; }
.learning-lead { margin-block: 24px 36px; color: var(--muted); }
.learning-tinted { background: #e9ecdf; }
.learning-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 18px; margin-top: 30px; }
.learning-tile { background: var(--white); border: 1px solid #c5cbbd; border-radius: 4px; padding: 28px; display: flex; flex-direction: column; }
.learning-tile h3 a { display: inline-block; padding-block: 6px; min-height: 44px; }
.learning-tile p { color: var(--muted); font-size: .95rem; }
.learning-compact .learning-tile { padding: 18px 24px; }
.learning-compact h3 { font-size: 1.05rem; margin-bottom: 0; }
.learning-compact .learning-status { padding-top: 6px; }
.learning-status { margin-top: auto; padding-top: 12px; font: .75rem/1.6 var(--mono); color: var(--muted); }
.learning-resource { display: grid; border: 1px solid #c5cbbd; border-radius: 6px; overflow: hidden; margin-block: 26px; background: var(--white); }
.learning-art { background: var(--ink); display: grid; place-items: center; }
.learning-art img { width: min(100%, 330px); height: 260px; object-fit: contain; }
.learning-resource-copy { padding: 28px; }
.learning-resource h3 { font: clamp(2rem, 4vw, 3rem)/1.1 var(--serif); letter-spacing: -.04em; }
.learning-resource h3 a { text-decoration-thickness: 1px; }
.learning-resource .eyebrow { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.learning-badge { background: var(--moss); padding: 4px 10px; border: 1px solid #98aa7b; border-radius: 20px; color: var(--ink); }
.learning-subtitle { font-family: var(--serif); font-size: 1.2rem; }
.learning-resource .button { margin-top: 12px; }
.learning-detail { display: grid; gap: 36px; }
.learning-facts, .learning-empty { background: var(--white); padding: 28px; border: 1px solid var(--line); border-radius: 4px; }
.learning-facts a { display: inline-block; min-height: 44px; padding-block: 8px; }
.learning-empty { margin-top: 24px; }
.learning-filter { margin-block: 24px; }
.learning-filter select { font: inherit; color: var(--ink); background: var(--white); padding: 12px; border: 1px solid #7a8577; border-radius: 4px; width: min(100%, 420px); min-height: 48px; }
.learning-results { color: var(--muted); margin-top: 18px; }
[hidden] { display: none !important; }
@media (min-width: 760px) {
  .learning-hero-grid { grid-template-columns: 1.2fr 1fr; }
  .learning-resource { grid-template-columns: 1fr 1.65fr; }
  .learning-art img { height: auto; }
  .learning-resource-copy { padding: 42px; }
  .learning-detail { grid-template-columns: 1.5fr 1fr; gap: 64px; }
}
@media (max-width: 759px) {
  .learning-hero figure { max-width: 270px; }
  .learning-hero-grid { gap: 40px; }
}
@media (min-width: 1024px) {
  .learning-grid-levels { grid-template-columns: repeat(3, 1fr); }
}
