/* ============================================================
   NBF design system. Loads AFTER core.css and styles.css —
   wins by source order and specificity. NO !important.
   Settings (settings_data.json) carry colors/sizes; this file
   carries what settings cannot express.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Source+Serif+4:opsz,wght@8..60,400;8..60,600&family=Spectral:ital,wght@0,400;0,500;1,400&display=swap');

:root {
  --nbf-navy: #16233B;
  --nbf-ink: #1E2A40;
  --nbf-muted: #5E6A80;
  --nbf-link: #2C4A7C;
  --nbf-hairline: rgba(22, 35, 59, 0.14);
  --nbf-input-border: rgba(22, 35, 59, 0.35);
  --nbf-sans: -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;
}

/* ---------- Type refinement (families/sizes/colors come from settings) --- */
body#encore-theme h1, body#encore-theme h2,
body#encore-theme h3, body#encore-theme h4 {
  font-weight: 600;
  letter-spacing: -0.015em;
}
body#encore-theme h1 { line-height: 1.18; }
body#encore-theme h2 { line-height: 1.25; }

/* H5: small uppercase section label · H6: kicker/meta/fine print */
body#encore-theme h5, body#encore-theme h6 {
  font-family: var(--nbf-sans);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--nbf-muted);
}
body#encore-theme h5 { font-weight: 600; }
body#encore-theme h6 { font-weight: 400; }

body#encore-theme a { color: var(--nbf-link); }
body#encore-theme a:hover { color: var(--nbf-navy); }

/* ---------- UI elements -------------------------------------------------- */
body#encore-theme button, body#encore-theme .btn,
body#encore-theme input[type="submit"] {
  font-family: var(--nbf-sans);
  font-size: 15px;
  font-weight: 500;
  border: none;
  box-shadow: none;
}
body#encore-theme button:hover, body#encore-theme .btn:hover,
body#encore-theme input[type="submit"]:hover { background-color: var(--nbf-ink); }

body#encore-theme input, body#encore-theme select, body#encore-theme textarea {
  font-family: var(--nbf-sans);
  font-size: 15px;
  color: var(--nbf-ink);
  background-color: #FFFFFF;
  border: 1px solid var(--nbf-input-border);
  border-radius: 2px;
  box-shadow: none;
}

/* ---------- Header -------------------------------------------------------- */
body#encore-theme header, body#encore-theme .header, body#encore-theme .site-header {
  background-color: #FFFFFF;
  box-shadow: none;
  border-bottom: 1px solid var(--nbf-hairline);
}
body#encore-theme header a, body#encore-theme .header a, body#encore-theme header nav a {
  font-family: var(--nbf-sans);
  font-size: 13.5px;
  font-weight: 500;
  color: var(--nbf-navy);
  text-decoration: none;
}
body#encore-theme header nav, body#encore-theme .header nav,
body#encore-theme header ul, body#encore-theme .header ul {
  justify-content: flex-end;
  text-align: right;
  margin-left: auto;
}
body#encore-theme header img, body#encore-theme .header img { max-height: 34px; width: auto; }

/* ---------- Theme footer --------------------------------------------------- */
body#encore-theme footer, body#encore-theme .site-footer {
  background-color: var(--nbf-navy);
  border-top: none;
}
body#encore-theme footer p, body#encore-theme footer span,
body#encore-theme .site-footer p, body#encore-theme .site-footer span {
  color: rgba(255, 255, 255, 0.55);
  font-family: var(--nbf-sans);
  font-size: 12.5px;
}
body#encore-theme footer a, body#encore-theme .site-footer a {
  color: rgba(255, 255, 255, 0.75);
  font-size: 13px;
  text-decoration: none;
}
body#encore-theme footer a:hover, body#encore-theme .site-footer a:hover { color: #FFFFFF; }
body#encore-theme footer img, body#encore-theme .site-footer img {
  filter: brightness(0) invert(1);
  opacity: 0.9;
}

/* ---------- Navy surfaces (reusable) --------------------------------------- */
/* .nbf-navy is the reusable hook for any navy section. The hard-coded
   #section-1783933553108 selectors that used to sit alongside it are gone: that
   homepage-only band held the disclaimer AND the link list, and both now live in
   the global footer so every page carries the same one. Keying styles to a
   generated section id is the same fragility that left the subscriber-break
   heading navy-on-navy — don't reintroduce it. */
body#encore-theme .nbf-navy .sizer { padding-top: 56px; padding-bottom: 48px; }
body#encore-theme .nbf-navy h6 { color: rgba(255, 255, 255, 0.55); }
body#encore-theme .nbf-navy p, body#encore-theme .nbf-navy p span {
  font-family: var(--nbf-sans);
  font-size: 13.5px;
  line-height: 1.7;
  color: rgba(255, 255, 255, 0.75);
}
body#encore-theme .nbf-navy .block-type--text .block { max-width: 620px; }
body#encore-theme .nbf-navy .link-list__title { color: rgba(255, 255, 255, 0.55); }
body#encore-theme .nbf-navy .link-list__links,
body#encore-theme .footer .link-list__links {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
}
body#encore-theme .nbf-navy .link-list__link,
body#encore-theme .footer .link-list__link {
  font-family: var(--nbf-sans);
  font-size: 13px;
  color: rgba(255, 255, 255, 0.75);
  text-decoration: none;
}
body#encore-theme .nbf-navy .link-list__link:hover,
body#encore-theme .footer .link-list__link:hover { color: #FFFFFF; }

/* ---------- Footer disclaimer ---------------------------------------------- */
/* Site-wide legal notice, now a footer block rather than a homepage section. */
body#encore-theme .footer__disclaimer { max-width: 620px; }
body#encore-theme .footer__disclaimer h6,
body#encore-theme .footer .link-list__title {
  color: rgba(255, 255, 255, 0.55);
  margin-bottom: 8px;
}
body#encore-theme .footer__disclaimer p,
body#encore-theme .footer__disclaimer span {
  font-family: var(--nbf-sans);
  font-size: 12.5px;
  line-height: 1.7;
  color: rgba(255, 255, 255, 0.55);
}

/* ---------- Login: no-account prompt ------------------------------------- */
body#encore-theme .nbf-no-account {
  font-family: var(--nbf-sans);
  font-size: 14px;
  color: var(--nbf-muted);
  margin-top: 6px;
}
body#encore-theme .nbf-no-account a {
  color: var(--nbf-link);
  text-decoration: underline;
}

/* ---------- Member note ------------------------------------------------- */
body#encore-theme .nbf-subscribed-note {
  font-family: var(--nbf-sans);
  font-size: 14px;
  color: var(--nbf-muted);
}

/* ---------- Newsletter subscriber break ----------------------------------- */
/* Kajabi renders this gate server-side (the stored post body holds only an empty
   <table class="focuswriter-subscriber-break"> marker) and paints it with
   color_primary, while its heading inherits color_heading. Both settings are
   #16233B, so the h3 was navy-on-navy and effectively invisible.
   Setting the background here as well as the text means the block no longer
   depends on two unrelated settings staying different from each other — and it
   renders identically in local preview, where Kajabi's own paint is absent.
   `.subscriber-break_text` (single underscore) is Kajabi's markup sitting beside
   `.subscriber-break__text` (double); both spellings are live, so both are here. */
body#encore-theme .subscriber-break {
  background-color: var(--nbf-navy);
  border-radius: 8px;
  padding: 44px 28px;
  text-align: center;
}
body#encore-theme .subscriber-break__text {
  color: #FFFFFF;
  margin: 0 0 20px;
}
/* The gate's CTA is an <a class="btn btn-primary">, so it has no background of
   its own outside Kajabi's newsletter CSS. Own it: white pill on the navy
   surface. The explicit :hover is required — the generic .btn:hover rule above
   would otherwise turn it navy-on-navy on hover, re-creating the original bug. */
body#encore-theme .subscriber-break__button,
body#encore-theme .subscriber-break__button.btn-primary {
  display: inline-block;
  background-color: #FFFFFF;
  color: var(--nbf-navy);
  padding: 12px 30px;
  border-radius: 2px;
  text-decoration: none;
  cursor: pointer;
}
body#encore-theme .subscriber-break__button:hover,
body#encore-theme .subscriber-break__button.btn-primary:hover {
  background-color: rgba(255, 255, 255, 0.88);
  color: var(--nbf-navy);
}
body#encore-theme .subscriber-break_text,
body#encore-theme .subscriber-break_text span {
  color: rgba(255, 255, 255, 0.75);
  font-family: var(--nbf-sans);
  font-size: 14px;
}
body#encore-theme .subscriber-break__link {
  color: #FFFFFF;
  text-decoration: underline;
}
body#encore-theme .subscriber-break__link:hover { color: rgba(255, 255, 255, 0.8); }

/* ---------- Newsletter listing cards -------------------------------------- */
/* The card title ships as <a class="h5 newsletter-listing__title">. `.h5` is a
   core.css UTILITY class, while the h5 rules above target the ELEMENT — so they
   never applied here and the title kept core's small-label sizing. It's the
   headline of the card; size it like one. */
body#encore-theme .newsletter-listing__title {
  font-size: 22px;
  line-height: 1.3;
  font-weight: 600;
  letter-spacing: -0.015em;
  text-transform: none;
  color: var(--nbf-navy);
  text-decoration: none;
}
body#encore-theme .newsletter-listing__title:hover { color: var(--nbf-link); }

/* ---------- Mobile -------------------------------------------------------- */
@media (max-width: 720px) {
  body#encore-theme .newsletter-listing__title { font-size: 19px; }
  body#encore-theme header img, body#encore-theme .header img { max-height: 26px; }
  body#encore-theme button, body#encore-theme .btn,
  body#encore-theme input[type="submit"], body#encore-theme input[type="email"] { width: 100%; }
}