/* Reds are the main site's own (--brand-2 #DC1A22, --brand-2-deep), also on the dark stage (2026-10-22, Hunter: no pinkish reds). */
/* /bfindable/ only: the bfindable.co.za look (Findable-Dev Stylesheets/Findable-Landing.css), scoped to .bf-page.
   Header and footer stay the Blue Digital ones. Montserrat is self-hosted (SIL OFL, Assets/Fonts/Montserrat-OFL.txt). */
@font-face{font-family:"Montserrat";font-style:normal;font-weight:400;font-display:swap;src:url("../Fonts/montserrat-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:500;font-display:swap;src:url("../Fonts/montserrat-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:700;font-display:swap;src:url("../Fonts/montserrat-latin-700-normal.woff2") format("woff2")}
@font-face{font-family:"Montserrat";font-style:normal;font-weight:800;font-display:swap;src:url("../Fonts/montserrat-latin-800-normal.woff2") format("woff2")}

.bf-page{
  --bf-navy:#002B64; --bf-navy-deep:#001A3F; --bf-red:var(--brand-2); --bf-red-dark:var(--brand-2-deep);
  --bf-ink:#121212; --bf-text:#555B66; --bf-soft:#F4F6FA; --bf-line:#E2E6EE;
  --bf-stage-0:#051231; --bf-stage-1:#0B2566; --bf-stage-2:#17409F;
  --bf-stage-kicker:#8FB4FF; --bf-stage-title:#F4F6FB; --bf-stage-text:#B9C8E6; --bf-stage-accent:var(--brand-2); --bf-stage-signal:#4C7DFF;
  --bf-stage-glass:linear-gradient(160deg,rgba(30,64,160,.55) 0%,rgba(10,28,80,.8) 100%);
  --bf-font:"Montserrat",system-ui,-apple-system,"Segoe UI",sans-serif;
  --bf-sh-soft:0 5px 30px rgba(0,0,0,.08); --bf-sh-hover:0 12px 34px rgba(0,43,100,.18);
  --font:var(--bf-font);
  font:400 15px/1.7 var(--bf-font);letter-spacing:.2px;color:var(--bf-text)
}
.bf-page h1,.bf-page h2,.bf-page h3{font-family:var(--bf-font);font-weight:800;color:var(--bf-navy)}
.bf-page b,.bf-page strong{font-weight:700}

/* ---------- section heads ---------- */
.bf-page .bd-section{padding-block:84px}
.bf-page .bd-h2{font-size:clamp(26px,3.2vw,40px);line-height:1.18;letter-spacing:-.5px}
.bf-page .bd-accent{color:var(--bf-red)}
.bf-page .bd-kicker{font-family:var(--bf-font);letter-spacing:.12em;color:var(--bf-red)}
.bf-page .bd-lead{font-size:16px;line-height:1.75;color:var(--bf-text)}
.bf-page .bd-section--tint{background:var(--bf-soft)}
.bf-page .bd-section--navy{background:radial-gradient(ellipse 65% 90% at 76% 50%,var(--bf-stage-2) 0%,var(--bf-stage-1) 42%,var(--bf-stage-0) 100%);color:var(--bf-stage-text)}
.bf-page .bd-section--navy .bd-h2{color:var(--bf-stage-title);letter-spacing:-1px}
.bf-page .bd-section--navy .bd-accent{color:var(--bf-stage-accent)}

/* ---------- buttons: uppercase pills that lift ---------- */
.bf-page .bd-btn{font:700 14px/1.2 var(--bf-font);letter-spacing:.6px;text-transform:uppercase;border-radius:50px;padding:13px 30px;border-width:2px;box-shadow:0 9px 18px -9px rgba(0,0,0,.35);transition:background-color .3s ease,color .3s ease,border-color .3s ease,transform .3s ease,box-shadow .3s ease}
.bf-page .bd-btn::before{display:none}
.bf-page .bd-btn:hover,.bf-page .bd-btn:focus-visible{transform:translateY(-3px);box-shadow:0 15px 28px -10px rgba(0,0,0,.4)}
.bf-page .bd-btn--primary{background:var(--bf-red);color:#fff}
.bf-page .bd-btn--primary:hover,.bf-page .bd-btn--primary:focus-visible{background:var(--bf-red-dark)}
.bf-page .bd-btn--line{background:var(--bf-navy);border-color:var(--bf-navy);color:#fff}
.bf-page .bd-btn--line:hover,.bf-page .bd-btn--line:focus-visible{background:var(--bf-red);border-color:var(--bf-red);color:#fff}
.bf-page .bd-btn--ghost{background:transparent;border-color:rgba(255,255,255,.7);color:#fff;box-shadow:none}
.bf-page .bd-btn--ghost:hover,.bf-page .bd-btn--ghost:focus-visible{background:#fff;border-color:#fff;color:var(--bf-navy)}

/* ---------- hero: stage gradient, copy left, the search animation right ---------- */
.bf-hero{position:relative;overflow:hidden;background:radial-gradient(ellipse 60% 85% at 74% 42%,var(--bf-stage-2) 0%,var(--bf-stage-1) 45%,var(--bf-stage-0) 100%);color:#fff;padding-block:72px 190px}
.bf-hero::before{content:"";position:absolute;right:-6%;top:50%;width:min(720px,60vw);aspect-ratio:1;transform:translateY(-58%);border-radius:50%;background:radial-gradient(circle,rgba(76,125,255,.3) 0%,rgba(76,125,255,0) 68%);pointer-events:none}
.bf-hero__grid{position:relative;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:56px;align-items:center}
.bf-hero .bd-crumb{color:rgba(255,255,255,.8);margin-bottom:26px}
.bf-hero__kicker{display:flex;flex-wrap:wrap;align-items:center;gap:10px;font:700 14px/1.3 var(--bf-font);letter-spacing:1.8px;text-transform:uppercase;color:rgba(255,255,255,.9);margin:0 0 22px}
.bf-rotator{display:inline-block;background:var(--bf-red);color:#fff;padding:6px 12px;border-radius:3px;letter-spacing:1px}
.bf-rotator.is-in{animation:bf-fade .5s ease}
@keyframes bf-fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.bf-page .bf-hero h1{font:800 clamp(34px,5vw,58px)/1.08 var(--bf-font);letter-spacing:-.8px;color:#fff;margin:0 0 22px}
.bf-accent{color:var(--bf-stage-accent)}
.bf-hero__sub{font-size:17px;line-height:1.7;color:rgba(255,255,255,.85);margin:0 0 32px;max-width:56ch}
.bf-hero__actions{display:flex;flex-wrap:wrap;gap:14px}

/* the "Ask anything" window */
.bf-ask{background:var(--bf-stage-glass);border:1px solid rgba(143,180,255,.25);border-radius:18px;padding:22px;min-height:430px;box-shadow:0 30px 60px rgba(0,8,30,.45)}
.bf-ask__bar{display:flex;align-items:center;gap:6px}
.bf-ask__bar > span{width:10px;height:10px;border-radius:50%;background:rgba(143,180,255,.25)}
.bf-ask__bar > span:first-child{background:var(--bf-red)}
.bf-ask__bar p{margin:0 0 0 10px;font:700 15px/1 var(--bf-font);color:var(--bf-stage-kicker)}
.bf-ask__field{display:flex;align-items:center;min-height:52px;margin-top:16px;padding:12px 16px;border:1.5px solid var(--bf-stage-signal);border-radius:12px;background:rgba(6,20,60,.65);box-shadow:0 0 26px rgba(76,125,255,.38);font:500 15px/1.4 var(--bf-font);color:var(--bf-stage-title)}
.bf-ask__caret{display:inline-block;width:2px;height:1.1em;margin-left:2px;vertical-align:-.15em;background:var(--bf-stage-kicker);animation:bf-caret 1s steps(1) infinite}
@keyframes bf-caret{50%{opacity:0}}
.bf-ask__answer{position:relative;margin-top:18px}
.bf-ask__thinking{position:absolute;top:0;left:0;margin:0;font-size:13px;color:var(--bf-stage-kicker);opacity:0}
.bf-ask__thinking span{animation:bf-think 1.2s infinite}
.bf-ask__thinking span:nth-child(2){animation-delay:.2s}
.bf-ask__thinking span:nth-child(3){animation-delay:.4s}
@keyframes bf-think{0%,100%{opacity:.2}50%{opacity:1}}
.bf-ask__lead{font-size:14px;color:var(--bf-stage-text);margin:0 0 12px}
.bf-ask__rows{list-style:none;margin:0;padding:0}
.bf-ask__row{display:grid;grid-template-columns:26px 1fr auto;align-items:center;gap:12px;padding:11px 14px;margin-bottom:8px;border:1px solid rgba(143,180,255,.12);border-radius:10px;background:rgba(143,180,255,.08)}
.bf-ask__num{display:grid;place-items:center;width:26px;height:26px;border-radius:7px;background:rgba(76,125,255,.35);font:700 12px/1 var(--bf-font);color:#fff}
.bf-ask__name{display:block;height:8px;border-radius:4px;background:rgba(185,205,255,.45)}
.bf-ask__name--1{width:62%}
.bf-ask__name--2{width:74%}
.bf-ask__name--3{width:54%}
.bf-ask__stars{font-size:13px;letter-spacing:2px;color:#F5B544}
.bf-ask__you{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:12px 0 0;padding:12px 14px;border:1.5px dashed var(--brand-2);border-radius:10px;background:rgba(220,26,34,.14);font:700 14px/1.3 var(--bf-font);color:#fff}
.bf-ask__pill{flex-shrink:0;padding:4px 10px;border-radius:50px;background:var(--bf-red);font-size:12px;color:#fff}

/* three white cards overlapping the hero */
.bf-overlap{position:relative;z-index:2;margin-top:-120px}
.bf-overlap__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px}
.bf-ocard{display:flex;gap:16px;align-items:flex-start;background:#fff;border-radius:10px;border-top:3px solid transparent;box-shadow:var(--bf-sh-soft);padding:28px 26px;transition:transform .5s ease,box-shadow .5s ease,border-color .5s ease}
.bf-ocard:hover{transform:translateY(-10px);box-shadow:var(--bf-sh-hover);border-top-color:var(--bf-red)}
.bf-ocard__ic,.bf-page .bd-plat__ic{flex:none;display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--bf-navy);color:#fff;transition:background-color .3s ease,transform .6s ease}
.bf-ocard__ic .bd-icon{width:26px;height:26px}
.bf-ocard__ic .bd-acc,.bf-page .bd-plat__ic .bd-acc{stroke:var(--brand-2)}
.bf-ocard:hover .bf-ocard__ic,.bf-page .bd-plat:hover .bd-plat__ic{background:var(--bf-red);transform:rotateY(360deg)}
.bf-ocard:hover .bf-ocard__ic .bd-acc,.bf-page .bd-plat:hover .bd-plat__ic .bd-acc{stroke:#fff}
.bf-page .bf-ocard h2{font-size:18px;font-weight:700;line-height:1.3;margin:4px 0 6px}
.bf-ocard p{font-size:14.5px;line-height:1.6;margin:0}

/* ---------- where you'll be found: lift cards with a red top edge ---------- */
.bf-page .bd-plat{border:0;border-top:3px solid transparent;border-radius:10px;box-shadow:var(--bf-sh-soft);padding:30px 26px}
.bf-page .bd-plat::after{display:none}
.bf-page .bd-plat:hover{transform:translateY(-10px);box-shadow:var(--bf-sh-hover);border-top-color:var(--bf-red)}
.bf-page .bd-plat h3{font-size:18px;font-weight:700}
.bf-page .bd-plat p{font-size:14.5px}

/* ---------- score steps ---------- */
.bf-page .bd-gauge{border-radius:20px;box-shadow:var(--bf-sh-soft)}
.bf-page .bd-gauge__num{font:800 64px/1 var(--bf-font);fill:var(--bf-navy)}
.bf-page .bd-gauge__of{font-family:var(--bf-font)}
.bf-page .bd-gauge__label{font-weight:700;color:var(--bf-navy)}
.bf-page .bd-vstep{border-radius:10px;box-shadow:var(--bf-sh-soft)}
.bf-page .bd-vstep.is-on{box-shadow:var(--bf-sh-hover)}
.bf-page .bd-vstep h3{font-size:20px;font-weight:700}
.bf-page .bd-vstep__n{font-weight:700;color:var(--bf-red)}
.bf-page .bd-vstep.is-on .bd-vstep__dot{background:var(--bf-navy)}

/* ---------- plans: 20px price cards, the featured one navy ---------- */
.bf-page .bd-plan{border-radius:20px;border-color:var(--bf-line);box-shadow:var(--bf-sh-soft);padding:36px 32px}
.bf-page .bd-plan--dark{background:var(--bf-navy);border-color:var(--bf-navy)}
.bf-page .bd-plan--dark:hover,.bf-page .bd-plan--dark:focus-within{background:var(--bf-navy-deep)}
.bf-page .bd-plan__name{font-weight:700;color:var(--bf-red)}
.bf-page .bd-plan--dark .bd-plan__name{color:var(--brand-2)}
.bf-page .bd-plan__price{font:800 48px/1 var(--bf-font);letter-spacing:-1px;color:var(--bf-navy)}
.bf-page .bd-plan--dark .bd-plan__price{color:#fff}
.bf-page .bd-plan__ribbon{font-weight:700}
.bf-special{align-self:flex-start;margin:0;padding:6px 12px;border-radius:50px;background:var(--bf-red);color:#fff;font:700 12.5px/1.3 var(--bf-font);letter-spacing:.6px;text-transform:uppercase}
.bf-plan__for{margin:0;font-size:14.5px;line-height:1.6}
.bf-page .bd-plan--dark .bf-plan__for{color:var(--on-band-soft)}
.bf-page .bd-tbl small{display:block;font-size:12.5px;color:var(--bf-text)}
.bf-page .bd-tbl .bd-hl small{color:inherit;opacity:.85}
.bf-page .bd-tbl{font-family:var(--bf-font)}
.bf-page .bd-tbl thead th{font-weight:700}

/* ---------- getting started: glass cards on the stage band ---------- */
.bf-page .bd-how__card{background:var(--bf-stage-glass);border-color:rgba(143,180,255,.25);border-radius:18px;box-shadow:0 30px 60px rgba(0,8,30,.35)}
.bf-page .bd-how__n{font-weight:800;color:var(--bf-stage-accent)}
.bf-page .bd-how__card h3{font-weight:700;color:var(--bf-stage-title)}
.bf-page .bd-how__card p,.bf-page .bd-how__note{color:var(--bf-stage-text)}

/* ---------- score request and questions ---------- */
.bf-page .bd-form-card{border-radius:20px;box-shadow:var(--bf-sh-soft)}
.bf-page .bd-next span{background:var(--bf-red);font-weight:700}
.bf-page .bd-faq details{border-radius:10px}
.bf-page .bd-faq summary{font-weight:700;color:var(--bf-navy)}

@media (max-width:980px){
  .bf-hero{padding-block:48px 160px}
  .bf-hero__grid{grid-template-columns:1fr;gap:40px}
  .bf-ask{width:100%;max-width:560px;margin-inline:auto}
  .bf-overlap__grid{grid-template-columns:1fr;gap:18px}
  .bf-page .bd-section{padding-block:60px}
}
@media (max-width:767px){
  .bf-page .bd-section{padding-block:48px}
  .bf-ask{min-height:420px;padding:18px}   /* room for the full answer, so the cards below don't jump while it plays */
  .bf-page .bd-btn{padding:13px 18px;letter-spacing:.3px}
  .bf-hero__actions .bd-btn{width:100%}
}
@media (prefers-reduced-motion:reduce){
  .bf-ask__caret,.bf-ask__thinking span,.bf-rotator.is-in{animation:none}
  .bf-ocard,.bf-ocard__ic,.bf-page .bd-plat__ic,.bf-page .bd-btn{transition:none}
}