/* Brand lift — the interactive sell layer for alternative.html.
   Loud where we talk, quiet where you work. Everything here is additive:
   remove this file + brand-lift.js and the original page is untouched. */
:root{--bl-ink:#101722;--bl-navy:#101b30;--bl-orange:#ff9900;--bl-orange-hi:#ffb84a;--bl-paper:#f7f7f4;--bl-muted:#607089;--bl-line:#e6e8ec;--bl-green:#1f9d61;--bl-orange-text:#ff9900;--bl-focus:#101b30;--bl-ease:cubic-bezier(.22,1,.36,1)}

/* ---------- scroll progress ---------- */
.bl-progress{position:fixed;inset:0 0 auto;height:3px;z-index:60;pointer-events:none}
.bl-progress i{display:block;height:100%;width:100%;transform-origin:0 50%;transform:scaleX(var(--bl-progress,0));background:linear-gradient(90deg,var(--bl-orange),var(--bl-orange-hi));box-shadow:0 0 12px #ff990080}

/* ---------- reveal on scroll (only once JS opts in) ---------- */
.bl-js [data-bl-reveal]{opacity:0;transform:translateY(28px);transition:opacity .9s var(--bl-ease),transform .9s var(--bl-ease);transition-delay:var(--bl-delay,0s)}
.bl-js [data-bl-reveal].is-in{opacity:1;transform:none}

/* ---------- shared bits ---------- */
.bl-section-cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:44px}
.bl-section-cta small{font-size:13px;color:var(--bl-muted)}
.bl-section-cta .bl-textlink{font-size:14px;font-weight:700;color:inherit;text-decoration:underline;text-decoration-color:var(--bl-orange);text-decoration-thickness:2px;text-underline-offset:5px}
.bl-section-cta .bl-textlink:hover{color:#b86400}
.bl-section-cta .bl-textlink{position:relative;display:inline-block}
.bl-section-cta .bl-textlink::before{content:"";position:absolute;left:0;right:0;top:50%;height:44px;margin-top:-22px}

/* ---------- hero: live activity toast + tilt ---------- */
.dashboard-stage{position:relative;overflow:hidden;overflow:clip}
.dashboard-mobile{pointer-events:none}
.bl-tilt{transition:transform .6s var(--bl-ease);transform:perspective(1400px) rotateX(var(--bl-rx,0deg)) rotateY(var(--bl-ry,0deg))}
.bl-live{position:absolute;right:36px;top:64px;z-index:5;pointer-events:none;display:flex;align-items:center;gap:12px;min-width:268px;max-width:320px;padding:12px 16px 12px 12px;border-radius:16px;background:#ffffffeb;backdrop-filter:blur(14px) saturate(160%);-webkit-backdrop-filter:blur(14px) saturate(160%);border:1px solid #fff;box-shadow:0 18px 40px #10172224,0 2px 6px #1017220f;color:var(--bl-ink);transition:opacity .45s var(--bl-ease),transform .45s var(--bl-ease)}
.bl-live{animation:bl-toast-in .8s var(--bl-ease) .6s backwards}
@keyframes bl-toast-in{from{opacity:0;transform:translateY(-12px) scale(.96)}}
.bl-live.is-swapping{opacity:0;transform:translateY(8px) scale(.98)}
.bl-live-icon{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:#fff3de;color:#b86700;font-size:16px;font-weight:800}
.bl-live[data-tone="paid"] .bl-live-icon{background:#dcf7e8;color:var(--bl-green)}
.bl-live[data-tone="nudge"] .bl-live-icon{background:#ece9ff;color:#5b49d6}
.bl-live-text{display:grid;gap:2px;min-width:0}
.bl-live-text strong{font-size:13px;font-weight:700;letter-spacing:-.01em;line-height:1.3}
.bl-live-text small{font-size:11px;color:var(--bl-muted);display:flex;align-items:center;gap:6px}
.bl-live-text small::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--bl-green);box-shadow:0 0 0 0 #1f9d6180;animation:bl-pulse 2s infinite}
.bl-live.is-off .bl-live-text small::before{animation-play-state:paused}
@keyframes bl-pulse{70%{box-shadow:0 0 0 7px #1f9d6100}100%{box-shadow:0 0 0 0 #1f9d6100}}

/* ---------- hero: working product demo ---------- */
.hero-dashboard h1 span{position:relative;display:inline-block;z-index:0}
.hero-dashboard h1 span::before{content:"";position:absolute;left:-.06em;right:-.08em;bottom:.08em;height:.36em;border-radius:.08em;background:#ffe3b8;z-index:-1;transform-origin:0 50%;transform:scaleX(0);animation:bl-highlight .9s var(--bl-ease) .75s forwards}
@keyframes bl-highlight{to{transform:scaleX(1)}}
.dashboard-mobile{translate:var(--bl-px,0) var(--bl-py,0);transition:translate .6s var(--bl-ease)}
.preview-filters>span,.preview-card-actions span,.preview-create{cursor:pointer;user-select:none;transition:transform .2s var(--bl-ease),box-shadow .25s,filter .2s}
.preview-filters>span:hover,.preview-card-actions span:hover,.preview-create:hover{transform:translateY(-1px);filter:brightness(1.03)}
.preview-filters>span:active,.preview-card-actions span:active,.preview-create:active{transform:scale(.97)}
.preview-filters>span:focus-visible,.preview-card-actions span:focus-visible,.preview-create:focus-visible{outline:2px dashed var(--bl-focus);outline-offset:6px}
.preview-filters>span.bl-filter-on{position:relative;box-shadow:0 0 0 2px #fff,0 0 0 4px var(--bl-navy),0 8px 16px #101b301f}
.preview-filters>span.bl-filter-on::after{content:"";position:absolute;left:50%;bottom:-10px;width:6px;height:6px;border-radius:50%;background:var(--bl-navy);translate:-50% 0}
.preview-filters b{transition:transform .3s var(--bl-ease)}
.preview-filters b.bl-bump{animation:bl-bump .45s var(--bl-ease)}
@keyframes bl-bump{40%{transform:scale(1.35)}}
.preview-cards>[hidden]{display:none!important}
.preview-invoice{position:relative}
.preview-invoice.bl-card-in{animation:bl-card-in .5s var(--bl-ease) both}
@keyframes bl-card-in{from{opacity:0;scale:.94;translate:0 8px}}
.preview-invoice.bl-ping::after{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;animation:bl-ping 1.4s ease-out}
@keyframes bl-ping{0%{box-shadow:0 0 0 0 #ff9900aa}60%{box-shadow:0 0 0 10px #ff990000}100%{box-shadow:0 0 0 0 #ff990000}}
.preview-invoice .preview-card-bottom>strong,.preview-invoice .preview-status{transition:color .4s}
.bl-empty{grid-column:1;padding:34px 16px;text-align:left;font-size:13px;font-weight:600;color:#607089;border:1px dashed #d5dce6;border-radius:18px;animation:bl-card-in .4s var(--bl-ease) both}
.bl-hint{position:relative}
.bl-hint::after{content:"";position:absolute;inset:-3px;border-radius:inherit;border:2px solid var(--bl-orange);animation:bl-hint 1.8s ease-out infinite;pointer-events:none}
@keyframes bl-hint{0%{opacity:.9;scale:1}100%{opacity:0;scale:1.35}}
@media (prefers-reduced-motion:reduce){
 .preview-invoice.bl-card-in,.preview-invoice.bl-ping::after,.bl-hint::after,.bl-empty,.bl-live,.preview-filters b.bl-bump{animation:none}
 .hero-dashboard h1 span::before{animation:none;transform:none}
 .dashboard-mobile{translate:none}
}

/* ---------- proof strip ---------- */
.bl-proof{padding:8px 0 64px}
.bl-proof-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--bl-line);border-bottom:1px solid var(--bl-line)}
.bl-proof-item{padding:26px 26px 24px;border-left:1px solid var(--bl-line)}
.bl-proof-item:first-child{border-left:0;padding-left:0}
.bl-proof-item strong{display:block;font-size:clamp(28px,3vw,40px);font-weight:800;letter-spacing:-.05em;line-height:1;color:var(--bl-navy)}
.bl-proof-item strong em{font-style:normal;color:var(--bl-orange-text)}
.bl-proof-item>span{display:block;margin-top:10px;font-size:13px;line-height:1.5;color:var(--bl-muted);max-width:230px}

/* ---------- problem band ---------- */
.bl-problem{position:relative;overflow:hidden;overflow:clip;background:#fff;color:var(--bl-navy);padding:110px 0 0;border-top:1px solid var(--bl-line)}
.bl-problem::before{content:"";position:absolute;inset:-35% -12% auto auto;width:760px;height:760px;border-radius:50%;background:radial-gradient(closest-side,#ff99001f,transparent);pointer-events:none}

.bl-net{margin:0;font-size:clamp(52px,8.4vw,128px);font-weight:800;letter-spacing:-.065em;line-height:.98}
.bl-net span{display:block;position:relative;width:max-content;color:#8792a4;transition:color .6s var(--bl-ease)}
.bl-net span::after{content:"";position:absolute;left:-2%;right:-2%;top:54%;height:.07em;border-radius:99px;background:var(--bl-orange);transform:scaleX(0);transform-origin:0 50%;transition:transform .7s var(--bl-ease)}
.bl-net span.is-struck::after{transform:scaleX(1)}
.bl-net span.is-lit{color:var(--bl-navy)}
.bl-net span:last-child{color:var(--bl-orange-text)}
.bl-net span:last-child::after{display:none}
.bl-problem-grid{position:relative;display:grid;grid-template-columns:1.25fr .9fr;gap:60px;align-items:end}
.bl-problem-copy p{margin:0;font-size:19px;line-height:1.6;color:var(--bl-muted);max-width:470px}
.bl-problem-copy p b{color:var(--bl-navy);font-weight:700}

.bl-marquee{position:relative;margin-top:88px;padding:30px 0 30px;border-top:1px solid var(--bl-line)}
.bl-marquee-rows{display:grid;gap:14px;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.bl-marquee-row{display:flex;gap:14px;padding-right:14px;width:max-content;animation:bl-marquee 60s linear infinite}
.bl-marquee-row.is-reverse{animation-direction:reverse;animation-duration:70s}
.bl-marquee-rows:hover .bl-marquee-row,.bl-marquee-rows:focus-within .bl-marquee-row{animation-play-state:paused}
.bl-marquee-row span{flex:none;padding:13px 20px;border-radius:99px;background:var(--bl-paper);border:1px solid var(--bl-line);font-size:15px;color:var(--bl-navy);white-space:nowrap}
.bl-marquee-row span b{color:#a85a00;font-weight:700}
@keyframes bl-marquee{to{transform:translateX(-50%)}}

/* ---------- feature card spotlight ---------- */
.bizzy-feature{transition:transform .5s var(--bl-ease),box-shadow .5s var(--bl-ease)}
.bizzy-feature::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .4s;background:radial-gradient(420px circle at var(--bl-mx,50%) var(--bl-my,50%),#ffffff55,transparent 60%);z-index:0}
@media (hover:hover) and (pointer:fine){
 .bizzy-feature:hover{transform:translateY(-6px)}
 .bizzy-feature:hover::before{opacity:1}
 #how-it-works .bizzy-feature:hover{box-shadow:inset 3px 4px 9px #93500038,inset -2px -3px 6px #fff1bd80,0 30px 60px #b9650033}
}

/* ---------- feature cards: looping story animations ----------
   Uses the individual translate/scale properties so the cards' existing
   transform:rotate() tilts are kept. Paused until the card is on screen. */
.bl-js .bizzy-feature:not(.is-live) .feature-art *,.bl-js .bizzy-feature:not(.is-live) .feature-art *::after{animation-play-state:paused}
/* SEND */
.send-invoice-document{animation:bl-float 5s ease-in-out infinite alternate}
.send-w9-document{animation:bl-sway 6s ease-in-out infinite alternate}
.document-tags span{animation:bl-tag 8s var(--bl-ease) infinite}
.document-tags span:nth-child(2){animation-delay:.25s}
.bl-sent-pill{position:absolute;left:50%;bottom:22px;z-index:3;display:inline-flex;align-items:center;gap:8px;padding:9px 14px 9px 9px;border-radius:99px;background:#fff;box-shadow:0 12px 26px #6a3c0033;font-size:12px;font-weight:700;color:var(--bl-navy);white-space:nowrap;translate:-50% 0;opacity:0;animation:bl-sent 8s var(--bl-ease) infinite}
.bl-sent-pill i{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--bl-green);color:#fff;font-style:normal;font-size:11px}
@keyframes bl-float{to{translate:0 -8px}}
@keyframes bl-sway{to{translate:8px -4px}}
@keyframes bl-tag{0%,4%{scale:.6;opacity:0}12%{scale:1.08;opacity:1}18%,100%{scale:1;opacity:1}}
@keyframes bl-sent{0%,48%{opacity:0;translate:-50% 18px;scale:.9}58%{opacity:1;translate:-50% -4px;scale:1.03}64%,88%{opacity:1;translate:-50% 0;scale:1}96%,100%{opacity:0;translate:-50% -14px;scale:.96}}
/* TRACK */
.track-art .feature-invoice{animation:bl-row 7.5s var(--bl-ease) infinite}
.track-art .feature-invoice:nth-of-type(2){animation-delay:0s}
.track-art .feature-invoice:nth-of-type(3){animation-delay:.18s}
.track-art .feature-invoice:nth-of-type(4){animation-delay:.36s}
.track-art .feature-invoice.pink small{animation:bl-overdue 1.8s ease-in-out infinite}
@keyframes bl-row{0%{opacity:0;translate:26px 0}9%{opacity:1;translate:0 0}30%{translate:0 0;scale:1}36%{translate:0 -5px;scale:1.025}44%,92%{translate:0 0;scale:1;opacity:1}100%{opacity:0;translate:-14px 0}}
@keyframes bl-overdue{50%{box-shadow:0 0 0 5px #ef444422}}
/* FOLLOW UP */
.follow-email-mock{animation:bl-mail-in 8s var(--bl-ease) infinite}
.follow-email-top span:last-child{animation:bl-fade-in 8s ease infinite}
.follow-imessage-mock{transform-origin:85% 100%;animation:bl-bubble 8s var(--bl-ease) infinite}
.imessage-delivered{animation:bl-delivered 8s ease infinite}
@keyframes bl-mail-in{0%{opacity:0;translate:0 -22px}10%,90%{opacity:1;translate:0 0}100%{opacity:0;translate:0 -10px}}
@keyframes bl-fade-in{0%,16%{opacity:0}22%,100%{opacity:1}}
@keyframes bl-bubble{0%,30%{opacity:0;scale:.6;translate:0 16px}40%{opacity:1;scale:1.04;translate:0 0}46%,90%{opacity:1;scale:1}100%{opacity:0;scale:.96}}
@keyframes bl-delivered{0%,50%{opacity:0}58%,100%{opacity:1}}
/* GET PAID */
.paid-success-icon{position:relative;animation:bl-check 8s var(--bl-ease) infinite}
.paid-success-icon::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid #1f9d61;opacity:0;animation:bl-ripple 8s ease-out infinite}
.paid-receipt-amount{font-variant-numeric:tabular-nums}
.paid-reminders{animation:bl-reminders 8s var(--bl-ease) infinite}
@keyframes bl-check{0%,6%{scale:0;opacity:0}14%{scale:1.2;opacity:1}20%,100%{scale:1;opacity:1}}
@keyframes bl-ripple{0%,14%{opacity:0;scale:1}16%{opacity:.8}34%,100%{opacity:0;scale:2.1}}
@keyframes bl-reminders{0%,36%{opacity:0;translate:0 12px}46%,92%{opacity:1;translate:0 0}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){
 .bizzy-feature .feature-art *,.bizzy-feature .feature-art *::after{animation:none!important}
 .bl-sent-pill{opacity:1}
}

/* ---------- platform tour (work-examples) ---------- */
.work-examples-heading h2 .bl-accent{color:var(--bl-orange-text)}
.work-example-layout{align-items:start}
.bl-work-left{display:flex;flex-direction:column;gap:28px;padding-top:8px}
.bl-work-cta{margin:0;display:flex}
.work-professions{gap:10px}
.work-professions button{position:relative;overflow:hidden;cursor:pointer;background:transparent;border-color:transparent;padding:22px 24px;transition:background .35s var(--bl-ease),box-shadow .35s var(--bl-ease),border-color .35s,transform .35s var(--bl-ease)}
.work-professions button:hover{border-color:var(--bl-line);background:#fbfbfa}
.work-professions button[aria-pressed=true]{background:#fff;border-color:#fff;box-shadow:0 18px 40px #101b3014,0 2px 6px #101b300a}
.work-professions button>span{font-weight:700;color:#6b778a;transition:color .3s}
.work-professions button[aria-pressed=true]>span{color:#a85a00}
.work-professions strong{transition:color .3s}
.work-professions button:not([aria-pressed=true]) strong{color:#8792a4}
.work-professions b{display:none}
.bl-tab-progress{position:absolute;left:24px;right:24px;bottom:0;height:3px;border-radius:3px;background:#ff990022;opacity:0;transition:opacity .3s}
.bl-tab-progress::after{content:"";position:absolute;inset:0;border-radius:inherit;background:var(--bl-orange);transform-origin:0 50%;transform:scaleX(0)}
.work-professions button[aria-pressed=true] .bl-tab-progress{opacity:1}
.work-examples.is-touring .work-professions button[aria-pressed=true] .bl-tab-progress::after{animation:bl-tab-fill var(--bl-tour,6s) linear forwards}
.work-examples.is-paused .work-professions button[aria-pressed=true] .bl-tab-progress::after{animation-play-state:paused}
@keyframes bl-tab-fill{to{transform:scaleX(1)}}
/* stacked panels crossfade instead of hard-swapping; stage keeps one height */
.bl-js .work-invoice-stage{display:grid;grid-template-columns:minmax(0,1fr);padding:28px}
.bl-js .work-invoice-stage>.work-area-panel{min-width:0;width:auto;max-width:none;height:auto;min-height:0;margin:0;align-self:stretch;box-sizing:border-box}
.bl-js .work-invoice-stage>.work-area-panel{grid-area:1/1;transition:opacity .55s var(--bl-ease),translate .55s var(--bl-ease),visibility 0s}
.bl-js .work-invoice-stage>.work-area-panel{justify-self:stretch}
.bl-js .work-invoice-stage>.work-invoice{align-self:start}
.bl-js .work-invoice-stage>.work-area-panel[hidden]{display:block!important;visibility:hidden;opacity:0;translate:0 14px;pointer-events:none;transition:opacity .35s ease,translate .35s ease,visibility 0s linear .35s}
.work-area-panel.bl-enter .platform-finance-stat,.work-area-panel.bl-enter .platform-contact-card,.work-area-panel.bl-enter #work-line-items tr,.work-area-panel.bl-enter .platform-tax-card,.work-area-panel.bl-enter .platform-scoreboard,.work-area-panel.bl-enter .work-document-total{animation:bl-rise .6s var(--bl-ease) both}
.work-area-panel.bl-enter :is(.platform-finance-stat,.platform-contact-card,#work-line-items tr,.platform-tax-card,.platform-scoreboard,.work-document-total){animation-delay:calc(var(--bl-i,0) * .07s)}
@keyframes bl-rise{from{opacity:0;translate:0 14px}}
/* Tour (2026-09-29): every panel is an A4 page (210 × 297) in an orange stage sized to it;
   heading, tabs and CTA share the left column at the page's height. */
.work-example-layout{margin-top:0}
@media (min-width:761px){
 .work-example-layout{grid-template-columns:minmax(0,1fr) min(600px,55%);align-items:stretch}
 .bl-work-left{justify-content:space-between;gap:28px;padding-top:0}
 .bl-work-left .work-examples-heading h2{font-size:clamp(34px,3.7vw,54px)}
}
/* Tablet portrait: one column — heading, the three tabs side by side, a centred page, then the CTA */
@media (min-width:761px) and (max-width:899px){
 .work-example-layout{grid-template-columns:minmax(0,1fr);row-gap:28px}
 .bl-work-left{display:contents}
 .work-professions{flex-direction:row}
 .work-professions button{flex:1 1 0;min-width:0}
 .bl-work-cta{order:3;justify-content:center}
 .work-invoice-stage{width:min(480px,100%);justify-self:center}
}
/* Phones: keep the page a phone-sized sheet rather than a full-width poster */
@media (max-width:760px){
 .work-invoice-stage{width:min(460px,100%);justify-self:center}
}
.bl-js .work-invoice-stage{align-content:center}
.bl-js .work-invoice-stage>.work-area-panel,.work-invoice,.work-app-preview,.platform-finance-preview,#work-panel-contacts.platform-contacts-preview{aspect-ratio:210/297;min-height:0;height:auto;align-self:start;overflow:hidden}
@media (max-width:760px){
 .bl-work-left{display:contents}
 .bl-work-cta{order:3;justify-content:center}
 .work-professions button{padding:13px 6px}
 .work-professions button:not([aria-pressed=true]){background:#f4f5f7}
 .work-professions button:not([aria-pressed=true]) strong{color:#607089}
 .bl-tab-progress{left:14px;right:14px}
 .bl-js .work-invoice-stage{padding:14px}
}
@media (prefers-reduced-motion:reduce){
 .bl-js .work-invoice-stage>.work-area-panel{transition:none}
 .work-area-panel.bl-enter *{animation:none!important}
}

/* ---------- finance: interactive money card ---------- */
.bl-money{width:min(100%,460px);margin:0 0 28px;padding:20px 22px 18px;border-radius:24px;background:#fff;box-shadow:0 30px 60px #8a4a0033,0 2px 8px #8a4a001a;color:var(--bl-navy)}
.bl-money-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.bl-seg{position:relative;display:inline-flex;padding:4px;border-radius:99px;background:var(--bl-paper);border:1px solid var(--bl-line)}
.bl-seg button{position:relative;z-index:1;padding:7px 14px;border:0;border-radius:99px;background:transparent;font:inherit;font-size:12.5px;font-weight:700;color:var(--bl-muted);cursor:pointer;transition:color .25s}
.bl-seg button[aria-pressed=true]{color:#fff}
.bl-seg button:focus-visible{outline:2px solid var(--bl-focus);outline-offset:2px}
.bl-seg::before{content:"";position:absolute;top:4px;bottom:4px;left:var(--bl-seg-x,4px);width:var(--bl-seg-w,60px);border-radius:99px;background:var(--bl-navy);transition:left .45s var(--bl-ease),width .45s var(--bl-ease)}
.bl-money-demo{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#6b778a}
.bl-money-hero{margin-top:16px}
.bl-money-hero span{font-size:12px;font-weight:700;color:var(--bl-muted)}
.bl-money-hero strong{display:block;margin-top:2px;font-size:42px;font-weight:800;letter-spacing:-.05em;line-height:1.05;font-variant-numeric:tabular-nums}
.bl-bars{display:flex;align-items:flex-end;gap:6px;height:96px;margin-top:14px;padding-bottom:18px;position:relative}
.bl-bar{position:relative;flex:1;height:100%;display:flex;align-items:flex-end;cursor:pointer}
.bl-bar i{display:block;width:100%;height:var(--h);border-radius:7px 7px 3px 3px;background:linear-gradient(180deg,#ffb84a,#ff9900);transform-origin:50% 100%;animation:bl-bar-grow .7s var(--bl-ease) both;animation-delay:var(--d);transition:filter .2s,opacity .2s}
.bl-bars:hover .bl-bar i{opacity:.45}
.bl-bars .bl-bar:hover i,.bl-bars .bl-bar:focus-visible i{opacity:1;filter:saturate(1.2)}
.bl-bar small{position:absolute;left:50%;bottom:-18px;translate:-50% 0;font-size:10px;font-weight:700;color:#6b778a;white-space:nowrap}
.bl-bar em{position:absolute;left:50%;bottom:calc(var(--h) + 8px);translate:-50% 4px;padding:4px 8px;border-radius:8px;background:var(--bl-navy);color:#fff;font-style:normal;font-size:11px;font-weight:700;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .2s,translate .2s;z-index:2}
.bl-bar:hover em,.bl-bar:focus-visible em{opacity:1;translate:-50% 0}
.bl-bar:focus-visible{outline:2px solid var(--bl-focus);outline-offset:3px;border-radius:6px}
@keyframes bl-bar-grow{from{transform:scaleY(0)}}
.bl-money-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px;padding-top:14px;border-top:1px solid var(--bl-line)}
.bl-money-stats span{display:flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;color:var(--bl-muted)}
.bl-money-stats i{width:7px;height:7px;border-radius:50%}
.bl-money-stats b{display:block;margin-top:4px;font-size:18px;font-weight:800;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
#mobile-finance .finance-copy h2{margin-bottom:24px}
.bl-quote-grid>*,.bl-voices-grid>*{min-width:0}
/* clip (not hidden) so focus/scrollIntoView can never scroll the section's overflow and shift its content */
#mobile-finance{overflow:clip}
@media (max-width:760px){
 #mobile-finance .mobile-finance-inner{display:flex!important;flex-direction:column;min-height:0!important}
 #mobile-finance .finance-copy{order:1;padding:36px 0 0!important}
 #mobile-finance .finance-copy{align-self:stretch;width:100%}
 #mobile-finance .bl-money{width:100%;max-width:520px;margin:22px 0 20px}
 #mobile-finance .finance-copy>a.button{position:relative!important;top:auto!important;right:auto!important}
 #mobile-finance .finance-device{order:2;position:relative!important;left:auto!important;bottom:auto!important;width:100%!important;height:300px!important;margin-top:18px}
 #mobile-finance .finance-device img{left:50%!important;width:400px!important;height:538px!important;top:0!important}
}
@media (max-width:760px){.bl-money{padding:16px 16px 14px}.bl-money-hero strong{font-size:34px}.bl-money-stats b{font-size:15px}.bl-seg button{padding:7px 11px}}
@media (prefers-reduced-motion:reduce){.bl-bar i{animation:none}.bl-seg::before{transition:none}}

/* ---------- voices ---------- */
.bl-voices{padding:120px 0;background:var(--bl-paper);color:var(--bl-navy)}
.bl-voices-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:64px;align-items:center}
.bl-h2{margin:0;font-size:clamp(38px,4.6vw,62px);font-weight:800;letter-spacing:-.055em;line-height:1.04}
.bl-h2 span{color:var(--bl-orange-text)}
.bl-lede{margin:22px 0 0;font-size:17px;line-height:1.65;color:var(--bl-muted);max-width:470px}
.bl-personas{display:grid;gap:12px;margin-top:36px}
.bl-persona{display:grid;grid-template-columns:52px 1fr auto;align-items:center;gap:16px;width:100%;padding:16px 18px;border-radius:18px;border:1px solid var(--bl-line);background:#fff;color:inherit;font:inherit;text-align:left;cursor:pointer;transition:border-color .25s,box-shadow .35s var(--bl-ease),transform .35s var(--bl-ease)}
.bl-persona:hover{transform:translateX(4px);box-shadow:0 12px 30px #101b3012}
.bl-persona:focus-visible{outline:2px solid var(--bl-focus);outline-offset:3px}
.bl-persona[aria-pressed="true"]{border-color:var(--bl-navy);box-shadow:0 0 0 1px var(--bl-navy),0 16px 34px #ff990022}
.bl-persona-face{display:block;width:52px;height:52px;border-radius:50%;object-fit:cover;box-shadow:0 6px 14px #101b301f}
.bl-persona strong{display:block;font-size:16px;letter-spacing:-.02em}
.bl-persona small{display:block;margin-top:3px;font-size:13px;color:var(--bl-muted)}
.bl-persona i{font-style:normal;font-size:11px;font-weight:700;letter-spacing:.06em;padding:5px 10px;border-radius:99px;background:var(--bl-tag-bg);color:var(--bl-tag)}
.bl-mail{position:relative;border-radius:26px;background:#fff;border:1px solid #fff;box-shadow:0 40px 80px #101b301c,0 3px 10px #101b300d;overflow:hidden}
.bl-mail-bar{display:flex;align-items:center;justify-content:space-between;padding:16px 22px;border-bottom:1px solid var(--bl-line);font-size:12px;color:var(--bl-muted)}
.bl-mail-bar b{display:inline-flex;align-items:center;gap:8px;color:var(--bl-navy);font-weight:700}
.bl-mail-bar b::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--bl-orange)}
.bl-mail-body{padding:26px 28px 30px}
.bl-mail-row{display:flex;gap:10px;padding:9px 0;border-bottom:1px solid #f0f1f4;font-size:14px}
.bl-mail-row span{width:62px;flex:none;color:var(--bl-muted)}
.bl-mail-row strong{font-weight:700}
.bl-mail-textwrap{display:grid;margin:22px 0 0}
.bl-mail-textwrap>*{grid-area:1/1}
.bl-mail-ghost{visibility:hidden}
.bl-mail-textwrap .bl-mail-ghost::after{display:none}
.bl-mail-text{margin:0;font-size:16px;line-height:1.7;color:#27324a;white-space:pre-line}
.bl-mail-text::after{content:"";display:inline-block;width:2px;height:1.1em;margin-left:2px;vertical-align:-3px;background:var(--bl-orange);animation:bl-caret 1s steps(1) infinite}
.bl-mail.is-done .bl-mail-text::after{display:none}
@keyframes bl-caret{50%{opacity:0}}
.bl-mail-attach{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.bl-mail-attach span{padding:8px 12px;border-radius:10px;background:var(--bl-paper);border:1px solid var(--bl-line);font-size:12px;font-weight:700}
.bl-mail-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 22px;background:#fbfbfa;border-top:1px solid var(--bl-line);font-size:12px;color:var(--bl-muted)}
.bl-mail-foot b{color:#177a4c}

/* ---------- 60-second invoice ---------- */
.bl-quote{position:relative;padding:120px 0;background:#fff;color:var(--bl-navy);overflow:hidden;overflow:clip}
.bl-quote-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:64px;align-items:start}
.bl-controls{margin-top:40px;display:grid;grid-template-columns:minmax(0,1fr);gap:38px}
.bl-control label,.bl-control .bl-control-label{display:flex;justify-content:space-between;align-items:baseline;font-size:13px;font-weight:700;color:var(--bl-navy);margin-bottom:16px}
.bl-control .bl-readout{font-size:15px;font-weight:800;color:var(--bl-navy);font-variant-numeric:tabular-nums}
.bl-roles{display:flex;flex-wrap:nowrap;gap:4px;overflow-x:auto;scrollbar-width:none;margin:-5px;padding:5px} /* one row; scrolls sideways only when it can't fit */
.bl-roles::-webkit-scrollbar{display:none}
.bl-roles.is-more{-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 56px),transparent);mask-image:linear-gradient(to right,#000 calc(100% - 56px),transparent)}
.bl-roles button{flex:none;white-space:nowrap;padding:7px 8px;border-radius:99px;border:1px solid var(--bl-line);background:#fff;color:var(--bl-navy);font:inherit;font-size:11.5px;font-weight:700;cursor:pointer;transition:background .2s,border-color .2s,color .2s,transform .2s}
.bl-roles button:hover{border-color:var(--bl-orange);transform:translateY(-1px)}
.bl-roles button[aria-pressed="true"]{background:var(--bl-navy);border-color:var(--bl-navy);color:#fff}
.bl-roles button:focus-visible{outline:2px solid var(--bl-focus);outline-offset:2px}
.bl-range{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:99px;background:linear-gradient(90deg,var(--bl-orange) var(--bl-fill,50%),#eceef2 var(--bl-fill,50%));margin:0;cursor:pointer}
.bl-range:focus-visible{outline:2px solid var(--bl-focus);outline-offset:8px}
.bl-range::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;border-radius:50%;background:#fff;border:2px solid var(--bl-orange);box-shadow:0 4px 12px #ff990050;transition:transform .2s}
.bl-range::-webkit-slider-thumb:hover{transform:scale(1.12)}
.bl-range::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:#fff;border:2px solid var(--bl-orange);box-shadow:0 4px 12px #ff990050}
.bl-range:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px #fff,0 0 0 5px var(--bl-focus)}
.bl-range:focus-visible::-moz-range-thumb{box-shadow:0 0 0 3px #fff,0 0 0 5px var(--bl-focus)}
.bl-invoice-wrap{position:relative;padding:30px;border-radius:32px;background:linear-gradient(160deg,#ffb23f,#ff9900 55%,#f28c00);box-shadow:0 50px 90px #ff990038}
.bl-invoice-wrap::before{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(500px circle at 80% 0%,#ffffff55,transparent 60%);pointer-events:none}
.bl-invoice{position:relative;border-radius:20px;background:#fff;padding:30px 30px 26px;box-shadow:0 20px 40px #8a4a0030}
.bl-invoice-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.bl-invoice-head h3{margin:0;font-size:30px;font-weight:800;letter-spacing:-.04em;color:var(--bl-orange-text)}
.bl-invoice-head small{display:block;margin-top:4px;font-size:12px;color:var(--bl-muted)}
.bl-invoice-to{text-align:right;font-size:12px;color:var(--bl-muted);line-height:1.5}
.bl-invoice-to b{display:block;color:var(--bl-navy);font-size:14px}
.bl-invoice-project{margin:22px 0 6px;padding:12px 14px;border-radius:12px;background:var(--bl-paper);font-size:13px}
.bl-invoice-project span{display:block;font-size:10px;font-weight:700;letter-spacing:.14em;color:var(--bl-muted);margin-bottom:3px}
.bl-invoice-project strong{font-weight:700}
.bl-lines{width:100%;border-collapse:collapse;margin-top:10px;font-size:14px;font-variant-numeric:tabular-nums}
.bl-lines td{padding:13px 0;border-bottom:1px solid #f0f1f4}
.bl-lines td:last-child{text-align:right;font-weight:700}
.bl-lines small{display:block;color:var(--bl-muted);font-size:12px;margin-top:2px}
.bl-total{display:flex;justify-content:space-between;align-items:baseline;margin-top:18px}
.bl-total span{font-size:13px;font-weight:700;color:var(--bl-muted)}
.bl-total strong{font-size:clamp(34px,4vw,48px);font-weight:800;letter-spacing:-.05em;font-variant-numeric:tabular-nums}
.bl-invoice-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.bl-invoice-tags span{padding:6px 11px;border-radius:99px;font-size:11px;font-weight:700;background:#fff3de;color:#8a5000}
.bl-invoice-tags span.is-green{background:#dcf7e8;color:#146a41}
.bl-timeline{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:22px;padding:0 4px}
.bl-timeline::before{content:"";position:absolute;left:12%;right:12%;top:13px;height:2px;background:#ffffff70}
.bl-timeline::after{content:"";position:absolute;left:12%;top:13px;height:2px;width:calc(76% * var(--bl-step,0) / 3);background:#fff;transition:width .6s var(--bl-ease)}
.bl-timeline li{position:relative;z-index:1;list-style:none;text-align:center;font-size:11px;font-weight:700;color:#5c3500}
.bl-timeline li::before{content:"";display:block;width:14px;height:14px;margin:6px auto 10px;border-radius:50%;background:#ffd89a;border:3px solid #ffb23f;transition:background .3s,transform .3s}
.bl-timeline li.is-on::before{background:#fff;transform:scale(1.2)}
.bl-timeline{margin-bottom:0}
/* Side by side, the invoice panel matches the left column's height: the white invoice fills the frame,
   the total and its tags settle at the bottom like a real invoice, the timeline stays underneath. */
@media (min-width:1001px){
 .bl-quote-grid{align-items:stretch}
 .bl-invoice-wrap{display:flex;flex-direction:column}
 .bl-invoice{flex:1;display:flex;flex-direction:column}
 .bl-invoice .bl-total{margin-top:auto;padding-top:18px}
}

/* ---------- closing reassurance ---------- */
.bl-assure{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:14px}
/* Brand rule (operator, 2026-09-28): big titles on orange are always white. Small text stays navy for legibility. */
#signup.closing #closing-title,#mobile-finance .finance-copy #finance-title,.features-grid .bizzy-feature .feature-copy h3{color:#fff}
#signup.closing .bl-assure span{color:#fff;background:#ffffff29;border-color:#ffffff73}
#signup.closing .bl-assure span::before{color:#fff}
.bl-assure span{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:99px;background:#ffffff26;border:1px solid #ffffff40;font-size:12px;font-weight:700;color:inherit}
.bl-assure span::before{content:"✓";font-size:11px}

/* ---------- responsive ---------- */
@media (max-width:1000px){
 .bl-voices-grid,.bl-quote-grid,.bl-problem-grid{grid-template-columns:1fr;gap:44px}
 .bl-proof-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .bl-proof-item:nth-child(3){border-left:0;padding-left:0}
 .bl-proof-item:nth-child(n+3){border-top:1px solid var(--bl-line)}
}
@media (max-width:760px){
 .bl-live{display:none}
 .bl-proof{padding:4px 0 40px}
 .bl-proof-item{padding:20px 14px 18px}
 .bl-proof-item:nth-child(odd){padding-left:0}
 .bl-problem{padding-top:80px}
 .bl-problem-copy p{font-size:17px}
 .bl-marquee{margin-top:56px}
 .bl-marquee-row span{font-size:13px;padding:11px 16px}
 .bl-voices,.bl-quote{padding:84px 0}
 .bl-mail-body{padding:22px 20px 24px}
 .bl-mail-text{font-size:15px}
 .bl-invoice-wrap{padding:14px;border-radius:24px}
 .bl-invoice{padding:22px 18px 20px}
 .bl-invoice-head h3{font-size:24px}
 .bl-timeline li{font-size:10px}
}

@media (prefers-reduced-motion:reduce){
 .bl-js [data-bl-reveal]{opacity:1;transform:none;transition:none}
 .bl-marquee-row{animation:none}
 .bl-marquee-rows{overflow-x:auto}
 .bl-tilt{transform:none!important}
 .bl-live,.bizzy-feature,.bl-net span::after{transition:none}
 .bl-marquee-rows:focus-within .bl-marquee-row{animation:none}
 .bl-live-text small::before,.bl-mail-text::after{animation:none}
}

/* ---------- audit fixes (2026-09-27) ---------- */
/* Toast stays inside the unmasked part of the stage and clear of the heading. */
/* The toast floats just above the dashboard frame (outside the stage fade), right of its title bar. */
.dashboard-device-composition{position:relative}
@media (min-width:1051px){.bl-live{top:6px;left:236px;right:auto;min-width:0;max-width:300px;z-index:6}}
@media (max-width:1050px){.bl-live{display:none}}
/* 1051-1279px: keep the hero phone clear of the intro text and capability chips. */
@media (min-width:1051px) and (max-width:1279px){.dashboard-device-composition .dashboard-mobile{left:-60px;width:300px}}
/* Screen-reader-only status text */
.bl-sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
/* Balanced headings avoid one-word orphans on phones */
.bl-h2,.bl-net,.work-examples-heading h2,.features-intro h2,#finance-title,#closing-title{text-wrap:balance}
.bl-persona small,.bl-lede,.bl-problem-copy p{text-wrap:pretty}
/* Send card documents (HTML, fictional data) */
.bl-doc{box-sizing:border-box;height:240px;padding:16px 16px 14px;border-radius:10px;background:#fff;color:var(--bl-navy);font-size:9px;line-height:1.35;box-shadow:0 14px 30px #653e0030;overflow:hidden}
.send-invoice-document.bl-doc{width:72%;height:236px}
.send-w9-document.bl-doc{width:58%;height:210px}
.bl-doc-top{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding-bottom:9px;border-bottom:1px solid #eef0f3}
.bl-doc-top b{font-size:11px;font-weight:800;letter-spacing:-.01em}
.bl-doc-top .bl-doc-title{font-size:17px;letter-spacing:-.03em;color:var(--bl-orange-text)}
.bl-doc-top span{font-size:8.5px;color:var(--bl-muted);font-weight:700}
.bl-doc-parties{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0}
.bl-doc-parties small,.bl-doc-field small,.bl-doc-sign small{display:block;font-size:7px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--bl-muted)}
.bl-doc-parties b{display:block;font-size:9.5px}
.bl-doc-parties span{display:block;color:var(--bl-muted)}
.bl-doc-lines div{display:flex;justify-content:space-between;gap:8px;padding:5px 0;border-bottom:1px solid #f1f2f5}
.bl-doc-total{display:flex;justify-content:space-between;align-items:baseline;margin-top:8px}
.bl-doc-total span{font-weight:700;color:var(--bl-muted)}
.bl-doc-total b{font-size:14px;font-weight:800;letter-spacing:-.03em}
.bl-doc-foot{display:flex;justify-content:space-between;margin-top:8px;color:var(--bl-muted);font-size:8px}
.bl-doc-field{padding:7px 0;border-bottom:1px solid #f1f2f5}
.bl-doc-field span{font-size:9.5px;font-weight:700}
.bl-doc-sign{margin-top:10px}
.bl-doc-sign i{display:block;height:16px;border-bottom:1.5px solid var(--bl-navy);width:70%;margin-top:4px}
/* Footer motion toggle (WCAG 2.2.2) */
.bl-motion-toggle{padding:0;border:0;background:none;font:inherit;color:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.bl-motion-toggle:focus-visible{outline:2px solid var(--bl-focus);outline-offset:3px}
.bl-motion-toggle[aria-pressed="true"]{font-weight:700;color:var(--bl-navy);text-decoration:none}
.bl-motion-toggle[aria-pressed="true"]::before{content:"✓ "}
/* Pause every perpetual loop, including the page's own CTA orbit and glow. One-shot
   entrances (new cards, bars, reveals) are left alone so they never freeze invisible. */
html.bl-paused .bl-marquee-row,
html.bl-paused .bl-live-text small::before,
html.bl-paused .bl-hint::after,
html.bl-paused .bl-mail-text::after,
html.bl-paused .cta-orbit,
html.bl-paused .cta-orbit::before,
html.bl-paused .cta-orbit::after,
html.bl-paused .button,
html.bl-paused .button::before,
html.bl-paused .button::after,
html.bl-paused .nav-action,
html.bl-paused .feature-cta,
html.bl-paused .feature-cta::before,
html.bl-paused .feature-cta::after{animation-play-state:paused!important}
html.bl-paused .bizzy-feature .feature-art *,html.bl-paused .bizzy-feature .feature-art *::after{animation:none!important}
html.bl-paused .bl-sent-pill{opacity:1}
html.bl-paused .work-examples .bl-tab-progress::after{animation:none!important}