@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("/inter-latin.woff2") format("woff2");
}

@font-face {
  font-family: "Source Serif 4";
  font-style: normal;
  font-weight: 200 900;
  font-display: swap;
  src: url("/source-serif-4-latin.woff2") format("woff2");
}

/* MuniPro design language 2 (design hub g23, tokens.json 2.0.3): one palette,
   type and component set for every MuniPro brand; only the lockup differs. */
:root {
  color-scheme: light;
  --ink: #0c2140;
  --text: #1e293b;
  --muted: #5b6b82;
  --rule: #e2e8f0;
  --surface: #ffffff;
  --action: #0265d9;
  --action-hover: #145ec1;
  --action-pressed: #0a4ba0;
  --on-action: #ffffff;
  --focus-ring: #3d84ea;
  --gold: #dcc184;
  --font-ui: Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-display: "Source Serif 4", Georgia, serif;
  --radius-control: 6px;
  --motion-fast: 120ms;
  --ease: cubic-bezier(0.2, 0, 0, 1);

  /* DL2 header and footer (launch board frame_l14.py token_block, tokens.json 2.0.3). */
  --dl-ink: rgb(12, 33, 64);
  --dl-text: rgb(30, 41, 59);
  --dl-muted: rgb(91, 107, 130);
  --dl-rule: rgb(226, 232, 240);
  --dl-surface: rgb(255, 255, 255);
  --dl-page: rgb(247, 249, 252);
  --dl-tint: rgb(241, 245, 249);
  --dl-action: rgb(2, 101, 217);
  --dl-action-hover: rgb(20, 94, 193);
  --dl-action-pressed: rgb(10, 75, 160);
  --dl-action-soft: rgb(226, 236, 250);
  --dl-on-action: rgb(255, 255, 255);
  --dl-focus-ring: rgb(61, 132, 234);
  --dl-sapphire: rgb(1, 42, 99);
  --dl-on-sapphire: rgba(255, 255, 255, 0.88);
  --dl-chart-hero-soft: rgb(162, 200, 240);
  --dl-on-sapphire-head: var(--dl-chart-hero-soft);
  --dl-on-sapphire-rule: color-mix(in srgb, var(--dl-surface) 16%, transparent);
  --dl-scrim: color-mix(in srgb, var(--dl-sapphire) 72%, transparent);
  --dl-e1: 0 6px 18px rgba(12,33,64,.12);
  --dl-font-ui: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --dl-r-tag: 4px;
  --dl-r-control: 6px;
  --dl-r-card: 8px;
}

* {
  box-sizing: border-box;
}

html {
  min-width: 320px;
  color: var(--text);
  background: var(--surface);
}

/* www-read 16/26; tabular lining figures everywhere. */
body {
  min-width: 320px;
  min-height: 100vh;
  margin: 0;
  color: var(--text);
  background: var(--surface);
  font-family: var(--font-ui);
  font-size: 16px;
  line-height: 26px;
  font-variant-numeric: tabular-nums lining-nums;
}

a {
  color: var(--action);
  text-decoration-thickness: 0.08em;
  text-underline-offset: 0.18em;
}

main a:hover {
  color: var(--action-hover);
}

/* Focus ring: opaque, 2 px with a 2 px offset (3:1 on every DL2 ground). */
a:focus-visible,
summary:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}

/* The page body sits in the header's 1200 px container (24 px sides, 16 on a phone), so its
   left edge is the lockup's. It fills the first viewport, so the footer and its button start
   below the fold (one filled control per viewport). */
.pg {
  min-height: calc(100vh - 56px);
  min-height: calc(100svh - 56px);
}

.pg__in {
  max-width: 1200px;
  margin: 0 auto;
  padding: 64px 16px;
}

.hero,
.request,
.not-found {
  max-width: 560px;
}

/* Eyebrow 12/16 muted, then the gold 48 x 3 rule over the display title. */
.eyebrow {
  position: relative;
  margin: 0 0 24px;
  padding-bottom: 15px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
}

.eyebrow::after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 48px;
  height: 3px;
  background: var(--gold);
  content: "";
}

h1,
h2 {
  margin: 0;
  color: var(--ink);
  font-family: var(--font-display);
  font-weight: 600;
  letter-spacing: -0.01em;
  text-wrap: balance;
}

/* www-hero 56/64, 36/44 on a phone. */
h1 {
  font-size: 36px;
  line-height: 44px;
}

/* www-section 36/44, serif-display 28/34 on a phone. */
h2 {
  font-size: 28px;
  line-height: 34px;
}

/* serif-finding 20/28: the one sentence the page exists to say. */
.subhead {
  max-width: 34rem;
  margin: 24px 0 0;
  font-family: var(--font-display);
  font-size: 20px;
  line-height: 28px;
}

.request {
  margin-top: 64px;
}

.request > p {
  max-width: 35rem;
  margin: 16px 0 0;
}

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  margin-top: 24px;
  padding: 10px 20px;
  border: 0;
  border-radius: var(--radius-control);
  color: var(--on-action);
  background: var(--action);
  font-weight: 600;
  line-height: 24px;
  text-align: center;
  text-decoration: none;
  transition: background-color var(--motion-fast) var(--ease);
}

main .button:hover {
  color: var(--on-action);
  background: var(--action-hover);
}

.button:active {
  background: var(--action-pressed);
}

/* t-body 14/21. */
.privacy {
  font-size: 14px;
  line-height: 21px;
}

.not-found {
  min-height: 35vh;
}

/* The header is 64 px tall from 1024 px (56 px below, with the phone Menu). */
@media (min-width: 1024px) {
  .pg {
    min-height: calc(100vh - 64px);
    min-height: calc(100svh - 64px);
  }
}

@media (min-width: 640px) {
  .pg__in {
    padding: 96px 24px;
  }

  h1 {
    font-size: 56px;
    line-height: 64px;
  }

  h2 {
    font-size: 36px;
    line-height: 44px;
  }

  .request {
    margin-top: 96px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .button {
    transition: none;
  }
}

/* ---- DL2 header and footer: COMPONENT_CSS from the launch board's frame_l14.py, copied
   unscoped, with the family header (DL2_HEADER, hub spec g29 "Header across the family",
   feed 1dc93a): the five family items at t-cell 13/20 with 24 px gaps, Book a demo, and the
   phone Menu below 1024 px (see the media blocks at the end). ---- */

/* shared */
.dl-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.dl-lockup { display: block; width: auto; flex: none; }
.dl-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 36px; padding: 0 16px; border: 0; border-radius: var(--dl-r-control); font-family: var(--dl-font-ui); font-size: 14px; line-height: 20px; font-weight: 600; letter-spacing: 0; text-transform: none; text-decoration: none; white-space: nowrap; cursor: pointer; }
.dl-btn--primary { background: var(--dl-action); color: var(--dl-on-action); }
.dl-btn--primary:hover { background: var(--dl-action-hover); }
.dl-btn--primary:active { background: var(--dl-action-pressed); }
.dl-btn--on-dark { background: var(--dl-surface); color: var(--dl-sapphire); }
.dl-btn--on-dark:hover { background: var(--dl-action-soft); }
.dl-btn--block { display: flex; width: 100%; height: 44px; }
.dl-hdr a:focus-visible, .dl-hdr summary:focus-visible, .dl-notice a:focus-visible, .dl-ftr a:focus-visible, .dl-ftr summary:focus-visible { outline: 2px solid var(--dl-focus-ring); outline-offset: 2px; }
.dl-chev { display: block; flex: none; }
.dl-hdr summary, .dl-ftr summary { list-style: none; }
.dl-hdr summary::-webkit-details-marker, .dl-ftr summary::-webkit-details-marker { display: none; }

/* port: the components set type as the board does, without the page body's tabular figures
   (Inter's tnum also widens the hyphen: "teach-in", "municipal-finance") */
.dl-hdr, .dl-ftr { font-variant-numeric: normal; }

/* header, 1200 px and up: 64 tall, white, 1 px rule, sticky, no shrink */
.dl-hdr { position: sticky; top: 0; z-index: 100; height: 64px; background: var(--dl-surface); border-bottom: 1px solid var(--dl-rule); font-family: var(--dl-font-ui); }
.dl-hdr[data-scrolled="true"] { box-shadow: var(--dl-e1); }
.dl-hdr__in { display: flex; align-items: center; height: 100%; max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.dl-hdr__home { display: flex; align-items: center; flex: none; margin-right: 40px; border-radius: var(--dl-r-control); }
.dl-hdr__home .dl-lockup { height: 28px; }
.dl-nav { align-self: stretch; min-width: 0; }
.dl-nav__list { display: flex; align-items: stretch; gap: 24px; height: 100%; margin: 0; padding: 0; list-style: none; }
.dl-nav__list > li { position: relative; display: flex; }
.dl-nav__a { position: relative; display: flex; align-items: center; gap: 4px; height: 100%; font-size: 13px; line-height: 20px; font-weight: 500; color: var(--dl-text); text-decoration: none; white-space: nowrap; cursor: pointer; }
.dl-nav__t { display: block; }
.dl-nav__a:hover { color: var(--dl-ink); }
.dl-nav__a:hover .dl-nav__t { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.dl-nav__a[aria-current="page"] { color: var(--dl-ink); }
.dl-nav__a[aria-current="page"]::after { content: ""; position: absolute; left: 0; right: 0; bottom: 4.5px; height: 2px; background: var(--dl-action); }
.dl-dd { position: relative; display: flex; }
.dl-dd > summary { height: 63px; }
.dl-dd[open] > summary { color: var(--dl-ink); }
.dl-dd[open] > summary .dl-chev { transform: rotate(180deg); }
.dl-dd__list { position: absolute; top: 100%; left: -16px; z-index: 110; min-width: 224px; margin: 0; padding: 8px 0; list-style: none; background: var(--dl-surface); border: 1px solid var(--dl-rule); border-radius: var(--dl-r-card); box-shadow: var(--dl-e1); }
.dl-dd__list a { display: flex; align-items: center; height: 40px; padding: 0 16px; font-size: 14px; line-height: 20px; font-weight: 500; color: var(--dl-text); text-decoration: none; white-space: nowrap; }
.dl-dd__list a:hover { background: var(--dl-tint); color: var(--dl-ink); text-decoration: underline; text-underline-offset: 4px; }
.dl-hdr__acts { display: flex; align-items: center; gap: 24px; flex: none; margin-left: auto; }
.dl-hdr__signin { font-size: 14px; line-height: 20px; font-weight: 500; color: var(--dl-text); text-decoration: none; border-radius: var(--dl-r-control); }
.dl-hdr__signin:hover { color: var(--dl-ink); text-decoration: underline; text-underline-offset: 4px; }
/* quiet: the page hero carries its own filled button, so the header primary goes outline (one filled control per viewport) */
.dl-hdr[data-cta="quiet"] .dl-hdr__acts .dl-btn--primary { background: transparent; color: var(--dl-action); box-shadow: inset 0 0 0 1px var(--dl-action); }
.dl-hdr[data-cta="quiet"] .dl-hdr__acts .dl-btn--primary:hover { background: var(--dl-action-soft); }

/* the phone Menu (below 1024 px): a details element, so its expanded state is native and no script runs
   (the CSP allows no script) */
.dl-mm { display: none; flex: none; margin-left: 8px; }
.dl-mm__btn { display: flex; align-items: center; gap: 8px; min-width: 44px; height: 44px; margin-right: -12px; padding: 0 12px; border-radius: var(--dl-r-control); font-size: 14px; line-height: 20px; font-weight: 600; color: var(--dl-ink); cursor: pointer; }
.dl-mm__g { display: block; flex: none; }
.dl-mm__g--close, .dl-mm[open] .dl-mm__g--open { display: none; }
.dl-mm[open] .dl-mm__g--close { display: block; }
/* the Menu ring shows for keyboard focus only, never after a tap */
.dl-mm__btn:focus:not(:focus-visible) { outline: none; }
/* closed details content is contained (content-visibility), so it would lay out against the summary: keep it out of layout */
.dl-mm:not([open]) .dl-sheet, .dl-mm:not([open]) .dl-scrim, .dl-dd:not([open]) > .dl-dd__list { display: none; }
.dl-scrim { position: absolute; top: calc(100% + 1px); left: 0; right: 0; z-index: 115; height: calc(100dvh - 56px); background: var(--dl-scrim); }
.dl-sheet { position: absolute; top: calc(100% + 1px); left: 0; right: 0; z-index: 120; display: flex; flex-direction: column; max-width: 420px; height: calc(100dvh - 56px); margin-left: auto; overflow-y: auto; background: var(--dl-surface); }
.dl-sheet__list, .dl-sub ul { margin: 0; padding: 0; list-style: none; }
.dl-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 48px; padding: 0 16px; border-bottom: 1px solid var(--dl-rule); font-size: 16px; line-height: 24px; font-weight: 500; color: var(--dl-text); text-decoration: none; cursor: pointer; }
.dl-row .dl-chev { color: var(--dl-muted); }
/* the current site's row: ink 600 with a 3 px action bar at the left edge */
.dl-row[aria-current="page"] { color: var(--dl-ink); font-weight: 600; box-shadow: inset 3px 0 0 var(--dl-action); }
.dl-row:hover { background: var(--dl-tint); color: var(--dl-ink); }
.dl-hdr .dl-row:focus-visible { outline-offset: -2px; }
.dl-sub[open] > summary .dl-chev { transform: rotate(180deg); }
.dl-sub ul .dl-row { padding-left: 32px; }
.dl-sheet__fam { padding: 16px 16px 0; }
.dl-sheet__h { margin: 0 0 8px; font-size: 11px; line-height: 16px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--dl-muted); }
.dl-sheet .dl-fam { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dl-sheet .dl-fam__lk { height: 44px; }
.dl-sheet .dl-fam__i.is-here .dl-fam__lk { height: 28px; }
.dl-sheet .dl-fam__here { color: var(--dl-muted); }
.dl-sheet__cta { position: sticky; bottom: 0; margin-top: auto; padding: 16px; background: var(--dl-surface); }

/* the Texas site only: its not-official line, a tint strip directly under the header */
.dl-notice { background: var(--dl-tint); border-bottom: 1px solid var(--dl-rule); font-family: var(--dl-font-ui); }
.dl-notice__in { max-width: 1200px; min-height: 32px; margin: 0 auto; padding: 8px 24px; font-size: 12px; line-height: 16px; color: var(--dl-text); }
.dl-notice__in a { color: var(--dl-action); text-decoration: underline; text-underline-offset: 2px; }

/* the family row (footer and phone sheet) */
.dl-fam { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
.dl-fam__i { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; min-width: 0; }
.dl-fam__lk { display: flex; align-items: center; height: 32px; border-radius: var(--dl-r-control); }
.dl-fam__lk .dl-lockup { height: 20px; }
.dl-fam__here { font-size: 11px; line-height: 16px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--dl-on-sapphire); }
.dl-fam__tags { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.dl-chip { display: inline-flex; align-items: center; padding: 2px 8px; border: 1px solid var(--dl-on-sapphire-head); border-radius: var(--dl-r-tag); font-size: 12px; line-height: 16px; font-weight: 500; color: var(--dl-on-sapphire-head); white-space: nowrap; }

/* footer: sapphire ground, four rows plus Talk to us, on the 12-column banker grid */
.dl-ftr { background: var(--dl-sapphire); color: var(--dl-on-sapphire); font-family: var(--dl-font-ui); }
.dl-ftr__in { max-width: 1200px; margin: 0 auto; padding: 48px 24px 32px; }
.dl-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 16px; }
.dl-ftr__row + .dl-ftr__row { margin-top: 32px; padding-top: 32px; border-top: 1px solid var(--dl-on-sapphire-rule); }
.dl-ftr__lead { align-items: center; }
.dl-ftr__home { grid-column: 1 / span 3; justify-self: start; display: flex; align-items: center; border-radius: var(--dl-r-control); }
.dl-ftr__home .dl-lockup { height: 28px; }
.dl-ftr__promise { grid-column: 4 / span 6; margin: 0; font-size: 16px; line-height: 24px; font-weight: 400; color: var(--dl-on-sapphire); }
.dl-ftr__lead .dl-btn { grid-column: 10 / span 3; justify-self: end; }
.dl-ftr__col { grid-column: span 3; min-width: 0; }
.dl-ftr__head { margin: 0 0 12px; font-family: var(--dl-font-ui); font-size: 11px; line-height: 16px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--dl-on-sapphire-head); }
.dl-ftr__links { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; font-size: 14px; line-height: 20px; }
.dl-ftr__inline { font-size: 14px; line-height: 20px; }
.dl-ftr__links a, .dl-ftr__links span, .dl-ftr__inline a { font-size: 14px; line-height: 20px; color: var(--dl-on-sapphire); text-decoration: none; }
.dl-ftr a:hover { text-decoration: underline; text-underline-offset: 3px; }
.dl-ftr__colsm { display: none; }
.dl-ftr__inline { display: flex; flex-wrap: wrap; gap: 8px 32px; margin: 0; padding: 0; list-style: none; }
.dl-ftr__legal { display: grid; gap: 8px; font-size: 12px; line-height: 16px; color: var(--dl-on-sapphire); }
.dl-ftr__legal p { margin: 0; max-width: 960px; }
.dl-ftr__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 24px; }
.dl-ftr__inline--legal { gap: 8px 24px; }
.dl-ftr__inline--legal a { font-size: 12px; line-height: 16px; text-decoration: underline; text-underline-offset: 2px; }

/* below 1024 px (hub spec g29): the 56 px bar keeps the lockup and Book a demo; the five
   family items move into the Menu sheet, never a smaller nav text */
@media (max-width: 1023.98px) {
  .dl-hdr { height: 56px; }
  .dl-hdr__in { padding: 0 16px; }
  .dl-hdr__home { margin-right: 12px; }
  .dl-hdr__home .dl-lockup { height: 24px; }
  .dl-hdr__acts .dl-btn { padding: 0 12px; }
  .dl-nav { display: none; }
  .dl-mm { display: block; }
  .dl-notice__in { padding: 8px 16px; }
}
/* below 390 px the Menu word is read, not drawn, and below 360 px the lockup is 20 px tall,
   so the bar holds one row down to 320 px */
@media (max-width: 389.98px) {
  .dl-hdr__home { margin-right: 8px; }
  .dl-mm { margin-left: 4px; }
  .dl-mm__btn { justify-content: center; padding: 0; width: 44px; margin-right: -10px; }
  .dl-mm__t { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
}
@media (max-width: 359.98px) {
  .dl-hdr__home .dl-lockup { height: 20px; }
}
/* below 1100 px: the footer on six columns */
@media (max-width: 1099.98px) {
  .dl-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .dl-ftr__home { grid-column: 1 / span 3; }
  .dl-ftr__lead .dl-btn { grid-column: 4 / span 3; }
  .dl-ftr__promise { grid-column: 1 / -1; grid-row: 2; margin-top: 16px; }
  .dl-ftr__col { grid-column: span 3; margin-bottom: 24px; }
  .dl-fam { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
/* below 640 px: rows stack, link columns become disclosures, the family wraps two a row */
@media (max-width: 639.98px) {
  .dl-ftr__in { padding: 32px 16px 24px; }
  .dl-grid { grid-template-columns: minmax(0, 1fr); }
  .dl-ftr__lead { row-gap: 16px; }
  .dl-ftr__home, .dl-ftr__promise, .dl-ftr__lead .dl-btn { grid-column: 1; grid-row: auto; margin-top: 0; }
  .dl-ftr__lead .dl-btn { justify-self: stretch; height: 44px; }
  .dl-ftr__cols { display: none; }
  .dl-ftr__colsm { display: block; }
  .dl-ftr__row.dl-ftr__colsm { padding-top: 16px; }
  .dl-ftr__colsm + .dl-ftr__row { border-top: 0; }
  .dl-ftr__sum { display: flex; align-items: center; justify-content: space-between; min-height: 48px; border-bottom: 1px solid var(--dl-on-sapphire-rule); cursor: pointer; }
  .dl-ftr__sum .dl-ftr__head { margin: 0; }
  .dl-ftr__sum .dl-chev { color: var(--dl-on-sapphire-head); }
  .dl-ftr__dis[open] > summary .dl-chev { transform: rotate(180deg); }
  .dl-ftr__dis .dl-ftr__links { gap: 0; padding: 4px 0 12px; border-bottom: 1px solid var(--dl-on-sapphire-rule); }
  .dl-ftr__dis .dl-ftr__links a, .dl-ftr__dis .dl-ftr__links span { display: flex; align-items: center; min-height: 44px; }
  .dl-ftr__inline { flex-direction: column; gap: 0; }
  .dl-ftr__talk .dl-ftr__inline a { display: flex; align-items: center; min-height: 44px; }
  .dl-fam { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dl-fam__lk { height: 44px; }
  .dl-fam__i.is-here .dl-fam__lk { height: 28px; }
  .dl-ftr__inline--legal { flex-direction: row; gap: 8px 24px; }
}
