/* Bond Street Mortgage ,  centered homepage hero replacement
   Scoped to .bsm-home-hero. Load after existing site styles. */
.bsm-home-hero {
  --bsm-hero-green: #00634a;
  --bsm-hero-green-dark: #003f30;
  --bsm-hero-mint: #eaf5f0;
  --bsm-hero-mint-strong: #d6ebdf;
  --bsm-hero-ink: #102d24;
  --bsm-hero-muted: #5f746d;
  --bsm-hero-line: #d7e4de;
  --bsm-hero-page: #f7f9f8;
  --bsm-hero-max: 1320px;
  color: var(--bsm-hero-ink);
  background:
    linear-gradient(rgba(255, 255, 255, .90), rgba(255, 255, 255, .90)),
    url('./commercial-skyscraper-hero.webp') center center / cover no-repeat;
  font-family: Inter, Arial, sans-serif;
  box-sizing: border-box;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(16px, 1.6vw, 24px) 24px 14px;
}
.bsm-home-hero *, .bsm-home-hero *::before, .bsm-home-hero *::after { box-sizing: border-box; }
.bsm-home-hero__inner { width: min(100%, var(--bsm-hero-max)); margin-inline: auto; display: flex; flex-direction: column; align-items: center; }
.bsm-home-hero__content { width: min(100%, 940px); text-align: center; }
.bsm-home-hero__title { max-width: 940px; margin: 0 auto 12px; color: var(--bsm-hero-ink); font-size: clamp(44px, 4.1vw, 68px); font-weight: 800; letter-spacing: -.06em; line-height: .98; }
.bsm-home-hero__title em { color: var(--bsm-hero-green); font-family: Georgia, 'Times New Roman', serif; font-size: .93em; font-weight: 400; letter-spacing: -.045em; }
.bsm-home-hero__summary { max-width: 780px; margin: 0 auto; color: var(--bsm-hero-muted); font-size: clamp(15px, 1.2vw, 17px); line-height: 1.48; }
.bsm-home-hero__actions { display: inline-flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 9px; margin-top: 12px; }
.bsm-home-hero__secondary-link { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 36px; padding: 8px 12px; border: 1px solid rgba(0, 99, 74, .48); border-radius: 5px; color: var(--bsm-hero-green); font-size: 13px; font-weight: 800; line-height: 1.1; text-decoration: none; transition: background-color 160ms cubic-bezier(.23, 1, .32, 1), 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-home-hero__secondary-link:hover { border-color: var(--bsm-hero-green); background: rgba(0, 99, 74, .07); color: var(--bsm-hero-green-dark); transform: translateY(-1px); }
.bsm-home-hero__secondary-link--blog { border-color: var(--bsm-hero-green); background: var(--bsm-hero-green); color: #fff; }
.bsm-home-hero__secondary-link--blog:hover { background: var(--bsm-hero-green-dark); color: #fff; }
.bsm-home-hero__secondary-link svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; }
.bsm-home-hero__trust-list { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 22px; margin: 12px 0 0; padding: 0; color: var(--bsm-hero-muted); font-size: 13px; line-height: 1.45; list-style: none; }
.bsm-home-hero__trust-list li { display: inline-flex; align-items: center; gap: 7px; }
.bsm-home-hero__trust-list svg { width: 17px; height: 17px; flex: 0 0 17px; fill: none; stroke: var(--bsm-hero-green); stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.bsm-home-hero__trust-list a { color: inherit; font-weight: 700; text-decoration: none; }
.bsm-home-hero__trust-list a:hover { color: var(--bsm-hero-green); text-decoration: underline; }
.bsm-home-hero__tool-panel { width: min(100%, 1280px); min-width: 0; margin-top: 16px; border: 0; border-radius: 0; background: transparent; box-shadow: none; overflow: visible; }
.bsm-home-hero__secondary-link:focus-visible, .bsm-home-hero__trust-list a:focus-visible { outline: 3px solid rgba(0, 99, 74, .35); outline-offset: 4px; }
@media (min-width: 621px) { .bsm-home-hero { display: flex; align-items: center; min-height: calc(100vh - var(--bsm-site-header-height, 0px)); min-height: calc(100svh - var(--bsm-site-header-height, 0px)); padding-block: clamp(30px, 4vh, 52px); } .bsm-home-hero__inner { flex: 1 1 auto; } }
@media (prefers-reduced-motion: no-preference) { .bsm-home-hero__content { animation: bsm-home-hero-in 340ms cubic-bezier(.23, 1, .32, 1) both; } .bsm-home-hero__tool-panel { animation: bsm-home-hero-in 420ms 55ms cubic-bezier(.23, 1, .32, 1) both; } }
@keyframes bsm-home-hero-in { from { opacity: 0; transform: translateY(15px); } to { opacity: 1; transform: none; } }
@media (max-width: 620px) { .bsm-home-hero { padding: 50px 16px 56px; background-position: 55% center; text-align: center; } .bsm-home-hero__content, .bsm-home-hero__tool-panel { text-align: center; } .bsm-home-hero__title { font-size: clamp(42px, 13vw, 58px); } .bsm-home-hero__summary { font-size: 16px; } .bsm-home-hero__actions { justify-content: center; } .bsm-home-hero__trust-list { display: grid; justify-items: center; justify-content: center; gap: 11px; margin-top: 28px; text-align: center; } .bsm-home-hero__trust-list li { justify-content: center; } .bsm-home-hero__tool-panel { margin-top: 34px; } }

/* Schedule appointment slot (vendor behaviour): the mortgage tool loads here on click. Rules from the vendor's hero CSS. */
.bsm-home-hero__tool-frame { position: relative; width: min(100%, 1280px); min-height: 0; margin-top: 16px; padding: 0 10px 6px; }
.bsm-home-hero__tool-frame[hidden] { display: none; }
.bsm-home-hero__tool-frame[data-bsm-tool-state='loading'] { min-height: 92px; }
.bsm-home-hero__tool-frame bsl-mortgage-tool { position: relative; z-index: 1; display: block; width: 100%; opacity: 0; transition: opacity 180ms cubic-bezier(.23, 1, .32, 1); }
.bsm-home-hero__tool-frame[data-bsm-tool-state='ready'] bsl-mortgage-tool { opacity: 1; }
.bsm-home-hero__tool-loading { position: absolute; inset: 0; z-index: 2; display: flex; align-items: center; justify-content: center; gap: 10px; color: var(--bsm-hero-muted); font-size: 14px; font-weight: 600; pointer-events: none; transition: opacity 180ms cubic-bezier(.23, 1, .32, 1); }
.bsm-home-hero__tool-loading span { width: 18px; height: 18px; border: 2px solid var(--bsm-hero-mint-strong); border-top-color: var(--bsm-hero-green); border-radius: 50%; }
.bsm-home-hero__tool-frame[data-bsm-tool-state='ready'] .bsm-home-hero__tool-loading { opacity: 0; }
.bsm-home-hero__tool-fallback { display: none; align-items: center; justify-content: center; gap: 8px; width: fit-content; margin: 22px auto; padding: 13px 16px; border-radius: 10px; background: var(--bsm-hero-green); color: #fff; font-size: 14px; font-weight: 800; text-decoration: none; }
.bsm-home-hero__tool-fallback svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; }
.bsm-home-hero__tool-fallback:focus-visible { outline: 3px solid rgba(0, 99, 74, .35); outline-offset: 4px; }
.bsm-home-hero__tool-frame[data-bsm-tool-state='fallback'] .bsm-home-hero__tool-loading,
.bsm-home-hero__tool-frame[data-bsm-tool-state='fallback'] bsl-mortgage-tool { display: none; }
.bsm-home-hero__tool-frame[data-bsm-tool-state='fallback'] .bsm-home-hero__tool-fallback { display: flex; }
@media (prefers-reduced-motion: no-preference) { .bsm-home-hero__tool-loading span { animation: bsm-home-hero-spin 760ms linear infinite; } }
@keyframes bsm-home-hero-spin { to { transform: rotate(360deg); } }
@media (max-width: 620px) { .bsm-home-hero__tool-frame { margin-top: 34px; padding-inline: 2px; } .bsm-home-hero__tool-frame bsl-mortgage-tool { height: var(--bsm-mobile-tool-height, 780px) !important; } }
