/* Bank for Good design refresh (2026), Lovable-inspired look.
   Everything is scoped to body.bfg-refresh so it only applies when the refresh is switched on. */

body.bfg-refresh {
  --bfg-bg: #f9f6f0;
  --bfg-fg: #122b27;
  --bfg-primary: #35bf99;
  --bfg-primary-fg: #091f1b;
  --bfg-mint: #aee6d4;
  --bfg-border: #c4d4cd;
  --bfg-card: #fefefc;
  --bfg-muted: #eeeae1;
  --bfg-muted-fg: #52625e;
  --bfg-lavender: #a1aefb;
  --bfg-pink: #fbb7c8;
  --bfg-yellow: #fbb62a;
  --bfg-display: 'Bricolage Grotesque', 'DM Sans', system-ui, sans-serif;
  --bfg-text: 'DM Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  background: var(--bfg-bg);
  color: var(--bfg-fg);
  font-family: var(--bfg-text);
  -webkit-font-smoothing: antialiased;
}

/* ---------- Type ---------- */
body.bfg-refresh .font-nimbus,
body.bfg-refresh .font-nimbus-ext,
body.bfg-refresh p,
body.bfg-refresh li,
body.bfg-refresh input,
body.bfg-refresh select,
body.bfg-refresh textarea,
body.bfg-refresh button {
  font-family: var(--bfg-text);
}
body.bfg-refresh h1,
body.bfg-refresh h2,
body.bfg-refresh h3,
body.bfg-refresh h4,
body.bfg-refresh .h4,
body.bfg-refresh .is-style-heading-primary,
body.bfg-refresh .is-style-heading-secondary,
body.bfg-refresh .wp-block-heading {
  font-family: var(--bfg-display) !important;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.04;
  text-transform: none;
  font-style: normal;
}
body.bfg-refresh h1,
body.bfg-refresh .is-style-heading-primary {
  font-size: clamp(2.5rem, 6.2vw, 5.25rem);
}
body.bfg-refresh h2,
body.bfg-refresh .is-style-heading-secondary {
  font-size: clamp(2rem, 4.4vw, 3.6rem);
}
body.bfg-refresh h3 { font-size: clamp(1.5rem, 2.6vw, 2.25rem); }
body.bfg-refresh h4, body.bfg-refresh .h4 { font-size: 1.35rem; font-weight: 700; }
body.bfg-refresh .rte p,
body.bfg-refresh .text p { line-height: 1.6; }
body.bfg-refresh a { text-underline-offset: 3px; }

/* Highlighted word (theme uses a circled italic): green underline like the mock */
body.bfg-refresh .format-circle {
  font-family: inherit !important;
  font-style: normal !important;
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
  box-shadow: inset 0 -0.16em 0 var(--bfg-primary);
}
body.bfg-refresh .format-circle::before,
body.bfg-refresh .format-circle::after { display: none !important; }

/* Small uppercase eyebrow labels */
body.bfg-refresh .path-label {
  display: inline-block;
  background: transparent !important;
  color: var(--bfg-fg) !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  font: 700 0.75rem/1.2 var(--bfg-text) !important;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 0.9rem;
}

/* ---------- Buttons ---------- */
body.bfg-refresh .header-btn,
body.bfg-refresh .teal-btn,
body.bfg-refresh a.Button,
body.bfg-refresh button.Button,
body.bfg-refresh .wp-block-button__link,
body.bfg-refresh .gform_wrapper .gform_footer input[type=submit],
body.bfg-refresh .gform_wrapper .gform_button {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  min-height: 52px;
  padding: 0.85rem 1.4rem !important;
  background: var(--bfg-primary) !important;
  color: var(--bfg-primary-fg) !important;
  border: 2px solid var(--bfg-primary) !important;
  border-radius: 3px !important;
  font: 700 1rem/1.2 var(--bfg-text) !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  text-decoration: none !important;
  box-shadow: none !important;
  transition: background-color .15s ease, border-color .15s ease, transform .15s ease;
}
body.bfg-refresh .header-btn::after,
body.bfg-refresh .teal-btn::after,
body.bfg-refresh a.Button::after,
body.bfg-refresh .wp-block-button__link::after {
  content: "\2197";
  font-weight: 700;
  font-size: 1rem;
  line-height: 1;
}
body.bfg-refresh .header-btn:hover,
body.bfg-refresh .teal-btn:hover,
body.bfg-refresh a.Button:hover,
body.bfg-refresh .wp-block-button__link:hover {
  background: #2aa886 !important;
  border-color: #2aa886 !important;
}
body.bfg-refresh .header-btn:focus-visible,
body.bfg-refresh .teal-btn:focus-visible,
body.bfg-refresh a.Button:focus-visible,
body.bfg-refresh .wp-block-button__link:focus-visible {
  outline: 3px solid var(--bfg-fg);
  outline-offset: 3px;
}
/* Secondary: outlined */
body.bfg-refresh .btn-secondary,
body.bfg-refresh a.header-btn.btn-secondary {
  background: transparent !important;
  color: var(--bfg-fg) !important;
  border: 2px solid var(--bfg-fg) !important;
}
body.bfg-refresh .btn-secondary:hover { background: rgba(18, 43, 39, .06) !important; }

/* ---------- Header ---------- */
body.bfg-refresh .Header {
  background: var(--bfg-bg) !important;
  color: var(--bfg-fg) !important;
}
body.bfg-refresh .Header > .container {
  border-bottom: 2px solid var(--bfg-fg);
}
/* Logo: the theme's serif logo is swapped for the new mark and wordmark. */
body.bfg-refresh .Header a[title="Bank for Good"],
body.bfg-refresh .Footer a[title="Bank for Good"],
body.bfg-refresh .MobileHeader .flex-1 > a {
  display: inline-flex !important;
  align-items: center;
  gap: 10px;
  text-decoration: none !important;
  color: var(--bfg-fg) !important;
}
body.bfg-refresh .MobileHeader .flex-1 > a { color: var(--bfg-bg) !important; }
body.bfg-refresh .Header a[title="Bank for Good"] > svg.Logo,
body.bfg-refresh .Footer a[title="Bank for Good"] > svg.Logo,
body.bfg-refresh .MobileHeader .flex-1 > a > svg.Logo { display: none !important; }
body.bfg-refresh .Header a[title="Bank for Good"]::before,
body.bfg-refresh .Footer a[title="Bank for Good"]::before,
body.bfg-refresh .MobileHeader .flex-1 > a::before {
  content: "";
  flex: none;
  width: 29px;
  height: 34px;
  background: url("logo-mark.svg") no-repeat center / contain;
}
body.bfg-refresh .Header a[title="Bank for Good"]::after,
body.bfg-refresh .Footer a[title="Bank for Good"]::after,
body.bfg-refresh .MobileHeader .flex-1 > a::after {
  content: "bank for\A good.";
  content: "bank for\A good." / "";
  white-space: pre;
  font: 800 20px/18px var(--bfg-display) !important;
  letter-spacing: 0;
  text-transform: none;
  color: inherit;
}
/* The mobile menu logo link has no title, so its visible words name it. */
body.bfg-refresh .MobileHeader .flex-1 > a::after { content: "bank for\A good."; }
body.bfg-refresh .Header a,
body.bfg-refresh .Header button { color: var(--bfg-fg) !important; }
body.bfg-refresh .Header ul.font-nimbus-ext {
  text-transform: none !important;
  font: 600 0.98rem/1.2 var(--bfg-text) !important;
}
body.bfg-refresh .Header-submenu {
  background: var(--bfg-card) !important;
  border: 2px solid var(--bfg-fg);
  border-radius: 3px;
  box-shadow: 0 8px 28px rgba(18, 43, 39, .08) !important;
}
body.bfg-refresh .Header .header-btn { min-height: 44px; padding: 0.6rem 1rem !important; font-size: 0.92rem !important; }

/* ---------- Section colours ---------- */
body.bfg-refresh .bg-blue { background-color: var(--bfg-primary) !important; color: var(--bfg-fg) !important; }
body.bfg-refresh .bg-pink { background-color: var(--bfg-pink) !important; color: var(--bfg-fg) !important; }
body.bfg-refresh .bg-tan { background-color: var(--bfg-bg) !important; }
body.bfg-refresh .bg-white { background-color: var(--bfg-bg) !important; }
body.bfg-refresh .bg-darkteal { background-color: var(--bfg-fg) !important; color: var(--bfg-bg) !important; }
body.bfg-refresh .bg-darkteal h2,
body.bfg-refresh .bg-darkteal h3,
body.bfg-refresh .bg-darkteal .text-lightteal { color: var(--bfg-bg) !important; }

/* Buttons sitting on a green section: mint, as in the mock */
body.bfg-refresh .bg-blue .header-btn:not(.btn-secondary),
body.bfg-refresh .bg-blue a.Button {
  background: var(--bfg-mint) !important;
  border-color: var(--bfg-mint) !important;
}

/* ---------- Homepage: hero ---------- */
body.bfg-refresh .home-hero {
  background-image: none !important;
  background-color: var(--bfg-bg) !important;
  padding: clamp(3rem, 7vw, 6.5rem) 0 clamp(2.5rem, 5vw, 4.5rem) !important;
}
body.bfg-refresh .home-hero h1,
body.bfg-refresh .home-hero h1 p { color: var(--bfg-fg) !important; margin: 0; }
body.bfg-refresh .home-hero .md\:w-2\/3 { max-width: 62rem; width: 100%; }
body.bfg-refresh .home-hero .hero-sub-head,
body.bfg-refresh .home-hero .hero-sub-head p {
  color: var(--bfg-muted-fg) !important;
  font-size: clamp(1.05rem, 1.6vw, 1.3rem);
  line-height: 1.55;
  max-width: 44rem;
}
body.bfg-refresh .home-hero .hero-sub-head strong { color: var(--bfg-fg); }
body.bfg-refresh .home-hero .header-btn { margin-top: 2rem; }

/* ---------- Homepage: "Check your bank" (mint card) ---------- */
body.bfg-refresh .find-ethical-bank-section:not(.bfg-move) { background: var(--bfg-bg) !important; }
body.bfg-refresh .find-ethical-bank-section:not(.bfg-move) > .container {
  background: var(--bfg-mint);
  border-top: 3px solid var(--bfg-fg);
  padding: clamp(1.75rem, 4vw, 3.5rem) !important;
  margin-top: 0;
  margin-bottom: clamp(2rem, 4vw, 3.5rem);
}
body.bfg-refresh .find-ethical-bank-section:not(.bfg-move) h2 { color: var(--bfg-fg) !important; margin: 0 0 0.75rem; }
body.bfg-refresh .find-ethical-bank-section:not(.bfg-move) .path-desc,
body.bfg-refresh .find-ethical-bank-section:not(.bfg-move) .subtitle { color: var(--bfg-fg) !important; font-size: 1.05rem; line-height: 1.55; }
body.bfg-refresh .find-ethical-bank-section:not(.bfg-move) .input-bank {
  background: var(--bfg-card) !important;
  border: 2px solid var(--bfg-fg) !important;
  border-radius: 3px !important;
  color: var(--bfg-fg) !important;
  font: 500 1.05rem/1.3 var(--bfg-text) !important;
  padding: 1rem 1.1rem !important;
  box-shadow: none !important;
}
body.bfg-refresh .find-ethical-bank-section:not(.bfg-move) .input-bank:focus { outline: 3px solid var(--bfg-primary); outline-offset: 2px; }
body.bfg-refresh .find-ethical-bank-section:not(.bfg-move) .suggestions-list {
  border: 2px solid var(--bfg-fg); border-top: 0; background: var(--bfg-card) !important; z-index: 20;
}
body.bfg-refresh .find-ethical-bank-section:not(.bfg-move) .result-funding,
body.bfg-refresh .find-ethical-bank-section:not(.bfg-move) .result-description { color: var(--bfg-fg) !important; }

/* ---------- Homepage: green statement section ---------- */
body.bfg-refresh .simple-section.bg-blue h2 { color: var(--bfg-fg) !important; max-width: 52rem; }
body.bfg-refresh .simple-section.bg-blue .text { color: var(--bfg-fg) !important; max-width: 46rem; }
body.bfg-refresh .simple-section .link.header-btn { margin: 0 0.75rem 0.75rem 0; }

/* ---------- Homepage: values (numbered rows on green) ---------- */
body.bfg-refresh .good-bank {
  background: var(--bfg-primary) !important;
  background-image: none !important;
  padding: 0 0 clamp(3rem, 6vw, 5rem) !important;
  counter-reset: bfgval;
}
body.bfg-refresh .good-bank > h3,
body.bfg-refresh .good-bank > h3 p {
  color: var(--bfg-fg) !important;
  text-align: left !important;
  max-width: none !important;
  font-size: 0.8rem !important;
  font-family: var(--bfg-text) !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}
body.bfg-refresh .good-bank > h3 { width: 100%; max-width: 1280px !important; padding: 0 1.25rem; margin: 0 auto 1rem !important; }
body.bfg-refresh .good-bank .grid { display: block !important; }
body.bfg-refresh .good-bank .card {
  counter-increment: bfgval;
  display: grid;
  grid-template-columns: 4.5rem 1fr;
  column-gap: 1.5rem;
  align-items: start;
  border-top: 2px solid var(--bfg-fg);
  padding: 1.6rem 0;
  background: transparent !important;
}
body.bfg-refresh .good-bank .card:last-child { border-bottom: 2px solid var(--bfg-fg); }
body.bfg-refresh .good-bank .card::before {
  content: counter(bfgval, decimal-leading-zero);
  grid-row: 1 / span 2;
  font: 800 clamp(2rem, 4vw, 2.75rem)/1 var(--bfg-display);
  color: var(--bfg-fg);
}
body.bfg-refresh .good-bank .cta-item { display: none !important; }
body.bfg-refresh .good-bank .card h4 {
  color: var(--bfg-fg) !important;
  padding-top: 0.2rem !important;
  text-transform: none;
  font-size: clamp(1.35rem, 2.4vw, 1.8rem) !important;
}
body.bfg-refresh .good-bank .card h4::first-letter { text-transform: uppercase; }
body.bfg-refresh .good-bank .card .text,
body.bfg-refresh .good-bank .card .text p { color: var(--bfg-fg) !important; max-width: 44rem; }
body.bfg-refresh .good-bank .teal-btn {
  background: var(--bfg-mint) !important;
  border-color: var(--bfg-mint) !important;
}
body.bfg-refresh .good-bank .mt-24 { margin-top: 2.5rem !important; justify-content: flex-start !important; padding: 0 1.25rem; max-width: 1280px; margin-left: auto; margin-right: auto; }
body.bfg-refresh .good-bank .mt-24 .teal-btn { margin: 0 !important; }

/* ---------- Homepage: "Find a better bank" (yellow) ---------- */
body.bfg-refresh .browse-cta {
  background: var(--bfg-yellow) !important;
  background-image: none !important;
  color: var(--bfg-fg) !important;
  padding: clamp(3rem, 6vw, 5rem) 0 !important;
}
body.bfg-refresh .browse-cta h2,
body.bfg-refresh .browse-cta .text-white,
body.bfg-refresh .browse-cta .path-desc,
body.bfg-refresh .browse-cta .path-trust { color: var(--bfg-fg) !important; }
body.bfg-refresh .browse-cta .bg-white.rounded-2xl {
  margin-top: 1.5rem !important;
  background: var(--bfg-card) !important;
  border: 2px solid var(--bfg-fg);
  border-radius: 3px !important;
}
body.bfg-refresh .browse-cta .take-action { display: none !important; }
body.bfg-refresh .browse-cta .learn-more a { color: var(--bfg-fg); font-weight: 700; }

/* ---------- Content + image rows ---------- */
body.bfg-refresh .ContentImage h2 { color: var(--bfg-fg) !important; }
body.bfg-refresh .ContentImage .rte p,
body.bfg-refresh .ContentImage .rte li { color: var(--bfg-fg); }
body.bfg-refresh .ContentImage .trust-note {
  border-left: 4px solid var(--bfg-primary);
  padding: 0.75rem 1rem;
  background: rgba(53, 191, 153, .10);
}
body.bfg-refresh .ContentImage-image { background-color: transparent !important; }

/* ---------- Forms (Gravity Forms) ---------- */
body.bfg-refresh .gform_wrapper input[type=text],
body.bfg-refresh .gform_wrapper input[type=email],
body.bfg-refresh .gform_wrapper input[type=tel],
body.bfg-refresh .gform_wrapper input[type=url],
body.bfg-refresh .gform_wrapper select,
body.bfg-refresh .gform_wrapper textarea {
  background: var(--bfg-card) !important;
  color: var(--bfg-fg) !important;
  border: 2px solid var(--bfg-border) !important;
  border-radius: 3px !important;
  padding: 0.8rem 0.9rem !important;
  font: 500 1rem/1.3 var(--bfg-text) !important;
}
body.bfg-refresh .gform_wrapper input:focus,
body.bfg-refresh .gform_wrapper textarea:focus,
body.bfg-refresh .gform_wrapper select:focus { outline: 3px solid var(--bfg-primary); outline-offset: 1px; }
body.bfg-refresh .bg-darkteal .gform_wrapper label,
body.bfg-refresh .bg-darkteal .gform_wrapper .gfield_label { color: var(--bfg-bg) !important; }

/* ---------- Footer ---------- */
body.bfg-refresh .Footer {
  background: var(--bfg-bg) !important;
  color: var(--bfg-fg) !important;
  border-top: 2px solid var(--bfg-fg);
}
body.bfg-refresh .Footer > .bg-blue {
  background: var(--bfg-pink) !important;
  color: var(--bfg-fg) !important;
}
body.bfg-refresh .Footer > .bg-blue h4 {
  color: var(--bfg-fg) !important;
  text-transform: none !important;
  font-size: clamp(2.25rem, 5vw, 4rem) !important;
}
body.bfg-refresh .Footer .border-white { border-color: var(--bfg-fg) !important; }
body.bfg-refresh .Footer a,
body.bfg-refresh .Footer p,
body.bfg-refresh .Footer li { color: var(--bfg-fg) !important; }
body.bfg-refresh .Footer .FooterMenu ul { text-transform: none !important; font: 500 0.95rem/1.5 var(--bfg-text) !important; }
body.bfg-refresh .Footer .js-share img { filter: brightness(0) saturate(100%); opacity: .85; }
body.bfg-refresh .Footer .btn-secondary { background: transparent !important; }

/* ---------- v2 fixes ---------- */
body.bfg-refresh:not(.bfg-refresh-home) :is(main, .Header, .Footer) :is(div, span, a, label, p, li, button, input, select, textarea, small, strong, em, b):not([class*="dashicons"]) {
  font-family: var(--bfg-text);
}
body.bfg-refresh .home-hero h1 { margin-bottom: 1.5rem !important; }
body.bfg-refresh .find-ethical-bank-section:not(.bfg-move) .search-container {
  background: transparent !important;
  padding: 0 !important;
  margin-top: 1.5rem;
  border-radius: 0 !important;
  box-shadow: none !important;
}
body.bfg-refresh .find-ethical-bank-section:not(.bfg-move) .subtitle { font-weight: 700; margin-bottom: 0.6rem; }
body.bfg-refresh .simple-section .text,
body.bfg-refresh .simple-section .text p { font-size: clamp(1.05rem, 1.5vw, 1.2rem) !important; line-height: 1.6; }
body.bfg-refresh .good-bank .card h4 { text-transform: lowercase !important; }
body.bfg-refresh .browse-cta ._form-title {
  font: 700 clamp(1.25rem, 2vw, 1.5rem)/1.25 var(--bfg-display) !important;
  letter-spacing: -0.01em;
  text-transform: none !important;
}
body.bfg-refresh .browse-cta select,
body.bfg-refresh .find-ethical-bank-section:not(.bfg-move) select {
  border: 2px solid var(--bfg-fg) !important;
  border-radius: 3px !important;
  padding: 0.55rem 2rem 0.55rem 0.75rem !important;
  background-color: var(--bfg-card) !important;
  color: var(--bfg-fg) !important;
  font: 500 1rem/1.3 var(--bfg-text) !important;
}
body.bfg-refresh .browse-cta label,
body.bfg-refresh .browse-cta .text-xs { color: var(--bfg-fg) !important; }
body.bfg-refresh .learn-more a {
  font: 700 1.05rem/1.3 var(--bfg-text) !important;
  font-style: normal !important;
  text-decoration: underline;
}
body.bfg-refresh .gform_wrapper label,
body.bfg-refresh .gform_wrapper .gfield_label,
body.bfg-refresh .gform_wrapper .gform-field-label {
  font: 600 0.95rem/1.3 var(--bfg-text) !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}
body.bfg-refresh .gform_wrapper ::placeholder { color: var(--bfg-muted-fg); opacity: 1; }
body.bfg-refresh .Footer > .bg-blue a.Button {
  background: var(--bfg-primary) !important;
  border-color: var(--bfg-primary) !important;
  color: var(--bfg-primary-fg) !important;
}
body.bfg-refresh .Footer .btn-secondary {
  border-radius: 3px !important;
  border: 2px solid var(--bfg-fg) !important;
  color: var(--bfg-fg) !important;
}

/* ---------- Rating labels: sustainable banking scale (set by refresh.js) ---------- */
body.bfg-refresh .rating-scale-bar,
body.bfg-refresh .rating-scale-labels {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  column-gap: 4px;
}
body.bfg-refresh .rating-scale-bar .seg { width: auto !important; min-width: 0; margin: 0 !important; }
body.bfg-refresh .rating-scale-labels > span {
  text-align: center;
  font-size: 0.75rem;
  line-height: 1.2;
  white-space: normal;
  overflow-wrap: normal;
  padding-top: 0.25rem;
}
body.bfg-refresh .rating-scale-labels > span.current { font-weight: 700; }
body.bfg-refresh .rating-scale-note { margin-top: 0.45rem; font-size: 0.8rem; line-height: 1.35; color: inherit; }
body.bfg-refresh .result-funding .bfg-verdict { display: block; font-weight: 600; line-height: 1.4; }
@media (max-width: 400px) {
  body.bfg-refresh .rating-scale-labels > span { font-size: 0.6875rem; }
}

/* Bank profile pages: Bank.Green's description and the theme's rating explanation stay hidden
   until refresh.js has replaced them with approved wording (English pages only). */
html[lang^="en"] body.bfg-refresh #main-content .top-wrapper .left > .description:not([data-bfg-desc^="text"]) { display: none !important; }
html[lang^="en"] body.bfg-refresh #main-content .rating:not([data-bfg-label]) .description-wrapper .description,
html[lang^="en"] body.bfg-refresh #main-content .rating:not([data-bfg-label]) .seg-label,
html[lang^="en"] body.bfg-refresh #main-content .rating:not([data-bfg-label]) .rating-value { visibility: hidden; }
html[lang^="en"] body.bfg-refresh #main-content .top-wrapper .our-take { display: none !important; }
/* Bank profile scale: the new labels are longer than Worst/Bad/Great, so keep them clear of the marker. */
html[lang^="en"] body.bfg-refresh #main-content .thermo-seg .seg-label { font-size: 0.625rem; letter-spacing: 0; white-space: nowrap; }
html[lang^="en"] body.bfg-refresh #main-content .thermo-seg .seg-label.active { padding-right: 1.5rem; }

/* =====================================================================
   UX audit fixes (October 2026): one type system, aligned layout,
   readable colours on every background, one button style.
   ===================================================================== */
body.bfg-refresh {
  --bfg-fs-h1: clamp(2.5rem, 3.2vw + 1.2rem, 4.5rem);
  --bfg-fs-h2: clamp(2rem, 1.8vw + 1.2rem, 3rem);
  --bfg-fs-h3: clamp(1.375rem, 0.6vw + 1.1rem, 1.75rem);
  --bfg-fs-h4: 1.25rem;
  --bfg-fs-h5: 1.0625rem;
  --bfg-fs-lead: clamp(1.125rem, 0.35vw + 1rem, 1.3125rem);
  --bfg-fs-body: 1.0625rem;
  --bfg-fs-small: 0.875rem;
  --bfg-fs-xs: 0.8125rem;
  --bfg-green-ink: #157a5f;
  --bfg-green-num: #1f8f70;
}
@media (max-width: 640px) { body.bfg-refresh { --bfg-fs-body: 1rem; } }

/* Old theme fonts are mapped to the new pair everywhere. */
body.bfg-refresh :is(.font-nimbus, .font-nimbus-ext, .font-quarto) { font-family: var(--bfg-text) !important; font-style: normal !important; }

/* Headings: one family, weight 800 or 700, no forced capitals.
   Words inside a heading (underlined words, links) never switch font. */
body.bfg-refresh :is(h1, h2, h3, h4, h5, h6, .HeadingPrimary, .HeadingSecondary, .is-style-heading-primary, .is-style-heading-secondary) {
  font-family: var(--bfg-display) !important;
  text-transform: none !important;
  font-style: normal !important;
}
body.bfg-refresh :is(h1, h2, h3, h4, h5, h6, .HeadingPrimary, .HeadingSecondary, .is-style-heading-primary, .is-style-heading-secondary) :is(span, a, strong, b, em, i, mark, sup, sub) {
  font-family: inherit !important;
  font-weight: inherit !important;
  font-size: inherit !important;
  font-style: inherit !important;
  letter-spacing: inherit !important;
  text-transform: inherit !important;
}

/* Inner pages: the type scale. (The new homepage has its own sizes in home.css.) */
body.bfg-refresh:not(.bfg-refresh-home) #main-content h1 { font-size: var(--bfg-fs-h1) !important; font-weight: 800 !important; line-height: 1.02 !important; letter-spacing: -0.025em !important; }
body.bfg-refresh:not(.bfg-refresh-home) #main-content h2 { font-size: var(--bfg-fs-h2) !important; font-weight: 800 !important; line-height: 1.06 !important; letter-spacing: -0.02em !important; }
body.bfg-refresh:not(.bfg-refresh-home) #main-content h3 { font-size: var(--bfg-fs-h3) !important; font-weight: 700 !important; line-height: 1.15 !important; letter-spacing: -0.01em !important; }
body.bfg-refresh:not(.bfg-refresh-home) #main-content h4 { font-size: var(--bfg-fs-h4) !important; font-weight: 700 !important; line-height: 1.25 !important; letter-spacing: -0.005em !important; }
body.bfg-refresh:not(.bfg-refresh-home) #main-content :is(h5, h6) { font-size: var(--bfg-fs-h5) !important; font-weight: 700 !important; line-height: 1.3 !important; letter-spacing: 0 !important; }
body.bfg-refresh:not(.bfg-refresh-home) #main-content :is(h1, h2, h3, h4, h5, h6) { margin-bottom: 0.5em; }

body.bfg-refresh:not(.bfg-refresh-home) #main-content :is(p, li, dd, td, th, blockquote, .rte, .text) { font-size: var(--bfg-fs-body); line-height: 1.6; }
body.bfg-refresh:not(.bfg-refresh-home) #main-content :is(.is-style-heading-subtitle, .hero-sub-head, .lead) { font-size: var(--bfg-fs-lead) !important; line-height: 1.5 !important; font-weight: 400 !important; }
body.bfg-refresh:not(.bfg-refresh-home) #main-content :is(.text-sm, small, figcaption, .wp-element-caption, .offer-source, .rating-key, .impact-note, .note-content, .note-content *) { font-size: var(--bfg-fs-small) !important; line-height: 1.45 !important; }
body.bfg-refresh:not(.bfg-refresh-home) #main-content .text-xs { font-size: var(--bfg-fs-xs) !important; line-height: 1.4 !important; }

/* Labels: the only capitals on the site. */
body.bfg-refresh .bfg-footer__h,
body.bfg-refresh .bfg-eyebrow,
body.bfg-refresh .path-label,
body.bfg-refresh #main-content .whitespace-no-wrap.uppercase {
  font: 700 0.75rem/1.3 var(--bfg-text) !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

/* Find a bank: card titles in the heading face, section names as labels. */
body.bfg-refresh #main-content .name:not(h1) { font-family: var(--bfg-display) !important; font-weight: 700 !important; font-size: 1.375rem !important; letter-spacing: -0.01em !important; line-height: 1.2 !important; }
body.bfg-refresh #main-content .results-count { font: 700 1.25rem/1.3 var(--bfg-display) !important; letter-spacing: -0.01em; }
body.bfg-refresh #main-content div.title:not(.path-intro):not(:has(h1, h2, img)) { font: 700 0.8125rem/1.3 var(--bfg-text) !important; letter-spacing: 0.06em; text-transform: uppercase; }
body.bfg-refresh #main-content .fossil-free { font: 700 0.75rem/1 var(--bfg-text) !important; letter-spacing: 0.02em; }
body.bfg-refresh #main-content .top-wrapper h1.name { font-size: var(--bfg-fs-h2) !important; }
body.bfg-refresh #main-content .fact-value { font-family: var(--bfg-display) !important; font-weight: 800 !important; letter-spacing: -0.01em; }
body.bfg-refresh #main-content :is(.faq-item-header-title, .advgb-accordion-header-title) { font-size: 1.125rem !important; line-height: 1.35 !important; }

/* Layout: inner-page content lines up with the header and footer (20 px phone, 32 px from tablet up). */
body.bfg-refresh:not(.bfg-refresh-home) #main-content .container { max-width: 1280px !important; padding-left: 20px !important; padding-right: 20px !important; }
@media (min-width: 768px) {
  body.bfg-refresh:not(.bfg-refresh-home) #main-content .container { padding-left: 32px !important; padding-right: 32px !important; }
}

/* Dark sections: dark green with light text, wherever the theme used black. */
body.bfg-refresh #main-content :is(.bg-black, .bg-darkteal) { background-color: var(--bfg-fg) !important; color: var(--bfg-bg) !important; }
body.bfg-refresh #main-content :is(.bg-black, .bg-darkteal) :is(h1, h2, h3, h4, h5, h6, p, li, span, strong, b, em, i, blockquote, figcaption, label, div, .rte, .text) { color: var(--bfg-bg) !important; }
body.bfg-refresh #main-content :is(.bg-black, .bg-darkteal) a:not([class*="btn"]):not(.Button):not(.header-btn):not(.teal-btn):not(.cta) { color: var(--bfg-mint) !important; }
/* Light cards inside a dark section keep dark text. */
body.bfg-refresh #main-content :is(.bg-black, .bg-darkteal) :is(.bg-white, .bg-tan, .card, .gform_wrapper input, .gform_wrapper textarea, .gform_wrapper select) { color: var(--bfg-fg) !important; }
body.bfg-refresh #main-content :is(.bg-black, .bg-darkteal) :is(.bg-white, .bg-tan, .card) :is(h1, h2, h3, h4, h5, h6, p, li, span, strong, b, em, div) { color: var(--bfg-fg) !important; }
/* Lavender and yellow sections: dark text (white text there fails contrast). */
body.bfg-refresh #main-content :is(.bg-purple, .bg-yellow) :is(h1, h2, h3, h4, h5, h6, p, li, span, strong, a:not([class*="btn"])) { color: var(--bfg-fg) !important; }

/* Text colours that failed contrast. */
body.bfg-refresh #main-content a.website { color: var(--bfg-green-ink) !important; }
body.bfg-refresh #main-content .rating .subtitles div { color: var(--bfg-muted-fg) !important; }

/* Buttons: one primary style (green), one secondary (outlined), sentence-case labels set in DM Sans. */
body.bfg-refresh #main-content :is(a.btn-more, a.next-primary) {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-height: 48px;
  padding: 0.75rem 1.25rem !important;
  background: var(--bfg-primary) !important;
  color: var(--bfg-primary-fg) !important;
  border: 2px solid var(--bfg-primary) !important;
  border-radius: 3px !important;
  font: 700 1rem/1.2 var(--bfg-text) !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  text-decoration: none !important;
  box-shadow: none !important;
}
body.bfg-refresh #main-content :is(a.btn-more, a.next-primary):hover { background: #2aa886 !important; border-color: #2aa886 !important; }
body.bfg-refresh #main-content :is(a.btn-more, a.next-primary):focus-visible { outline: 3px solid var(--bfg-fg); outline-offset: 3px; }

/* Phone tap targets: footer links, filters and bank-page links at least 40 px tall. */
@media (max-width: 767px) {
  body.bfg-refresh .bfg-footer li a { display: inline-block; padding: 0.55rem 0; }
  body.bfg-refresh #main-content input[type="checkbox"], body.bfg-refresh #main-content input[type="radio"] { width: 22px !important; height: 22px !important; }
  body.bfg-refresh #main-content :is(.next-steps-actions a, .next-secondary) { display: inline-block; padding: 0.6rem 0; }
}
body.bfg-refresh .skip-link { font-family: var(--bfg-text) !important; }

/* =====================================================================
   Long-form articles ("The hidden power of a bank deposit", Parts I and II).
   The add-on adds .bfg-article to the page and, in the content, the series
   links (.bfg-series), the contents list (.bfg-toc) and the folded sources (.bfg-fold).
   ===================================================================== */
body.bfg-article #main-content .page-body { max-width: 1180px !important; margin-left: auto; margin-right: auto; padding-top: 2.5rem !important; padding-bottom: 4.5rem !important; }
body.bfg-refresh.bfg-article #main-content .page-body > h1 {
  font-size: clamp(2rem, 2.1vw + 1.3rem, 3.25rem) !important; line-height: 1.06 !important; letter-spacing: -0.025em !important;
  max-width: 24ch; margin: 0 0 1.75rem !important; color: var(--bfg-fg);
}
body.bfg-refresh.bfg-article #main-content .rte { font-size: 1.125rem !important; line-height: 1.7 !important; color: var(--bfg-fg); }
body.bfg-refresh.bfg-article #main-content .rte :is(p, li) { font-size: inherit !important; line-height: inherit !important; }
body.bfg-article #main-content .rte > :is(p, ul, ol) { margin: 0 0 1.25em; }
@media (min-width: 1024px) { body.bfg-refresh.bfg-article #main-content .rte { font-size: 1.1875rem !important; } }

/* Desktop: contents list in a left column that stays in view, article text 720 px wide. */
@media (min-width: 1100px) {
  body.bfg-article #main-content .page-body { display: grid; grid-template-columns: 220px minmax(0, 720px); column-gap: 72px; justify-content: center; }
  body.bfg-article #main-content .page-body > h1 { grid-column: 2; }
  body.bfg-article #main-content .page-body > .rte { grid-column: 1 / -1; display: grid; grid-template-columns: 220px minmax(0, 720px); column-gap: 72px; align-items: start; justify-content: center; }
  body.bfg-article #main-content .rte > * { grid-column: 2; min-width: 0; }
  body.bfg-article #main-content .rte > .bfg-toc { grid-column: 1; grid-row: 1 / span 300; position: sticky; top: 2rem; }
  body.admin-bar.bfg-article #main-content .rte > .bfg-toc { top: calc(2rem + 32px); }
}

/* Lead paragraph. */
body.bfg-refresh.bfg-article #main-content .rte > :is(.bfg-toc + p, .bfg-toc + h2 + figure + p) { font-size: 1.25em !important; line-height: 1.55 !important; }

/* Section headings: a rule above each, like the homepage sections. */
body.bfg-refresh.bfg-article #main-content .rte > h2 {
  font-size: clamp(1.5rem, 0.9vw + 1.2rem, 2rem) !important; font-weight: 700 !important; line-height: 1.15 !important; letter-spacing: -0.015em !important;
  margin: 3.25rem 0 1.25rem !important; padding-top: 1.25rem; border-top: 2px solid var(--bfg-fg); scroll-margin-top: 1.5rem;
}
body.bfg-refresh.bfg-article #main-content .rte > .bfg-toc + h2 { margin-top: 0 !important; }

/* Links in the text; numbered source links as small tags. */
body.bfg-article #main-content .rte a { color: var(--bfg-fg); text-decoration: underline; text-decoration-color: var(--bfg-primary); text-decoration-thickness: 2px; text-underline-offset: 3px; }
body.bfg-article #main-content .rte a:hover { text-decoration-color: var(--bfg-fg); }
body.bfg-article #main-content .rte a[href^="#ref-"] {
  display: inline-block; margin: 0 0.1em; padding: 0.22em 0.38em; border-radius: 3px;
  background: var(--bfg-mint); color: var(--bfg-fg); text-decoration: none;
  font: 700 0.68em/1 var(--bfg-text); vertical-align: 0.3em;
}
body.bfg-article #main-content .rte a[href^="#ref-"]:hover { background: var(--bfg-primary); }
body.bfg-article #main-content .rte a:focus-visible { outline: 3px solid var(--bfg-fg); outline-offset: 2px; border-radius: 2px; }

/* Illustrations. */
body.bfg-article #main-content .rte .article-figure { margin: 1.75rem 0 2rem; background: #0e0e0e; border-radius: 6px; overflow: hidden; }
body.bfg-article #main-content .rte .article-figure img { display: block; width: 100%; height: auto; border-radius: 0; }

/* Bulleted lists. */
body.bfg-article #main-content .rte > ul { list-style: none; padding: 0; }
body.bfg-article #main-content .rte > ul > li { position: relative; padding-left: 1.6em; margin: 0 0 0.75em; }
body.bfg-article #main-content .rte > ul > li::before { content: ""; position: absolute; left: 0.2em; top: 0.62em; width: 0.6em; height: 0.6em; background: var(--bfg-primary); border-radius: 2px; }

/* Numbered steps (Part II switching checklist). */
body.bfg-article #main-content .rte > ol:not(.article-references) { list-style: none; padding: 0; counter-reset: bfg-step; }
body.bfg-article #main-content .rte > ol:not(.article-references) > li {
  counter-increment: bfg-step; position: relative; margin: 0 0 1rem; padding: 1.25rem 1.25rem 1.25rem 4.25rem;
  background: var(--bfg-card); border: 2px solid var(--bfg-fg); border-radius: 3px;
}
body.bfg-article #main-content .rte > ol:not(.article-references) > li::before {
  content: counter(bfg-step, decimal-leading-zero); position: absolute; left: 1.1rem; top: 1.05rem;
  font: 800 1.6rem/1 var(--bfg-display); color: var(--bfg-green-num);
}

/* Tables (Part II). */
body.bfg-article #main-content .rte figure.wp-block-table { margin: 1.75rem 0 2rem; overflow-x: auto; }
body.bfg-article #main-content .rte figure.wp-block-table table { width: 100%; border-collapse: collapse; border: 2px solid var(--bfg-fg); background: var(--bfg-card); font-size: 1rem; }
body.bfg-article #main-content .rte figure.wp-block-table thead th { background: var(--bfg-fg); color: var(--bfg-bg) !important; font: 700 0.75rem/1.3 var(--bfg-text) !important; letter-spacing: 0.08em; text-transform: uppercase; text-align: left; padding: 0.85rem 1rem; }
body.bfg-article #main-content .rte figure.wp-block-table :is(tbody td, tbody th) { padding: 0.85rem 1rem; border-top: 1px solid var(--bfg-border); text-align: left; vertical-align: top; font-size: 1rem !important; line-height: 1.45 !important; }
body.bfg-article #main-content .rte figure.wp-block-table tbody th { font-weight: 700; }
body.bfg-article #main-content .rte .alloc-bar { height: 12px; border-radius: 2px; background: var(--bfg-muted, #ece6dc); }
body.bfg-article #main-content .rte .alloc-bar > span { background: var(--bfg-primary); }
body.bfg-article #main-content .rte .alloc-bar > span.range { background: var(--bfg-mint); }
body.bfg-article #main-content .rte .alloc-value { color: var(--bfg-fg); font-family: var(--bfg-display); font-weight: 800; }

/* Series links (Part I / Part II). */
body.bfg-article #main-content .bfg-series { margin: 0 0 2rem; }
body.bfg-refresh.bfg-article #main-content .rte .bfg-series .bfg-series__name { font: 700 0.75rem/1.3 var(--bfg-text) !important; letter-spacing: 0.08em; text-transform: uppercase; margin: 0 0 0.75rem; }
body.bfg-article #main-content .bfg-series ol { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; }
body.bfg-article #main-content .bfg-series li { margin: 0; padding: 0; }
body.bfg-article #main-content .bfg-series li::before { content: none; }
body.bfg-article #main-content .rte .bfg-series a {
  display: flex; flex-direction: column; gap: 0.3rem; height: 100%; padding: 0.9rem 1rem;
  border: 2px solid var(--bfg-fg); border-radius: 3px; background: var(--bfg-card); color: var(--bfg-fg); text-decoration: none;
}
body.bfg-article #main-content .rte .bfg-series a[aria-current="page"] { background: var(--bfg-mint); }
body.bfg-article #main-content .rte .bfg-series a:hover:not([aria-current]) { background: var(--bfg-bg); }
body.bfg-article #main-content .bfg-series__part { font: 800 1.0625rem/1.2 var(--bfg-display); }
body.bfg-article #main-content .bfg-series__title { font-size: 0.9375rem; line-height: 1.35; }
body.bfg-article #main-content .rte .bfg-series a:not([aria-current]) .bfg-series__title { text-decoration: underline; text-decoration-color: var(--bfg-primary); text-decoration-thickness: 2px; text-underline-offset: 3px; }

/* Contents list. Phone and tablet: a box that opens. Desktop: always open in the left column. */
body.bfg-article #main-content .bfg-toc { margin: 0 0 2.5rem; border: 2px solid var(--bfg-fg); border-radius: 3px; background: var(--bfg-card); }
body.bfg-article #main-content .bfg-toc > summary {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 0.9rem 1rem; cursor: pointer; list-style: none;
  font: 700 1rem/1.3 var(--bfg-text);
}
body.bfg-article #main-content .bfg-toc > summary::-webkit-details-marker { display: none; }
body.bfg-article #main-content .bfg-toc > summary::after { content: "+"; font: 700 1.4rem/1 var(--bfg-text); }
body.bfg-article #main-content .bfg-toc[open] > summary::after { content: "\2212"; }
body.bfg-article #main-content .bfg-toc ol { list-style: none; margin: 0; padding: 0 1rem 1rem; counter-reset: bfg-toc; }
body.bfg-article #main-content .bfg-toc li { margin: 0; padding: 0; counter-increment: bfg-toc; }
body.bfg-article #main-content .bfg-toc li::before { content: none; }
body.bfg-article #main-content .rte .bfg-toc a {
  display: block; padding: 0.5rem 0 0.5rem 0.75rem; border-left: 3px solid transparent;
  font-size: 0.9375rem; line-height: 1.35; color: var(--bfg-fg); text-decoration: none;
}
body.bfg-article #main-content .rte .bfg-toc a:hover { text-decoration: underline; text-decoration-color: var(--bfg-primary); }
body.bfg-article #main-content .rte .bfg-toc a[aria-current="true"] { border-left-color: var(--bfg-primary); font-weight: 700; }
@media (min-width: 1100px) {
  body.bfg-article #main-content .bfg-toc { margin: 0; border: 0; background: transparent; }
  body.bfg-article #main-content .bfg-toc > summary { padding: 0 0 0.75rem; cursor: default; font: 700 0.75rem/1.3 var(--bfg-text); letter-spacing: 0.08em; text-transform: uppercase; }
  body.bfg-article #main-content .bfg-toc > summary::after,
  body.bfg-article #main-content .bfg-toc[open] > summary::after { content: none; }
  body.bfg-article #main-content .bfg-toc ol { padding: 0; border-left: 2px solid var(--bfg-border); }
  body.bfg-article #main-content .rte .bfg-toc a { margin-left: -2px; padding-left: 1rem; }
}

/* "Next: Part II" / "Previous: Part I" as a card. */
body.bfg-article #main-content .rte > p.article-next {
  margin: 2.5rem 0 1.5rem; padding: 1.1rem 1.25rem; border: 2px solid var(--bfg-fg); border-left-width: 2px; border-radius: 3px; background: var(--bfg-pink);
  font-size: 1.0625rem !important; line-height: 1.45 !important;
}
body.bfg-article #main-content .rte > p.article-next strong { display: block; font: 700 0.75rem/1.3 var(--bfg-text); letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 0.3rem; }
body.bfg-article #main-content .rte > p.article-next a { font-family: var(--bfg-display); font-weight: 700; font-size: 1.25rem; text-decoration: none; }
body.bfg-article #main-content .rte > p.article-next a::after { content: " \2192"; }
body.bfg-article #main-content .rte > p.article-next a:hover { text-decoration: underline; }
body.bfg-article #main-content .rte > .wp-block-buttons { margin: 0 0 2.5rem; }

/* Click-to-open sections (sources, the data note), styled like the FAQ questions. */
body.bfg-article #main-content .bfg-fold { margin: 0; border-top: 2px solid var(--bfg-fg); }
body.bfg-article #main-content .bfg-fold + .bfg-fold { border-top-width: 1px; border-top-color: var(--bfg-border); }
body.bfg-article #main-content .rte > .bfg-fold:last-of-type { border-bottom: 2px solid var(--bfg-fg); }
body.bfg-article #main-content .bfg-fold > summary {
  display: flex; align-items: center; gap: 1rem; padding: 1.1rem 0; cursor: pointer; list-style: none; min-height: 48px;
}
body.bfg-article #main-content .bfg-fold > summary::-webkit-details-marker { display: none; }
body.bfg-refresh.bfg-article #main-content .bfg-fold__title { margin: 0 !important; padding: 0; border: 0; font-size: 1.25rem !important; font-weight: 700 !important; line-height: 1.3 !important; letter-spacing: -0.01em !important; flex: 1 1 auto; }
body.bfg-article #main-content .bfg-fold__meta { font-size: 0.875rem; color: var(--bfg-muted-fg); white-space: nowrap; }
body.bfg-article #main-content .bfg-fold__icon { position: relative; flex: 0 0 auto; width: 32px; height: 32px; border: 2px solid var(--bfg-fg); border-radius: 999px; }
body.bfg-article #main-content .bfg-fold__icon::before,
body.bfg-article #main-content .bfg-fold__icon::after { content: ""; position: absolute; left: 50%; top: 50%; width: 12px; height: 2px; margin: -1px 0 0 -6px; background: var(--bfg-fg); transition: transform .2s ease; }
body.bfg-article #main-content .bfg-fold__icon::after { transform: rotate(90deg); }
body.bfg-article #main-content .bfg-fold[open] .bfg-fold__icon { background: var(--bfg-mint); }
body.bfg-article #main-content .bfg-fold[open] .bfg-fold__icon::after { transform: rotate(0deg); }
body.bfg-article #main-content .bfg-fold > summary:hover .bfg-fold__title { text-decoration: underline; text-decoration-color: var(--bfg-primary); text-decoration-thickness: 2px; text-underline-offset: 4px; }
body.bfg-article #main-content .bfg-fold > summary:focus-visible { outline: 3px solid var(--bfg-fg); outline-offset: 4px; }
body.bfg-article #main-content .bfg-fold__body { padding: 0 0 1.5rem; }
body.bfg-refresh.bfg-article #main-content .bfg-fold__body :is(p, li) { font-size: 1rem !important; line-height: 1.6 !important; }
body.bfg-article #main-content .rte .article-references { margin: 0; padding-left: 1.75rem; font-size: 1rem; }
body.bfg-refresh.bfg-article #main-content .rte .article-references li { font-size: 0.9375rem !important; line-height: 1.55 !important; margin: 0 0 0.75rem; padding: 0.25rem 0.5rem; border-radius: 3px; overflow-wrap: anywhere; scroll-margin-top: 1.5rem; }
body.bfg-article #main-content .rte .article-references li::marker { font-weight: 700; }
body.bfg-article #main-content .rte .article-references li:target,
body.bfg-article #main-content .rte .article-references li.is-target { background: rgba(251, 182, 42, 0.35); }
body.bfg-article #main-content .rte > .bfg-fold ~ p { margin-top: 1.5rem; font-size: 0.9375rem !important; color: var(--bfg-muted-fg); }

@media (max-width: 640px) {
  body.bfg-article #main-content .bfg-series ol { gap: 0.5rem; }
  body.bfg-article #main-content .rte .bfg-series a { padding: 0.75rem 0.8rem; }
  body.bfg-article #main-content .rte > ol:not(.article-references) > li { padding: 1rem 1rem 1rem 3.5rem; }
  body.bfg-article #main-content .rte > ol:not(.article-references) > li::before { left: 0.9rem; font-size: 1.35rem; }
  body.bfg-article #main-content .bfg-fold__meta { display: none; }
}