/* Shared type scale. Load after page styles; use the same roles on every route. */
:root {
  --lk-font: "Lato", Arial, sans-serif;
  --lk-heading-ink: #071523;
  --lk-heading-blue: #6494cf;
  --lk-text: #52677a;
  --lk-page-size: clamp(38px, 4.5vw, 60px);
  --lk-section-size: clamp(30px, 3vw, 40px);
  --lk-card-size: clamp(22px, 2vw, 28px);
  --lk-body-size: 16px;
  --lk-lead-size: 18px;
  --lk-small-size: 13px;
}

#main { font-family: var(--lk-font); }
#main :is(h1, h2, h3, h4) {
  font-family: var(--lk-font);
  font-weight: 900;
  color: var(--lk-heading-ink);
}
#main h1 {
  font-size: var(--lk-page-size);
  line-height: 1.12;
  letter-spacing: -.035em;
  text-transform: uppercase;
}
#main h2 {
  font-size: var(--lk-section-size);
  line-height: 1.15;
  letter-spacing: -.035em;
  text-transform: uppercase;
}
#main h3 {
  font-size: var(--lk-card-size);
  line-height: 1.25;
  letter-spacing: -.02em;
  text-transform: none;
}
#main :is(h1, h2, h3, h4) .heading-accent,
#main h1 span,
#main .audience-panel h3 span,
#main .lk-tools-catalog h2 span {
  color: var(--lk-heading-blue);
}
/* These are cards and interface headings, rather than new page sections. */
#main .contact-options h2 { font-size: var(--lk-card-size); }
#main .platform-logo-shell h3 { font-size: 18px; line-height: 1.25; }
#main .knowledge-finder :is(h3, h4) {
  font-size: 20px;
  line-height: 1.4;
  letter-spacing: normal;
  text-transform: none;
}
#main .kf-card h4 { font-size: 18px; }
#main .kf-filter-heading h4 { font-size: 16px; }
#main .kf-dialog h3 { font-size: 24px; }

#main:not(.planner-main) p {
  font-size: var(--lk-body-size);
  line-height: 1.65;
}
#main:not(.planner-main) :is(.hero-lead, .lk-tools-lead, .about-lead),
#main .portal-intro .portal-width > p:last-child,
#main .kf-heading p:not(.eyebrow) {
  font-size: var(--lk-lead-size);
  line-height: 1.65;
  color: var(--lk-text);
}
#main :is(.section-heading, .partner-heading, .offer, .partner-card, .audience-panel, .contact-options, .portal-story, .lk-tool-copy, .lk-knowledge-link, .contact-actions) > p:not(.eyebrow):not(.audience-label) {
  color: var(--lk-text);
}
#main:not(.planner-main) :is(.eyebrow, .audience-label),
#main .lk-knowledge-link .eyebrow,
#main .lk-tool-badge,
#main .contact-options article > span {
  font-size: 12px;
  font-weight: 900;
  line-height: 1.5;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #386da8;
}
#main:not(.planner-main) :is(.private-note, .lk-private, .kf-private-note, .audience-detail, .lk-tool-small, .kf-source, .kf-filter-note, .kf-detail-source, .kf-external-note, .kf-meta),
#main :is(#kf-result-count, #kf-page-count) {
  font-size: var(--lk-small-size);
  line-height: 1.5;
}
#main :is(.portal-breadcrumb, .lk-breadcrumb, .planner-breadcrumb) {
  font-size: 12px;
  line-height: 1.5;
}
#main :is(.button, .kf-button) { font-size: 14px; line-height: 1.4; }
#main .lk-tool-features { font-size: 16px; line-height: 1.65; }
#main .kf-topic strong { font-size: 16px; line-height: 1.35; }
#main .kf-topic-description { font-size: 14px; line-height: 1.45; }
#main .kf-card-actions :is(a, button) { font-size: 14px; }
#main .kf-tags button { font-size: 12px; }
#main .knowledge-finder :is(select, .kf-field, legend, .kf-check) { font-size: 14px; }
#main .kf-topic-check { top: 18px; right: 16px; }
#main .lk-catalog-heading { gap: 20px; flex-wrap: wrap; }
#main .lk-catalog-heading > span { flex-shrink: 0; font-size: 13px; }
#main .lk-knowledge-link > div { min-width: 0; }
#main .lk-knowledge-link > .button { flex-shrink: 0; }
#main .reach-intro h2 { max-width: none; }

/* The working planner uses compact, normal-case panel labels, not hero text. */
#main.planner-main .page-heading { gap: 20px; flex-wrap: wrap; }
#main.planner-main .page-heading p { font-size: var(--lk-lead-size); line-height: 1.65; color: var(--lk-text); }
#main.planner-main .eyebrow { font-size: 12px; line-height: 1.5; color: #386da8; }
#main.planner-main :is(h2, h3, h4) {
  font-size: 16px;
  line-height: 1.4;
  letter-spacing: normal;
  text-transform: none;
}
#main.planner-main .section-title h2 { font-size: 13px; color: var(--lk-heading-blue); }
#main.planner-main .section-title h2 span { font-size: 16px; color: var(--lk-heading-ink); }
#main.planner-main .right-panel > .section-title h2 { font-size: 16px; color: var(--lk-heading-ink); }
#main.planner-main :is(label, .planner-guide, .micro, .empty-selection p, .note p) {
  font-size: 12px;
  line-height: 1.5;
}

@media (max-width: 600px) {
  :root { --lk-lead-size: 16px; }
  #main .platform-logo-shell h3 { font-size: 16px; }
  #main .lk-tool-features { font-size: 14px; }
  #main .lk-knowledge-link { align-items: stretch; }
}