/* Resources articles only. Class names come from the editor controls.
   Hex values are written out so the Decap preview, which does not load
   style.css, still uses the brand palette. */

.resource-article .prose.lm-base-sm,
.lm-preview.lm-base-sm {
  font-size: 0.9rem;
}
.resource-article .prose.lm-base-lg,
.lm-preview.lm-base-lg {
  font-size: 1.125rem;
}
.resource-article .prose.lm-base-xl,
.lm-preview.lm-base-xl {
  font-size: 1.3rem;
}

.lm-size-sm { font-size: 0.875em; }
.lm-size-md { font-size: 1em; }
.lm-size-lg { font-size: 1.25em; }
.lm-size-xl { font-size: 1.5em; }
.lm-size { line-height: 1.65; }
.lm-size > :first-child { margin-top: 0; }
.lm-size > :last-child { margin-bottom: 0; }

.lm-color-navy { color: #0B1E35; }
.lm-color-cyan { color: #1AB6E8; }
.lm-color-gold { color: #C8952A; }
.lm-color-grey { color: #3A4A5C; }
.lm-color-default { color: inherit; }

.resource-article .prose .lm-color-navy,
.lm-preview .lm-color-navy { color: #0B1E35; }
.resource-article .prose .lm-color-cyan,
.lm-preview .lm-color-cyan { color: #1AB6E8; }
.resource-article .prose .lm-color-gold,
.lm-preview .lm-color-gold { color: #C8952A; }
.resource-article .prose .lm-color-grey,
.lm-preview .lm-color-grey { color: #3A4A5C; }
.resource-article .prose .lm-color-default,
.lm-preview .lm-color-default { color: inherit; }

/* A word colour is stored as its own short block. Keep those words on one
   line, matching the CMS preview. A paragraph colour stays a full block. */
.resource-article .prose > p:has(> span[class*="lm-color-"]:only-child) {
  display: inline;
  margin-right: 0.4rem;
}

.lm-callout {
  margin: 1.25rem 0;
  padding: 0.95rem 1.1rem;
  line-height: 1.6;
}
.lm-callout > :first-child { margin-top: 0; }
.lm-callout > :last-child { margin-bottom: 0; }

.lm-callout-navy { background: #0B1E35; color: #FFFFFF; }
.lm-callout-cyan { background: #1AB6E8; color: #0B1E35; }
.lm-callout-gold { background: #C8952A; color: #0B1E35; }
.lm-callout-grey { background: #3A4A5C; color: #FFFFFF; }
.lm-callout-default {
  background: #F4F7FA;
  color: #0B1E35;
  border-left: 3px solid #1AB6E8;
}

.resource-article .lm-callout-navy :is(p, li, h1, h2, h3, h4, strong),
.lm-preview .lm-callout-navy :is(p, li, h1, h2, h3, h4, strong) { color: #FFFFFF; }
.resource-article .lm-callout-cyan :is(p, li, h1, h2, h3, h4, strong, a),
.lm-preview .lm-callout-cyan :is(p, li, h1, h2, h3, h4, strong, a) { color: #0B1E35; }
.resource-article .lm-callout-gold :is(p, li, h1, h2, h3, h4, strong, a),
.lm-preview .lm-callout-gold :is(p, li, h1, h2, h3, h4, strong, a) { color: #0B1E35; }
.resource-article .lm-callout-grey :is(p, li, h1, h2, h3, h4, strong),
.lm-preview .lm-callout-grey :is(p, li, h1, h2, h3, h4, strong) { color: #FFFFFF; }
.resource-article .lm-callout-default :is(p, li, h1, h2, h3, h4, strong),
.lm-preview .lm-callout-default :is(p, li, h1, h2, h3, h4, strong) { color: #0B1E35; }

.resource-article .lm-callout-navy a,
.lm-preview .lm-callout-navy a,
.resource-article .lm-callout-grey a,
.lm-preview .lm-callout-grey a {
  color: #8BD4F2;
  text-decoration: underline;
}
.resource-article .lm-callout-default a,
.lm-preview .lm-callout-default a {
  color: #1493BD;
  text-decoration: underline;
}

.lm-figure {
  display: block;
  max-width: 100%;
}
.lm-figure.lm-w-sm { width: 220px; }
.lm-figure.lm-w-md { width: 420px; }
.lm-figure.lm-w-lg { width: 640px; }
.lm-figure.lm-w-full { width: 100%; }
.lm-figure.lm-align-left { margin-left: 0; margin-right: auto; }
.lm-figure.lm-align-center { margin-left: auto; margin-right: auto; }
.lm-figure.lm-align-right { margin-left: auto; margin-right: 0; }

.resource-article .prose .lm-figure,
.lm-preview .prose .lm-figure {
  margin-top: 1.25rem;
  margin-bottom: 1.25rem;
}
.resource-article .prose .lm-figure img,
.lm-preview .prose .lm-figure img {
  width: 100%;
  height: auto;
  margin: 0;
  aspect-ratio: auto;
  object-fit: contain;
  border: 1px solid #E1E6EC;
  background: #F7F8FA;
}
.resource-cover.lm-w-sm img,
.resource-cover.lm-w-md img,
.resource-cover.lm-w-lg img {
  aspect-ratio: auto;
  object-fit: contain;
  height: auto;
}
.lm-figure figcaption {
  margin-top: 0.4rem;
  font-size: 0.8125rem;
  line-height: 1.45;
  color: #6B7785;
}

.lm-preview {
  font-family: Inter, "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  color: #3A4A5C;
  font-size: 16px;
  line-height: 1.65;
  max-width: 72ch;
}
.lm-preview .prose p { margin: 0 0 0.85rem; }
.lm-preview .prose ul { list-style: disc; padding-left: 1.25rem; margin: 0.5rem 0 1rem; }
.lm-preview .prose li { margin-bottom: 0.35rem; }
.lm-preview .prose a { color: #1493BD; text-decoration: underline; }
.lm-preview .resource-cover {
  margin: 0 0 1.5rem;
  border: 1px solid #E1E6EC;
  background: #F7F8FA;
}
.lm-preview .resource-cover img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 8;
  object-fit: cover;
}
.lm-preview .resource-cover.lm-w-sm img,
.lm-preview .resource-cover.lm-w-md img,
.lm-preview .resource-cover.lm-w-lg img {
  aspect-ratio: auto;
  object-fit: contain;
  height: auto;
}