/* Bond Street Mortgage ,  Filtered Blog section. Scoped to .bsm-blog-section. */
.bsm-blog-section {
  --bsm-blog-green: #00634a;
  --bsm-blog-deep: #003f30;
  --bsm-blog-ink: #102d24;
  --bsm-blog-muted: #61766f;
  --bsm-blog-line: #d8e7e0;
  box-sizing: border-box;
  padding: clamp(60px, 7vw, 104px) 24px;
  background: linear-gradient(180deg, #eff9f5 0%, #f8fbfa 100%);
  color: var(--bsm-blog-ink);
  font-family: Inter, Arial, sans-serif;
}
.bsm-blog-section *, .bsm-blog-section *::before, .bsm-blog-section *::after { box-sizing: border-box; }
.bsm-blog-section__inner { width: min(100%, 1200px); margin: 0 auto; }
.bsm-blog-section__header { display: flex; gap: 30px; align-items: end; justify-content: space-between; margin-bottom: 30px; }
.bsm-blog-section__heading { max-width: 720px; }
.bsm-blog-section__eyebrow { margin: 0 0 12px; color: var(--bsm-blog-green); font-size: 11px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.bsm-blog-section h2 { margin: 0; color: var(--bsm-blog-deep); font-size: clamp(38px, 4.3vw, 60px); font-weight: 800; letter-spacing: -.055em; line-height: .99; }
.bsm-blog-section__all { display: inline-flex; flex: 0 0 auto; min-height: 48px; align-items: center; gap: 10px; justify-content: center; padding: 13px 19px; border: 1px solid var(--bsm-blog-green); border-radius: 7px; background: var(--bsm-blog-green); color: #fff; font-size: 14px; font-weight: 800; text-decoration: none; white-space: nowrap; box-shadow: 0 8px 16px rgba(0,99,74,.15); transition: background-color 160ms cubic-bezier(.23,1,.32,1), border-color 160ms cubic-bezier(.23,1,.32,1), transform 160ms cubic-bezier(.23,1,.32,1); }
.bsm-blog-section__all:hover { border-color: var(--bsm-blog-deep); background: var(--bsm-blog-deep); }
.bsm-blog-section__all:hover span { transform: translateX(3px); }
.bsm-blog-section__all:active { transform: scale(.97); }
.bsm-blog-section__all:focus-visible, .bsm-blog-section__filter:focus-visible, .bsm-blog-section__read:focus-visible, .bsm-blog-section__share:focus-visible, .bsm-blog-section__nav-button:focus-visible { outline: 3px solid rgba(0,99,74,.3); outline-offset: 3px; }
.bsm-blog-section__all span { font-size: 18px; line-height: 0; transition: transform 160ms cubic-bezier(.23,1,.32,1); }
.bsm-blog-section__filters { display: flex; gap: 8px; align-items: center; width: 100%; margin-bottom: 15px; padding: 7px; overflow-x: auto; border: 1px solid var(--bsm-blog-line); border-radius: 13px; background: rgba(255,255,255,.76); scrollbar-width: thin; }
.bsm-blog-section__filter { display: inline-flex; min-height: 42px; flex: 0 0 auto; align-items: center; gap: 8px; padding: 10px 14px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: #34554b; cursor: pointer; font: inherit; font-size: 13px; font-weight: 800; line-height: 1; white-space: nowrap; transition: color 160ms cubic-bezier(.23,1,.32,1), background-color 160ms cubic-bezier(.23,1,.32,1), box-shadow 160ms cubic-bezier(.23,1,.32,1); }
.bsm-blog-section__filter:hover { background: #e6f3ee; color: var(--bsm-blog-deep); }
.bsm-blog-section__filter[aria-selected="true"] { background: var(--bsm-blog-green); color: #fff; box-shadow: 0 5px 11px rgba(0,99,74,.18); }
.bsm-blog-section__filter svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.bsm-blog-section__summary { min-height: 21px; margin: 0 0 17px; color: var(--bsm-blog-muted); font-size: 13px; font-weight: 600; }
.bsm-blog-section__article-stage { position: relative; }
.bsm-blog-section__grid { display: flex; gap: 18px; padding: 2px 1px 10px; overflow-x: auto; scroll-behavior: smooth; scroll-snap-type: x mandatory; scrollbar-width: none; }
.bsm-blog-section__grid::-webkit-scrollbar { display: none; }
.bsm-blog-section__card { display: flex; min-width: 0; min-height: 100%; flex: 0 0 calc((100% - 36px) / 3); flex-direction: column; overflow: hidden; scroll-snap-align: start; border: 1px solid var(--bsm-blog-line); border-radius: 14px; background: #fff; box-shadow: 0 10px 27px rgba(16,45,36,.055); }
.bsm-blog-section__visual { position: relative; height: 142px; overflow: hidden; background: linear-gradient(135deg, #e5f4ed, #d4ebe1); }
.bsm-blog-section__visual::before, .bsm-blog-section__visual::after { position: absolute; content: ''; opacity: .55; }
.bsm-blog-section__visual::before { right: -14px; bottom: -34px; width: 145px; height: 145px; border: 18px solid rgba(0,99,74,.16); border-radius: 27px; transform: rotate(25deg); }
.bsm-blog-section__visual::after { top: 25px; left: 28px; width: 56px; height: 56px; border: 2px solid rgba(0,99,74,.35); border-radius: 50%; }
.bsm-blog-section__card[data-tone="blue"] .bsm-blog-section__visual { background: linear-gradient(135deg, #e7f4f5, #d6eaed); }
.bsm-blog-section__card[data-tone="gold"] .bsm-blog-section__visual { background: linear-gradient(135deg, #f8f1dd, #eee0b8); }
.bsm-blog-section__card[data-tone="deep"] .bsm-blog-section__visual { background: linear-gradient(135deg, #0b6a55, #003f30); }
.bsm-blog-section__card[data-tone="deep"] .bsm-blog-section__visual::before { border-color: rgba(157,255,219,.24); }
.bsm-blog-section__card[data-tone="deep"] .bsm-blog-section__visual::after { border-color: rgba(157,255,219,.6); }
.bsm-blog-section__visual img { position: relative; z-index: 1; display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 260ms cubic-bezier(.23,1,.32,1); }
.bsm-blog-section__card:hover .bsm-blog-section__visual img { transform: scale(1.035); }
.bsm-blog-section__visual--banner > img { position: absolute; z-index: 0; inset: 0; width: 100%; height: 100%; object-position: 78% 24%; opacity: .38; filter: saturate(.82) contrast(.96); }
.bsm-blog-section__visual--banner::before, .bsm-blog-section__visual--banner::after { z-index: 1; }
.bsm-blog-section__visual-symbol { position: absolute; z-index: 1; top: 25px; left: 27px; display: grid; width: 58px; height: 58px; place-items: center; border: 1px solid rgba(0,99,74,.2); border-radius: 16px; background: rgba(255,255,255,.86); color: var(--bsm-blog-green); box-shadow: 0 8px 16px rgba(16,45,36,.08); }
.bsm-blog-section__visual-symbol svg { width: 27px; height: 27px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.65; }
.bsm-blog-section__card[data-tone="deep"] .bsm-blog-section__visual-symbol { border-color: rgba(157,255,219,.25); background: rgba(255,255,255,.93); color: var(--bsm-blog-deep); }
.bsm-blog-section__body { display: flex; min-height: 275px; flex: 1; flex-direction: column; padding: 20px; }
.bsm-blog-section__tag { display: inline-flex; width: fit-content; max-width: 100%; margin-bottom: 12px; padding: 6px 9px; border: 1px solid rgba(0,99,74,.15); border-radius: 999px; background: #edf7f2; color: var(--bsm-blog-green); font-size: 10px; font-weight: 800; letter-spacing: .065em; line-height: 1; text-transform: uppercase; }
.bsm-blog-section__body h3 { margin: 0; color: var(--bsm-blog-deep); font-size: 21px; font-weight: 800; letter-spacing: -.035em; line-height: 1.15; }
.bsm-blog-section__body h3 a { color: inherit; text-decoration: none; }
.bsm-blog-section__body h3 a:hover { color: var(--bsm-blog-green); }
.bsm-blog-section__excerpt { display: -webkit-box; margin: 12px 0 0; overflow: hidden; color: var(--bsm-blog-muted); font-size: 14px; line-height: 1.52; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.bsm-blog-section__card-actions { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; padding-top: 20px; }
.bsm-blog-section__read { color: var(--bsm-blog-green); font-size: 13px; font-weight: 800; text-decoration: none; }
.bsm-blog-section__read:hover { color: var(--bsm-blog-deep); }
.bsm-blog-section__share { display: inline-flex; min-height: 32px; align-items: center; gap: 6px; padding: 6px 8px; border: 1px solid transparent; border-radius: 6px; background: transparent; color: var(--bsm-blog-muted); cursor: pointer; font: inherit; font-size: 12px; font-weight: 700; }
.bsm-blog-section__share:hover { border-color: var(--bsm-blog-line); background: #f4f9f6; color: var(--bsm-blog-green); }
.bsm-blog-section__share svg, .bsm-blog-section__nav-button svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.bsm-blog-section__nav { display: flex; min-height: 38px; align-items: center; justify-content: flex-end; gap: 10px; margin-top: 8px; }
.bsm-blog-section__nav[hidden] { display: none; }
.bsm-blog-section__page-status { min-width: 88px; color: var(--bsm-blog-muted); font-size: 12px; font-weight: 700; text-align: center; }
.bsm-blog-section__nav-button { display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid var(--bsm-blog-line); border-radius: 50%; background: #fff; color: var(--bsm-blog-green); cursor: pointer; transition: background-color 160ms cubic-bezier(.23,1,.32,1), border-color 160ms cubic-bezier(.23,1,.32,1), color 160ms cubic-bezier(.23,1,.32,1), transform 160ms cubic-bezier(.23,1,.32,1); }
.bsm-blog-section__nav-button:hover:not(:disabled) { border-color: var(--bsm-blog-green); background: var(--bsm-blog-green); color: #fff; }
.bsm-blog-section__nav-button:active:not(:disabled) { transform: scale(.94); }
.bsm-blog-section__nav-button:disabled { cursor: not-allowed; opacity: .38; }
.bsm-blog-section__share-status { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
@media (max-width: 640px) { .bsm-blog-section { padding: 54px 16px; } .bsm-blog-section__header { display: block; margin-bottom: 24px; text-align: center; } .bsm-blog-section h2 { font-size: 39px; } .bsm-blog-section__all { margin-top: 20px; } .bsm-blog-section__filters { margin-inline: -2px; width: calc(100% + 4px); } .bsm-blog-section__filter { min-height: 39px; padding: 9px 12px; font-size: 12px; } .bsm-blog-section__summary { text-align: center; } .bsm-blog-section__grid { gap: 12px; padding-bottom: 10px; } .bsm-blog-section__card { flex-basis: calc(100% - 34px); } .bsm-blog-section__visual { height: 134px; } .bsm-blog-section__body { min-height: 0; padding: 18px; } .bsm-blog-section__body h3 { font-size: 20px; } .bsm-blog-section__nav { justify-content: center; margin-top: 7px; } }
@media (prefers-reduced-motion: reduce) { .bsm-blog-section__all, .bsm-blog-section__all span, .bsm-blog-section__filter, .bsm-blog-section__visual img, .bsm-blog-section__nav-button { transition: none; } .bsm-blog-section__grid { scroll-behavior: auto; } }

/* Delivery cleanup: remove decorative bars that appear beside eyebrow or kicker text. */
[class*="eyebrow"]::after, [class*="eyebrow"]:after, [class*="kicker"]::after, [class*="kicker"]:after { content: none !important; display: none !important; }

/* Site fixes for index.html: global rules that otherwise override this section. */
/* style_banner.css positions every <header> absolutely; keep the section header in normal flow. */
.bsm-blog-section__header { position: static; width: auto; z-index: auto; }
/* The homepage's inline `button { margin-right: 5px }`. */
.bsm-blog-section button { margin: 0; }
/* Tighter hand-off to the testimonials section below (its top padding is reduced to match). */
@media (min-width: 641px) { .bsm-blog-section { padding-bottom: clamp(28px, 3vw, 48px); } }
