/* Self-hosted fonts (no Google Fonts request): variable WOFF2 files, font-display: swap
   so text paints immediately and swaps to the brand font when it arrives. */
@font-face { font-family: 'Oswald'; font-style: normal; font-weight: 400 700; font-display: swap; src: url('assets/fonts/oswald.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400 700; font-display: swap; src: url('assets/fonts/inter.woff2') format('woff2'); }

html,body{margin:0;padding:0;background:#fff}
/* ============ BLANK BRANDING — homepage snippet ============ */
/* Hide Zoho theme chrome so the custom page renders clean */

.bb { font-family: 'Inter', -apple-system, 'Segoe UI', Arial, sans-serif; color: #0a0a0a; background: #ffffff; line-height: 1.5; -webkit-font-smoothing: antialiased; }
.bb *, .bb *::before, .bb *::after { box-sizing: border-box; }
.bb h1, .bb h2, .bb h3, .bb p { margin: 0; }
.bb img, .bb svg { display: block; }
.bb a { text-decoration: none; color: inherit; }

.bb-display { font-family: 'Oswald', 'Arial Narrow', sans-serif; text-transform: uppercase; letter-spacing: 0.01em; line-height: 0.95; }
.bb-wrap { max-width: 1200px; margin: 0 auto; padding-left: 24px; padding-right: 24px; }

/* ---------- Type scale — one rule per heading level (Nov 5) ---------- */
/* H1 — page title, hero only: Oswald 700, caps, 80px max (.bb-hero h1). The
   positioning headline is longer than the old "Your brand is a promise.", so
   the max is lower to keep it composed over three lines. */
/* H2 — section titles: Oswald 700, caps, 60px max. One per section, including
   the closing CTA. Every h2 on the page shares this size. */
/* H3 — sub-section titles (the four capabilities): Oswald 600, 32px max,
   title case as written. One shared .bb h3 rule — no per-component sizes. */
/* Exception: FAQ questions are h3 for structure, but they are interactive
   accordion labels, not sub-section titles, so they keep the FAQ component's
   own style (Inter 20px, .bb-faq-item h3) instead of the H3 display style. */
/* Non-headings that look like headings are not headings: framework step names
   (.bb-step-name) and stat figures (.bb-stat-fig) are labels/data, kept as divs. */
.bb h3 { font-family: 'Oswald', 'Arial Narrow', sans-serif; font-size: clamp(24px, 3vw, 32px); font-weight: 600; line-height: 1.1; }

/* Buttons — square corners only */
.bb-btn { display: inline-block; font-family: inherit; font-weight: 600; font-size: 15px; padding: 16px 34px; border-radius: 0; cursor: pointer; border: 2px solid #0a0a0a; }
.bb-btn-dark { background: #0a0a0a; color: #ffffff; }
.bb-btn-outline { background: transparent; color: #0a0a0a; }
.bb-btn-light { background: #ffffff; color: #0a0a0a; border-color: #ffffff; }
/* Button text must beat .bb a { color: inherit } — higher specificity. */
.bb a.bb-btn-dark { color: #ffffff; }
.bb a.bb-btn-light { color: #0a0a0a; }
/* Visible keyboard focus. */
.bb a:focus-visible, .bb button:focus-visible { outline: 2px solid #0a0a0a; outline-offset: 3px; }
/* On the black sections the outline must be light to be seen. */
.bb-caps a:focus-visible, .bb-caps button:focus-visible,
.bb-industries a:focus-visible, .bb-industries button:focus-visible,
.bb-cta a:focus-visible, .bb-cta button:focus-visible { outline-color: #ffffff; }

/* ---------- Header ---------- */
.bb-header { position: sticky; top: 0; z-index: 50; background: #ffffff; border-bottom: 1px solid #e8e8e8; }
.bb-header-inner { max-width: 1200px; margin: 0 auto; padding: 14px 24px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.bb-logo { position: relative; display: inline-block; line-height: 1; user-select: none; }
.bb-logo .bb-logo-bg { font-family: 'Oswald', 'Arial Narrow', sans-serif; font-weight: 700; font-size: 44px; letter-spacing: 0.04em; color: #e4e4e4; text-transform: uppercase; }
.bb-logo .bb-logo-fg { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 15px; letter-spacing: 0.34em; text-indent: 0.34em; color: #0a0a0a; text-transform: uppercase; white-space: nowrap; }
.bb-nav { display: flex; align-items: center; gap: 28px; }
.bb-nav a { font-size: 14px; font-weight: 500; color: #0a0a0a; }
.bb-nav .bb-btn { padding: 11px 24px; font-size: 13px; }
/* Language switcher: small EN | FR links in the header. The current language
   is plain text (aria-current); the other is a link. Clicking a language sets
   localStorage 'bb-lang' (see the onclick in the markup) so the auto-detect
   on the English page respects the manual choice. */
.bb-lang { font-size: 13px; font-weight: 500; letter-spacing: 0.06em; color: #666666; white-space: nowrap; }
.bb-nav .bb-lang a { font-size: 13px; color: #666666; }
.bb-nav .bb-lang a:hover { color: #0a0a0a; }
.bb-lang [aria-current="true"] { color: #0a0a0a; font-weight: 700; }

/* ---------- Hero (stacked full-width blocks) ---------- */
.bb-hero { padding: 96px 0 88px; text-align: center; }
.bb-hero h1, .bb-hero .bb-hero-h { font-size: clamp(40px, 6vw, 80px); font-weight: 700; }
/* Hero slider: slides stack in one grid cell (container height = tallest
   slide, so the buttons below never move); inactive slides fade out. Only
   slide 1 carries the <h1>; slides 2-3 use a styled <p> for the same look. */
.bb-hero-slider { display: grid; }
.bb-hero-slide { grid-area: 1 / 1; display: flex; flex-direction: column; justify-content: center; visibility: hidden; opacity: 0; transition: opacity 0.6s ease, visibility 0s linear 0.6s; }
.bb-hero-slide.bb-active { visibility: visible; opacity: 1; transition: opacity 0.6s ease; }
.bb-hero-controls { display: flex; gap: 0; align-items: center; justify-content: center; margin-top: 32px; }
.bb-hero-dot { width: 24px; height: 24px; border: 0; background: transparent; padding: 0; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.bb-hero-dot::before { content: ''; display: block; width: 10px; height: 10px; border-radius: 50%; border: 1px solid #0a0a0a; background: transparent; }
.bb-hero-dot.bb-active::before { background: #0a0a0a; }
.bb-hero-pause { display: flex; align-items: center; justify-content: center; width: 20px; height: 20px; margin: 0 0 0 6px; background: none; border: 1px solid #666666; border-radius: 50%; color: #666666; cursor: pointer; padding: 0; }
.bb-hero-pause:hover { color: #0a0a0a; border-color: #0a0a0a; }
.bb-hero-pause svg { width: 9px; height: 9px; fill: currentColor; display: block; }
.bb-hero-pause .bb-play-icon { display: none; }
.bb-hero-pause.bb-is-paused .bb-pause-icon { display: none; }
.bb-hero-pause.bb-is-paused .bb-play-icon { display: block; }
.bb-hero .bb-hero-sub { margin: 28px auto 0; max-width: 760px; font-size: clamp(17px, 2.2vw, 21px); color: #333333; }
/* Supporting phrase under the hero subheading. Scoped .bb to beat .bb p. */
.bb .bb-hero-phrase { margin: 28px auto 0; font-family: 'Oswald', 'Arial Narrow', sans-serif; font-size: 15px; font-weight: 500; letter-spacing: 0.22em; text-transform: uppercase; color: #333333; }
.bb-hero .bb-hero-ctas { margin-top: 40px; display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }

/* ---------- Capabilities strip ---------- */
.bb-strip { background: #0a0a0a; color: #ffffff; text-align: center; padding: 26px 24px; }
.bb-strip p { font-family: 'Oswald', 'Arial Narrow', sans-serif; font-size: clamp(18px, 3vw, 30px); font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; }

/* ---------- Philosophy ---------- */
.bb-philosophy { padding: 104px 0; text-align: center; }
.bb-philosophy p { font-size: clamp(26px, 4.4vw, 46px); font-weight: 600; line-height: 1.25; max-width: 900px; margin: 0 auto; }
/* Supporting positioning line under the philosophy line. Scoped .bb to beat .bb p. */
.bb .bb-philosophy-sub { font-size: 18px; font-weight: 400; line-height: 1.7; color: #333333; max-width: 680px; margin: 32px auto 0; }

/* ---------- Capabilities: one continuous black block ---------- */
.bb-caps { background: #0a0a0a; color: #ffffff; }
.bb-caps-inner { max-width: 1200px; margin: 0 auto; padding: 88px 24px; }
.bb .bb-caps-head { font-size: clamp(34px, 5vw, 60px); font-weight: 700; margin-bottom: 24px; }
/* Capabilities intro: the four are one interconnected relationship. Scoped .bb to beat .bb p. */
.bb .bb-caps-intro { font-size: 18px; color: #d9d9d9; max-width: 640px; margin-bottom: 48px; }
.bb-cap { display: flex; gap: 32px; padding: 56px 0; align-items: flex-start; }
.bb-cap + .bb-cap { border-top: 1px solid rgba(255,255,255,0.28); }
.bb-cap-icon { flex: 0 0 56px; width: 56px; height: 56px; }
.bb-cap-icon svg { width: 56px; height: 56px; stroke: #ffffff; fill: none; stroke-width: 1.5; }
.bb-cap h3 { margin-bottom: 12px; }
.bb-cap .bb-cap-kicker { font-size: 13px; font-weight: 600; letter-spacing: 0.22em; text-transform: uppercase; color: #9a9a9a; margin-bottom: 18px; }
.bb-cap .bb-cap-desc { font-size: 17px; color: #d9d9d9; max-width: 640px; margin-bottom: 28px; }
.bb-cap .bb-cap-services { font-size: 14px; color: #9a9a9a; line-height: 2; max-width: 720px; }

/* ---------- Systems ticker (bottom of What we do) ---------- */
.bb-ticker { border-top: 1px solid rgba(255,255,255,0.28); margin-top: 56px; padding-top: 36px; }
.bb-ticker-label { font-size: 12px; letter-spacing: 0.22em; text-transform: uppercase; color: #9a9a9a; text-align: center; margin-bottom: 20px; }
.bb-ticker-row { display: flex; align-items: center; gap: 16px; }
.bb-ticker-viewport { overflow: hidden; flex: 1; min-width: 0; }
.bb-ticker-viewport:hover .bb-ticker-track { animation-play-state: paused; }
.bb-ticker-track.bb-paused { animation-play-state: paused; }
.bb-ticker-pause { display: flex; align-items: center; justify-content: center; width: 20px; height: 20px; margin: 0; flex: none; background: none; border: 1px solid #666666; border-radius: 50%; color: #9a9a9a; cursor: pointer; padding: 0; }
.bb-ticker-pause:hover { color: #d9d9d9; border-color: #d9d9d9; }
.bb-ticker-pause svg { width: 9px; height: 9px; fill: currentColor; display: block; }
.bb-ticker-pause .bb-play-icon { display: none; }
.bb-ticker-pause.bb-is-paused .bb-pause-icon { display: none; }
.bb-ticker-pause.bb-is-paused .bb-play-icon { display: block; }
.bb-ticker-track { display: flex; width: max-content; animation: bb-ticker-scroll 60s linear infinite; }
.bb-ticker-set { display: flex; align-items: center; }
.bb-ticker-item { display: inline-flex; align-items: center; gap: 10px; font-family: 'Oswald', sans-serif; font-size: 19px; text-transform: uppercase; letter-spacing: 0.12em; color: #d9d9d9; padding: 0 24px; white-space: nowrap; }
.bb-ticker-item svg { width: 22px; height: 22px; fill: #d9d9d9; flex: none; }
.bb-ticker-set i { font-style: normal; color: #666666; padding: 0 24px; }
@keyframes bb-ticker-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }


/* ---------- Framework ---------- */
.bb-framework { padding: 104px 0 72px; }
.bb-framework h2 { font-size: clamp(34px, 5vw, 60px); font-weight: 700; text-align: center; margin-bottom: 64px; }
.bb-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; }
.bb-step { padding: 28px 18px 0; border-left: 1px solid #e0e0e0; }
.bb-step:first-child { border-left: none; }
.bb-step .bb-step-name { font-family: 'Oswald', sans-serif; font-size: 19px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: 12px; }
.bb-step .bb-step-desc { font-size: 15px; color: #333333; line-height: 1.6; margin-top: 4px; }

/* ---------- Stats ---------- */
.bb-stats { background: #f4f4f4; padding: 96px 0; }
.bb-stats-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; max-width: 1000px; margin: 0 auto; }
.bb-stat-fig { font-family: 'Oswald', sans-serif; font-size: clamp(48px, 6vw, 76px); font-weight: 700; line-height: 1.05; white-space: nowrap; }
.bb .bb-stat-text { font-size: 19px; margin-top: 28px; color: #222222; }
.bb .bb-stat-src { font-size: 13px; color: #666666; margin-top: 16px; }

/* ---------- Intake ---------- */
.bb-intake { padding: 104px 0; text-align: center; background: #ffffff; }
.bb-intake h2 { font-size: clamp(34px, 5vw, 60px); font-weight: 700; margin-bottom: 20px; }
.bb-intake > .bb-wrap > p { font-size: 18px; color: #333333; max-width: 620px; margin: 0 auto 48px; }
/* Collapsible form: hidden until the toggle button is clicked. */
.bb-form-toggle { appearance: none; }
.bb-form-collapse { max-height: 0; overflow: hidden; transition: max-height 0.6s ease; }
.bb-form-collapse.open { max-height: 1800px; }
/* Native intake form: Bigin's HTML embed, restyled to the site (square corners,
   black borders, Inter/Oswald only). Bigin's own stylesheet is NOT loaded — its
   global html/body rules would break the page — so every .wf-* hook the form's
   validation script needs is styled here, scoped under .bb-form. */
.bb-form { max-width: 640px; margin: 0 auto; padding-top: 48px; text-align: left; }
.bb-form-hidden-frame { display: none; width: 100%; max-width: 640px; margin: 0 auto; padding-top: 48px; min-height: 320px; border: 0; background: #ffffff; }
.bb-form .wf-row { margin-bottom: 24px; }
.bb-form-name-row { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.bb .bb-form .wf-label { display: block; font-size: 14px; font-weight: 600; letter-spacing: 0.04em; margin-bottom: 8px; }
.bb-form .wf-row:has(.wf-field-mandatory) > .wf-label::after { content: " *"; }
.bb .bb-form .wf-field-input, .bb .bb-form .wf-field-dropdown { width: 100%; border: 1px solid #0a0a0a; border-radius: 0; padding: 13px 14px; min-height: 48px; font-size: 15px; font-family: inherit; background: #ffffff; color: #0a0a0a; }
.bb-form .wf-field-input:focus, .bb-form .wf-field-dropdown:focus { outline: 2px solid #0a0a0a; outline-offset: 2px; }
.bb-form select.wf-field-dropdown { -webkit-appearance: none; appearance: none; background-image: url("data:image/svg+xml;utf8,<svg fill='black' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/></svg>"); background-repeat: no-repeat; background-position: right 12px center; padding-right: 40px; cursor: pointer; }
.bb-form textarea.wf-field-input { resize: vertical; min-height: 110px; line-height: 1.5; }
.bb-form .wf-field-error { display: none; color: #c81e1e; font-size: 13px; margin-top: 6px; }
.bb-form .wf-field-error-active .wf-field-error { display: block; }
.bb-form .wf-field-error-active .wf-field-input, .bb-form .wf-field-error-active .wf-field-dropdown { border-color: #c81e1e; }
.bb-form .wf-error-parent-ele { display: flex; justify-content: flex-start; }
.bb-form .wf-error-view-more { display: none; }
.bb-captcha-inner { display: flex; gap: 12px; align-items: stretch; }
.bb-captcha-inner .wf-field-input { flex: 1; min-width: 0; }
.bb-captcha-img { height: 48px; width: auto; border: 1px solid #0a0a0a; }
.bb-captcha-reload { background: none; border: 0; padding: 0; margin-top: 8px; font-family: inherit; font-size: 13px; color: #666666; text-decoration: underline; cursor: pointer; }
.bb-form-submit { margin-top: 32px; }
.bb-form-submit .bb-btn { appearance: none; }

/* ---------- Industries ---------- */
.bb-industries { padding: 104px 0; background: #0a0a0a; color: #ffffff; text-align: center; }
.bb-industries h2 { font-size: clamp(34px, 5vw, 60px); font-weight: 700; margin-bottom: 56px; }
.bb-industry-list { display: flex; flex-wrap: wrap; justify-content: center; gap: 16px 40px; }
.bb-industry-list span { font-family: 'Oswald', sans-serif; font-size: clamp(17px, 2.4vw, 24px); text-transform: uppercase; letter-spacing: 0.1em; color: #d9d9d9; }

/* ---------- Why Blank ---------- */
.bb-why { padding: 112px 0; text-align: center; }
.bb-why h2 { font-size: clamp(34px, 5vw, 60px); font-weight: 700; margin-bottom: 28px; }
.bb-why > .bb-wrap > p { font-size: 18px; color: #333333; max-width: 680px; margin: 0 auto 28px; }
.bb-why .bb-why-close { font-family: 'Oswald', sans-serif; font-size: clamp(24px, 4vw, 40px); font-weight: 500; text-transform: uppercase; letter-spacing: 0.06em; margin-top: 48px; }

/* ---------- FAQ ---------- */
/* Same band treatment as the stats: a full-width grey block, content in a
   two-column grid like the stats grid. Items are separated by space, not
   hairlines, and align-items:start keeps an expanding answer from stretching
   its row-mate. */
.bb-faq { padding: 96px 0; background: #f4f4f4; }
.bb-faq h2 { font-size: clamp(34px, 5vw, 60px); font-weight: 700; margin-bottom: 48px; text-align: center; }
.bb-faq-list { max-width: 1000px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 32px 64px; align-items: start; }
.bb-faq-item { padding: 0; }
.bb .bb-faq-item h3 { font-family: inherit; font-size: 20px; font-weight: 600; }
.bb-faq-q { display: flex; align-items: center; justify-content: space-between; gap: 16px; width: 100%; background: none; border: 0; padding: 0; cursor: pointer; font-family: inherit; font-size: inherit; font-weight: inherit; color: inherit; text-align: left; }
.bb-faq-chev { width: 16px; height: 16px; flex: none; transition: transform 0.3s ease; }
.bb-faq-item.bb-open .bb-faq-chev { transform: rotate(180deg); }
.bb-faq-a { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.35s ease; }
.bb-faq-item.bb-open .bb-faq-a { grid-template-rows: 1fr; }
.bb .bb-faq-item p { font-size: 17px; color: #333333; line-height: 1.6; overflow: hidden; min-height: 0; padding-top: 12px; }

/* ---------- Us vs. Them ---------- */
/* Clean two-column comparison. The Blank Branding column is a soft grey panel
   (the same #f4f4f4 as the stats block), with a 24px gap between the columns
   so it has breathing room on all sides. No icons, no checkmarks. All <p>
   rules scoped .bb to beat .bb p (0,1,1). */
.bb-compare { padding: 104px 0; border-top: 1px solid #e0e0e0; }
.bb-compare h2 { font-size: clamp(34px, 5vw, 60px); font-weight: 700; text-align: center; margin-bottom: 24px; }
.bb .bb-compare-intro { font-size: 18px; color: #333333; text-align: center; max-width: 680px; margin: 0 auto 56px; }
/* Visually hidden but available to screen readers (table caption). */
.bb-visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
/* Real table, not divs: screen readers can move along rows and columns, and the
   header stays visible while scrolling. The 1048px width offsets the 24px outer
   border-spacing on each side, so the columns span the same 1000px as before. */
.bb-compare-table { width: 100%; max-width: 1048px; margin: 0 auto; border-collapse: separate; border-spacing: 24px 0; table-layout: fixed; }
.bb-compare-table th, .bb-compare-table td { width: 50%; padding: 20px 28px; font-size: 17px; line-height: 1.5; text-align: left; vertical-align: top; }
.bb-compare-table thead th { font-family: 'Oswald', 'Arial Narrow', sans-serif; font-size: 15px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; padding-top: 20px; padding-bottom: 16px; position: sticky; top: 73px; z-index: 10; }
.bb-compare-table thead th:not(.bb-blank) { color: #666666; background: #ffffff; }
.bb-compare-table tbody td:not(.bb-blank) { border-top: 1px solid #e0e0e0; color: #333333; }
.bb-compare-table th.bb-blank, .bb-compare-table td.bb-blank { background: #f4f4f4; color: #0a0a0a; font-weight: 500; }
.bb-compare-table tbody td.bb-blank { border-top: 1px solid rgba(0,0,0,0.10); }
.bb .bb-compare-close { font-family: 'Oswald', sans-serif; font-size: clamp(24px, 4vw, 40px); font-weight: 500; text-transform: uppercase; letter-spacing: 0.06em; text-align: center; margin: 64px auto 0; }
.bb .bb-compare-outro { font-size: 18px; color: #333333; text-align: center; max-width: 680px; margin: 28px auto 0; line-height: 1.7; }

/* ---------- Final CTA ---------- */
.bb-cta { background: #0a0a0a; color: #ffffff; text-align: center; padding: 112px 24px; }
.bb-cta h2 { font-size: clamp(34px, 5vw, 60px); font-weight: 700; margin-bottom: 40px; }
.bb-cta-btns { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }
/* Outline button for dark backgrounds (the Final CTA is black). */
.bb-btn-outline-light { background: transparent; color: #ffffff; border-color: #ffffff; }
.bb a.bb-btn-outline-light { color: #ffffff; }

/* ---------- Footer ---------- */
.bb-footer { padding: 72px 0 48px; border-top: 1px solid #e8e8e8; }
.bb-footer .bb-logo .bb-logo-bg { font-size: 72px; }
.bb-footer .bb-logo .bb-logo-fg { font-size: 22px; }
.bb-footer-grid { display: flex; justify-content: space-between; align-items: flex-end; gap: 40px; flex-wrap: wrap; margin-top: 48px; }
.bb-footer-contact { font-size: 15px; line-height: 2; color: #333333; }
.bb-footer-contact a { border-bottom: 1px solid #0a0a0a; }
.bb-footer-loc { font-size: 13px; line-height: 2; letter-spacing: 0.14em; text-transform: uppercase; color: #666666; }
.bb-footer-services { font-size: 13px; color: #666666; line-height: 2; margin-top: 24px; }
.bb-footer-base { margin-top: 48px; padding-top: 24px; border-top: 1px solid #eeeeee; font-size: 13px; color: #666666; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px; }

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
  .bb-steps { grid-template-columns: repeat(2, 1fr); }
  .bb-step { border-left: none; border-top: 1px solid #e0e0e0; padding-bottom: 28px; }
  .bb-step:nth-child(n+5) { padding-bottom: 0; }
  .bb-step:nth-child(-n+2) { border-top: none; }
  .bb-step:nth-child(even) { border-left: 1px solid #e0e0e0; padding-left: 24px; }
}
@media (max-width: 760px) {
  /* Keep the header Let's Talk button and the language switcher; hide only the text nav links. */
  .bb-nav a:not(.bb-btn):not(.bb-lang-link) { display: none; }
  /* Mobile header must fit a 360px phone: logo (175px) + switcher + button +
     gaps + padding exceeded the viewport once the switcher was added, which
     made the page wider than the screen (gap on the right). Tighten the
     header and shrink the logo slightly so everything fits in one row. */
  .bb-header-inner { padding: 12px 16px; gap: 12px; }
  .bb-nav { gap: 12px; }
  .bb-logo img { height: 34px; }
  .bb-nav .bb-btn { padding: 10px 16px; }
  .bb-cap { flex-direction: column; gap: 20px; padding: 40px 0; }
  .bb-stats-grid { grid-template-columns: 1fr; gap: 48px; }
  .bb-faq-list { grid-template-columns: 1fr; }
  .bb-hero { padding: 72px 0 64px; }
  /* Stat figures must not wrap mid-figure ("Up to" alone on a line). */
  .bb-stat-fig { font-size: clamp(48px, 15vw, 64px); }
  /* Tighten the dead space between sections on small screens. */
  .bb-framework, .bb-stats, .bb-compare, .bb-intake, .bb-industries, .bb-why, .bb-faq, .bb-cta { padding-top: 72px; padding-bottom: 72px; }
  /* Mobile keeps the two-column table (no stacking): 50% columns, 15px type (never below 14px),
     tighter gap and padding; the sticky header keeps the labels visible while scrolling. */
  .bb-compare-table { border-spacing: 12px 0; }
  .bb-compare-table th, .bb-compare-table td { padding: 14px 12px; font-size: 15px; }
  .bb-compare-table thead th { font-size: 13px; letter-spacing: 0.14em; padding-top: 12px; padding-bottom: 12px; }
  .bb-step { padding: 24px 16px; }
  .bb-form-name-row { grid-template-columns: 1fr; gap: 0; }
  .bb-ticker-item { font-size: 17px; padding: 0 16px; }
  .bb-ticker-item svg { width: 20px; height: 20px; }
  .bb-ticker-set i { padding: 0 16px; }
  .bb-step:nth-child(n+5) { padding-bottom: 0; }
}

.bb-reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s ease}
.bb-reveal.bb-on{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.bb-reveal{opacity:1;transform:none;transition:none}.bb-form-collapse{transition:none}.bb-ticker-track{animation:none;flex-wrap:wrap;justify-content:center;width:auto}.bb-ticker-set[aria-hidden="true"]{display:none}.bb-ticker-pause{display:none}.bb-faq-a,.bb-faq-chev{transition:none}.bb-hero-slide{transition:none}.bb-hero-pause{display:none}}

/* ---------- Standalone-site additions (Nov 5) ---------- */
html { scroll-behavior: smooth; }
.bb-logo img { height: 44px; width: auto; }
.bb-footer-logo img { height: 56px; width: auto; }
.bb-hero-eyebrow {
  font-family: 'Oswald', 'Arial Narrow', sans-serif;
  font-size: 14px; font-weight: 500; letter-spacing: 0.28em;
  text-transform: uppercase; color: #666666; margin-bottom: 28px;
}
.skip-link {
  position: absolute; left: 16px; top: -60px; background: #0a0a0a; color: #fff;
  padding: 12px 20px; font-size: 14px; font-weight: 600; text-decoration: none;
  z-index: 100; transition: top 0.2s ease;
}
.skip-link:focus { top: 16px; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .skip-link { transition: none; }
}