 :root{
  --bb:#0057A7; --x:#6CC9F3; --accent:#00A0DC; --ink:#12324a;
  --muted:#63788c; --bg:#f6fbff; --line:#d9e8f4; --white:#fff;
  --red:#D83B3B; --shadow:0 22px 55px rgba(0,87,167,.13);
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:var(--bg);overflow:hidden}
button,input,select{font-family:inherit}
.app{height:100vh;overflow:hidden;position:relative;background:linear-gradient(135deg,#fff 0%,#fff 58%,#edf8ff 100%)}
.progress{height:6px;background:#d8edf9}.progress div{height:100%;width:0;background:linear-gradient(90deg,var(--bb),var(--x));transition:.35s}
.topbar{position:absolute;top:28px;left:44px;right:44px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;z-index:5}
.brand{display:flex;gap:14px;align-items:center;color:var(--muted);font-size:14px}.brand img{height:42px}.phase{text-align:center;color:var(--bb);font-weight:800}.counter{text-align:right;color:var(--muted);font-weight:800}
.slide{position:absolute;inset:0;padding:110px 7vw 96px;opacity:0;transform:translateX(30px);pointer-events:none;transition:.35s}
.slide.active{opacity:1;transform:translateX(0);pointer-events:auto}
.wide{max-width:1180px;margin:0 auto;text-align:center}.split{height:100%;display:grid;grid-template-columns:1fr 1fr;gap:5vw;align-items:center}
.eyebrow{text-transform:uppercase;letter-spacing:.14em;color:var(--accent);font-size:13px;font-weight:800;margin:0 0 14px}
h1,h2{color:var(--bb);font-weight:300;letter-spacing:-.05em;line-height:.98;margin:0 0 18px}h1{font-size:clamp(46px,7vw,88px)}h2{font-size:clamp(40px,5vw,72px)}
h3{margin:0 0 14px;color:var(--bb);font-size:24px}p{font-size:20px;line-height:1.55;color:var(--muted);margin:0 0 22px}.lead{max-width:780px;margin-left:auto;margin-right:auto}
.panel,.lost-card{background:rgba(255,255,255,.92);border:1px solid var(--line);border-radius:26px;box-shadow:var(--shadow);padding:30px;text-align:left}
label{display:block;margin:18px 0 8px;font-size:13px;text-transform:uppercase;letter-spacing:.09em;font-weight:800;color:var(--bb)}
input,select{width:100%;border:1px solid var(--line);border-radius:16px;padding:15px 16px;font-size:18px;background:#fff;color:var(--ink);outline:none}
input:focus,select:focus{border-color:var(--x);box-shadow:0 0 0 4px rgba(108,201,243,.18)}
.industry-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:24px}.industry-card,.goal-card,.choice{background:#fff;border:1px solid var(--line);border-radius:22px;padding:22px;cursor:pointer;transition:.2s;box-shadow:0 8px 22px rgba(0,87,167,.06);text-align:left}
.industry-card{min-height:165px}.industry-card:hover,.goal-card:hover,.choice:hover{transform:translateY(-3px);border-color:var(--x)}
.industry-card.active,.goal-card.active,.choice.active{background:var(--bb);border-color:var(--bb);color:#fff}
.icon{font-size:32px;margin-bottom:12px}.industry-card b,.goal-card b{display:block;font-size:19px;margin-bottom:8px}.industry-card span,.goal-card span{display:block;color:var(--muted);font-size:14px;line-height:1.45}.industry-card.active span,.goal-card.active span,.choice.active span{color:rgba(255,255,255,.78)}
.goal-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.goal-card ul{margin:12px 0 0 18px;padding:0;color:var(--muted)}.goal-card.active ul{color:rgba(255,255,255,.85)}.goal-card li{margin:4px 0}.helper{text-align:center;font-size:16px;margin-top:18px}
.big-list{margin:0 0 22px 20px;padding:0}.big-list li{font-size:20px;margin:10px 0}.choice-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.choice-grid.capacity{grid-template-columns:repeat(5,1fr)}.choice{text-align:center;font-weight:800;padding:16px}
.lost-visual{display:flex;gap:18px;align-items:center}.lost-card{text-align:center;flex:1}.lost-card small,.result-card small{display:block;color:var(--muted);font-weight:800;text-transform:uppercase;letter-spacing:.08em;font-size:13px;margin-bottom:12px}.lost-card strong{display:block;color:var(--bb);font-size:34px}.lost-card.muted{opacity:.55}.arrow{font-size:48px;color:var(--x)}
.result-card{margin-top:24px;background:#eef8ff;border:1px solid var(--line);border-radius:18px;padding:18px}.result-card strong{display:block;font-size:42px;color:var(--bb)}
.calc-row,.total{display:flex;justify-content:space-between;gap:18px;border-bottom:1px solid var(--line);padding:14px 0;align-items:center}.calc-row span{color:var(--muted)}.calc-row b{font-size:26px;color:var(--bb)}.calc-row.emphasis{background:#f3faff;border-radius:16px;border-bottom:0;padding:16px;margin:10px 0}
.total{background:#fff3f3;border:1px solid #ffd0d0;border-radius:20px;margin-top:18px;padding:20px}.total span{color:var(--red);font-weight:800}.total strong{font-size:42px;color:var(--red);letter-spacing:-.04em}
.bars{margin-top:24px}.bar-label{display:flex;justify-content:space-between;color:var(--muted);font-weight:800;margin:12px 0 7px}.bar-label.red{color:var(--red)}.track{height:28px;background:#edf4fb;border-radius:999px;overflow:hidden}.bar{height:100%;border-radius:999px;transition:.35s}.bar.current{background:var(--bb)}.bar.max{background:linear-gradient(90deg,var(--bb),var(--x))}.bar.left{background:var(--red)}
.nav{position:absolute;bottom:28px;left:44px;right:44px;display:flex;justify-content:space-between}.primary,.secondary{border-radius:999px;padding:14px 24px;font-size:17px;font-weight:800;cursor:pointer}.primary{background:var(--bb);color:#fff;border:0;box-shadow:0 16px 34px rgba(0,87,167,.22)}.secondary{background:#fff;color:var(--bb);border:1px solid var(--line)}button:disabled{opacity:.45;cursor:not-allowed}
@media(max-width:960px){html,body{overflow:auto}.app{height:auto;min-height:100vh;overflow:visible}.topbar{position:fixed;top:6px;left:0;right:0;padding:12px 20px;background:rgba(246,251,255,.9);backdrop-filter:blur(8px)}.phase{display:none}.slide{position:relative;display:none;min-height:100vh;padding:100px 24px 110px;opacity:1;transform:none}.slide.active{display:block}.split,.wide{display:block}.industry-grid,.goal-grid{grid-template-columns:1fr}.choice-grid,.choice-grid.capacity{grid-template-columns:1fr}.lost-visual{flex-direction:column}.arrow{transform:rotate(90deg)}.nav{position:fixed;left:20px;right:20px;bottom:18px}}




/* v1.4 introduction: mirrors the supplied BBX intro prototype */
.app.cover-mode .progress,
.app.cover-mode .topbar,
.app.cover-mode .nav{
  display:none;
}

.app.problem-mode .nav{
  display:none;
}

.prototype-cover{
  padding:0;
  cursor:pointer;
  background:#0b2d67;
  transform:none;
}
.prototype-cover img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.prototype-hint{
  position:absolute;
  bottom:28px;
  left:50%;
  transform:translateX(-50%);
  color:#fff;
  background:rgba(0,0,0,.35);
  padding:12px 22px;
  border-radius:30px;
  font-weight:700;
  z-index:2;
}

.prototype-problem{
  padding:92px 40px 36px;
  background:#f7fbff;
  transform:none;
}
.prototype-problem-inner{
  width:100%;
  height:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
}
#prototypeHeadline{
  color:#0057A7;
  font-size:clamp(42px,5.2vw,68px);
  font-weight:300;
  line-height:1.05;
  text-align:center;
  min-height:150px;
  margin:0 0 22px;
  transition:opacity .4s ease;
}
.prototype-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(150px,190px));
  gap:18px;
  opacity:0;
  transform:translateY(10px);
  transition:opacity .5s ease,transform .5s ease;
}
.prototype-grid.show{
  opacity:1;
  transform:translateY(0);
}
.prototype-card{
  width:100%;
  background:#fff;
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 8px 24px rgba(0,87,167,.08);
  border:1px solid #d9e8f4;
  text-align:left;
}
.prototype-card img{
  width:100%;
  height:110px;
  object-fit:cover;
  display:block;
}
.prototype-label{
  padding:10px 14px 4px;
  font-weight:700;
  color:#12324a;
}
.prototype-money{
  padding:0 14px 14px;
  font-size:30px;
  font-weight:700;
  color:#12324a;
}
.prototype-final{
  margin-top:34px;
  color:#0057A7;
  font-size:clamp(30px,3.4vw,42px);
  line-height:1.08;
  text-align:center;
  opacity:0;
  transform:translateY(8px);
  transition:opacity .5s ease,transform .5s ease;
}
.prototype-final.show{
  opacity:1;
  transform:translateY(0);
}
.prototype-continue{
  position:absolute;
  right:40px;
  bottom:30px;
  border:0;
  background:#0057A7;
  color:#fff;
  padding:16px 28px;
  border-radius:30px;
  font-size:16px;
  font-weight:800;
  cursor:pointer;
  opacity:0;
  pointer-events:none;
  transition:opacity .5s ease,transform .2s ease;
}
.prototype-continue.show{
  opacity:1;
  pointer-events:auto;
}
.prototype-continue:hover{
  transform:translateY(-2px);
}

@media(max-width:1100px){
  .prototype-grid{
    grid-template-columns:repeat(5,minmax(145px,1fr));
    gap:12px;
    width:100%;
  }
}
@media(max-width:900px){
  .prototype-problem{
    padding:100px 24px 80px;
    overflow:auto;
  }
  .prototype-problem-inner{
    justify-content:flex-start;
  }
  .prototype-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .prototype-card:last-child{
    grid-column:1 / -1;
    max-width:300px;
    justify-self:center;
  }
  #prototypeHeadline{
    min-height:120px;
    font-size:40px;
  }
}

.options-slide{padding:96px 42px 82px;overflow:hidden}
.options-shell{max-width:1240px;width:100%;height:100%;display:flex;flex-direction:column;justify-content:center}
.options-heading{text-align:left;margin-bottom:20px}.options-heading h1{margin-bottom:8px}.options-heading .lead{margin:0;max-width:none}
.options-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;min-height:0}
.option-card{position:relative;display:grid;grid-template-rows:150px 1fr;min-height:455px;background:#fff;border:1px solid var(--line);border-radius:24px;overflow:hidden;box-shadow:0 14px 34px rgba(0,87,167,.09)}
.option-image{display:flex;align-items:center;justify-content:center;background:#f3f8fc;padding:14px}.option-image img{width:100%;height:100%;object-fit:contain;display:block}
.option-phone{background:linear-gradient(145deg,#eaf7ff,#d7effb)}.option-phone img{width:auto;max-width:75%}
.option-copy{position:relative;padding:20px 22px 18px;display:flex;flex-direction:column}.option-number{position:absolute;top:16px;right:18px;font-size:13px;font-weight:800;color:var(--x);letter-spacing:.08em}
.option-copy h2{font-size:27px;color:var(--bb);margin:0 42px 5px 0}.option-copy p{margin:0 0 10px;color:var(--muted);font-size:15px;line-height:1.35}
.option-copy ul{list-style:none;padding:0;margin:0 0 14px;display:grid;gap:7px}.option-copy li{position:relative;padding-left:18px;color:var(--ink);font-size:14px;line-height:1.3}
.option-copy li:before{content:"";position:absolute;left:0;top:.48em;width:7px;height:7px;border-radius:50%;background:var(--red)}
.option-outcome{margin-top:auto;border-radius:12px;padding:10px 12px;font-weight:800;font-size:14px}.option-outcome.negative{color:#a83930;background:#fff0ee}
.option-bbx{border:2px solid var(--bb);box-shadow:0 18px 42px rgba(0,87,167,.17);transform:translateY(-7px)}.option-bbx .option-copy li:before{background:var(--x)}
.option-outcome.positive{color:#fff;background:linear-gradient(90deg,var(--bb),#00a0dc)}
@media(max-width:1050px){.options-slide{padding-left:24px;padding-right:24px}.options-grid{gap:12px}.option-card{grid-template-rows:125px 1fr;min-height:420px}.option-copy{padding:16px}.option-copy h2{font-size:23px}.option-copy li{font-size:13px}}


/* v1.6 options slide refinements */
.options-slide{
  padding-top:88px;
  padding-bottom:76px;
}
.options-heading{
  margin-bottom:12px;
}
.options-heading h1{
  font-size:clamp(40px,4.4vw,62px);
}
.options-grid{
  align-items:stretch;
}
.option-card{
  grid-template-rows:128px 1fr;
  min-height:410px;
  overflow:visible;
}
.option-image{
  padding:10px 18px 4px;
  border-radius:24px 24px 0 0;
}
.option-image img{
  max-width:180px;
  max-height:120px;
}
.option-phone img{
  max-width:92px;
  max-height:138px;
}
.option-copy{
  padding:14px 20px 16px;
}
.option-copy h2{
  font-size:25px;
  margin:0 0 5px;
}
.option-copy p{
  font-size:14px;
  margin-bottom:8px;
}
.option-copy ul{
  gap:5px;
  margin-bottom:10px;
}
.option-copy li{
  font-size:13px;
}
.option-tag{
  position:absolute;
  top:12px;
  left:18px;
  z-index:2;
  color:var(--bb);
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.option-tag-negative{
  color:var(--red);
}
.smarter-option{
  position:absolute;
  top:-14px;
  left:50%;
  transform:translateX(-50%);
  z-index:4;
  white-space:nowrap;
  padding:7px 18px;
  border-radius:999px;
  color:#fff;
  background:linear-gradient(90deg,var(--bb),#00a0dc);
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.05em;
  box-shadow:0 8px 20px rgba(0,87,167,.22);
}
.options-summary{
  margin:14px auto 0;
  max-width:820px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:6px;
  padding:11px 18px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  box-shadow:0 8px 22px rgba(0,87,167,.06);
  color:var(--muted);
  font-size:15px;
}
.options-summary strong{
  color:var(--bb);
  font-size:19px;
}
@media(max-height:820px){
  .options-slide{padding-top:82px;padding-bottom:68px}
  .options-heading{margin-bottom:8px}
  .options-heading .lead{font-size:16px}
  .option-card{grid-template-rows:105px 1fr;min-height:350px}
  .option-image img{max-height:98px}
  .option-phone img{max-height:112px}
  .option-copy{padding:11px 16px 12px}
  .option-copy h2{font-size:22px}
  .option-copy li{font-size:12px}
  .option-outcome{padding:8px 10px;font-size:12px}
  .options-summary{margin-top:9px;padding:8px 14px}
}


/* v1.6.1 styling corrections and options-slide polish */
.bar-label{
  color:var(--muted);
}
.bar-label span{
  color:inherit;
}
.bar-label.red,
.bar-label.red span{
  color:var(--red);
}

.options-summary,
.options-summary span{
  color:var(--muted);
}
.options-summary strong{
  color:var(--bb);
}

.option-card{
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.option-card:hover{
  transform:translateY(-4px);
  box-shadow:0 20px 44px rgba(0,87,167,.14);
  border-color:var(--x);
}
.option-bbx{
  min-height:438px;
}
.option-bbx:hover{
  transform:translateY(-11px);
  box-shadow:0 24px 52px rgba(0,87,167,.22);
  border-color:var(--bb);
}
.smarter-option{
  padding:8px 20px;
  border:1px solid rgba(255,255,255,.45);
  box-shadow:0 10px 24px rgba(0,87,167,.28);
}
.option-copy li:before{
  width:15px;
  height:15px;
  top:.08em;
  background:transparent;
  border:1.5px solid var(--red);
}
.option-copy li:after{
  content:"×";
  position:absolute;
  left:3px;
  top:-.16em;
  color:var(--red);
  font-size:14px;
  font-weight:900;
  line-height:1;
}
.option-bbx .option-copy li:before{
  background:transparent;
  border-color:var(--bb);
}
.option-bbx .option-copy li:after{
  content:"✓";
  left:2px;
  top:-.2em;
  color:var(--bb);
  font-size:13px;
}
.option-copy li{
  padding-left:23px;
}
.option-image{
  padding-top:18px;
}
.option-phone{
  padding-top:14px;
}

@media(max-height:820px){
  .option-bbx{min-height:374px}
}


/* Integrated “How BBX Works” slide */
.how-bbx-slide{
  padding:84px 42px 78px;
  overflow:hidden;
}
.how-bbx-shell{
  max-width:1240px;
  width:100%;
  height:100%;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.how-bbx-heading{
  text-align:left;
  margin-bottom:10px;
}
.how-bbx-heading h1{
  font-size:clamp(38px,4.1vw,58px);
  margin-bottom:7px;
}
.how-bbx-heading .lead{
  max-width:950px;
  margin:0;
  font-size:17px;
  line-height:1.4;
}
.how-bbx-network{
  position:relative;
  height:450px;
  margin-top:12px;
  border:1px solid var(--line);
  border-radius:26px;
  background:
    radial-gradient(circle at 50% 50%,rgba(108,201,243,.18),transparent 31%),
    linear-gradient(180deg,#fff,#f6fbff);
  box-shadow:var(--shadow);
  overflow:hidden;
}
.network-lines{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
}
.network-line{
  fill:none;
  stroke:var(--bb);
  stroke-width:3;
  stroke-linecap:round;
  stroke-dasharray:8 13;
  opacity:0;
}
.how-bbx-slide.active .network-line{
  animation:networkLineIn .8s ease forwards,networkFlow 9s linear infinite;
}
.how-bbx-slide.active .line-1{animation-delay:.9s,1.7s}
.how-bbx-slide.active .line-2{animation-delay:2.1s,2.9s}
.how-bbx-slide.active .line-3{animation-delay:3.3s,4.1s}
.how-bbx-slide.active .line-4{animation-delay:4.5s,5.3s}
.how-bbx-slide.active .line-5{animation-delay:5.7s,6.5s}
.how-bbx-slide.active .line-6{animation-delay:6.9s,7.7s}
@keyframes networkLineIn{to{opacity:.55}}
@keyframes networkFlow{to{stroke-dashoffset:-126}}

.business-centre{
  position:absolute;
  left:50%;
  top:50%;
  width:190px;
  height:190px;
  transform:translate(-50%,-50%);
  border-radius:26px;
  background:linear-gradient(145deg,var(--bb),#00a0dc);
  color:#fff;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  box-shadow:0 22px 48px rgba(0,87,167,.25);
  z-index:3;
  opacity:0;
}
.how-bbx-slide.active .business-centre{
  animation:businessIn .8s cubic-bezier(.2,.8,.2,1) .15s forwards;
}
@keyframes businessIn{
  from{opacity:0;transform:translate(-50%,-50%) scale(.9)}
  to{opacity:1;transform:translate(-50%,-50%) scale(1)}
}
.business-icon{
  width:64px;
  height:64px;
  margin-bottom:7px;
}
.business-icon svg,.network-icon svg{
  width:100%;
  height:100%;
  fill:none;
  stroke:currentColor;
  stroke-width:2.5;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.business-centre span{
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:11px;
  font-weight:800;
  color:rgba(255,255,255,.78);
}
.business-centre strong{
  margin-top:3px;
  font-size:26px;
}
.network-card{
  position:absolute;
  width:245px;
  min-height:102px;
  padding:14px 16px;
  display:grid;
  grid-template-columns:48px 1fr;
  gap:12px;
  align-items:center;
  border-radius:18px;
  border:1px solid var(--line);
  background:#fff;
  box-shadow:0 11px 26px rgba(0,87,167,.09);
  opacity:0;
  transform:translateY(12px) scale(.97);
  z-index:2;
}
.how-bbx-slide.active .network-card{
  animation:networkCardIn .85s cubic-bezier(.2,.8,.2,1) forwards;
}
.how-bbx-slide.active .card-account{animation-delay:1.1s}
.how-bbx-slide.active .card-market{animation-delay:2.3s}
.how-bbx-slide.active .card-app{animation-delay:3.5s}
.how-bbx-slide.active .card-intros{animation-delay:4.7s}
.how-bbx-slide.active .card-marketing{animation-delay:5.9s}
.how-bbx-slide.active .card-events{animation-delay:7.1s}
@keyframes networkCardIn{
  to{opacity:1;transform:translateY(0) scale(1)}
}
.network-card h3{
  font-size:16px;
  line-height:1.1;
  margin:0 0 5px;
}
.network-card p{
  margin:0;
  font-size:12px;
  line-height:1.3;
}
.network-icon{
  width:46px;
  height:46px;
  padding:9px;
  border-radius:14px;
  color:var(--bb);
  background:#eaf7ff;
}
.card-account{left:4%;top:8%}
.card-market{left:4%;bottom:8%}
.card-app{right:4%;top:8%}
.card-intros{right:4%;bottom:8%}
.card-marketing{left:50%;top:3%;transform:translateX(-50%) translateY(12px) scale(.97)}
.card-events{left:50%;bottom:3%;transform:translateX(-50%) translateY(12px) scale(.97)}
.how-bbx-slide.active .card-marketing,
.how-bbx-slide.active .card-events{
  animation-name:networkCardCentreIn;
}
@keyframes networkCardCentreIn{
  to{opacity:1;transform:translateX(-50%) translateY(0) scale(1)}
}
.network-outcomes{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:11px;
  margin-top:11px;
}
.network-outcomes div{
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fff;
  box-shadow:0 7px 18px rgba(0,87,167,.05);
  color:var(--bb);
  font-size:14px;
  font-weight:800;
  opacity:0;
  transform:translateY(8px);
}
.how-bbx-slide.active .network-outcomes div{
  animation:networkOutcomeIn .55s ease forwards;
}
.how-bbx-slide.active .network-outcomes div:nth-child(1){animation-delay:8.5s}
.how-bbx-slide.active .network-outcomes div:nth-child(2){animation-delay:9s}
.how-bbx-slide.active .network-outcomes div:nth-child(3){animation-delay:9.5s}
.how-bbx-slide.active .network-outcomes div:nth-child(4){animation-delay:10s}
@keyframes networkOutcomeIn{to{opacity:1;transform:translateY(0)}}

@media(max-height:820px){
  .how-bbx-slide{padding-top:76px;padding-bottom:68px}
  .how-bbx-heading h1{font-size:42px}
  .how-bbx-heading .lead{font-size:15px}
  .how-bbx-network{height:385px}
  .network-card{width:225px;min-height:90px;padding:11px 13px}
  .network-card h3{font-size:15px}
  .network-card p{font-size:11px}
  .business-centre{width:165px;height:165px}
  .business-icon{width:54px;height:54px}
}
@media(max-width:1000px){
  .network-card{width:205px}
  .card-account,.card-market{left:2%}
  .card-app,.card-intros{right:2%}
}


/* =========================================================
   v1.7.0 — Premium priority selection + personalised bridge
   ========================================================= */

/* Priority selection slide */
.priority-selection-slide .wide{
  max-width:1180px;
}
.priority-selection-slide h2{
  margin-bottom:12px;
}
.priority-selection-slide .lead{
  margin-bottom:24px;
}
.priority-selection-slide .goal-grid{
  gap:18px;
}
.priority-selection-slide .goal-card{
  position:relative;
  min-height:184px;
  padding:24px 26px 22px 30px;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:24px;
  background:#fff;
  box-shadow:0 14px 34px rgba(0,87,167,.08);
  color:var(--ink);
  transform:none;
}
.priority-selection-slide .goal-card::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:7px;
  background:linear-gradient(180deg,var(--bb),var(--accent));
}
.priority-selection-slide .goal-card:hover{
  transform:translateY(-3px);
  border-color:var(--x);
  box-shadow:0 18px 40px rgba(0,87,167,.13);
}
.priority-selection-slide .goal-card.active{
  background:linear-gradient(135deg,#fff 0%,#f3faff 100%);
  color:var(--ink);
  border-color:var(--bb);
  box-shadow:0 0 0 3px rgba(0,87,167,.10),0 18px 40px rgba(0,87,167,.13);
}
.priority-selection-slide .goal-card .goal-topline{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}
.priority-selection-slide .goal-card .goal-number{
  display:inline-grid;
  place-items:center;
  width:38px;
  height:38px;
  border-radius:12px;
  background:#eaf7ff;
  color:var(--bb);
  font-weight:900;
  font-size:15px;
}
.priority-selection-slide .goal-card .goal-check{
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  border:2px solid var(--line);
  border-radius:999px;
  color:transparent;
  font-size:16px;
  font-weight:900;
  transition:.2s;
}
.priority-selection-slide .goal-card.active .goal-check{
  border-color:var(--bb);
  background:var(--bb);
  color:#fff;
}
.priority-selection-slide .goal-card b{
  color:var(--bb);
  font-size:22px;
  margin-bottom:8px;
}
.priority-selection-slide .goal-card span{
  color:var(--muted);
  font-size:15px;
  line-height:1.45;
}
.priority-selection-slide .goal-card ul,
.priority-selection-slide .goal-card.active ul{
  margin:11px 0 0 18px;
  color:var(--muted);
  font-size:14px;
  line-height:1.35;
}
.priority-selection-slide .goal-card.active span{
  color:var(--muted);
}

/* Personalised priority bridge */
.priority-bridge-slide{
  padding-top:96px;
  padding-bottom:88px;
}
.priority-bridge-shell{
  max-width:1180px;
}
.priority-bridge-heading{
  max-width:1000px;
  margin:0 auto;
}
.priority-bridge-heading h1{
  margin-bottom:14px;
  font-size:clamp(42px,5.3vw,70px);
  line-height:1.01;
}
.priority-bridge-heading .lead{
  max-width:900px;
  font-size:clamp(18px,1.8vw,22px);
  line-height:1.45;
}
.priority-bridge-label{
  margin:24px 0 14px;
  color:var(--muted);
  font-size:13px;
  font-weight:900;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.priority-bridge-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  max-width:940px;
  margin:0 auto;
}
.priority-bridge-grid.single{
  grid-template-columns:minmax(0,560px);
  justify-content:center;
}
.priority-bridge-card{
  position:relative;
  min-height:190px;
  padding:28px 30px 26px;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:24px;
  background:#fff;
  box-shadow:var(--shadow);
  text-align:left;
  opacity:0;
  transform:translateY(16px) scale(.985);
}
.priority-bridge-card::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:7px;
  background:linear-gradient(180deg,var(--bb),var(--accent));
}
.priority-bridge-card .priority-number{
  display:inline-grid;
  place-items:center;
  width:38px;
  height:38px;
  margin-bottom:16px;
  border-radius:12px;
  background:#eaf7ff;
  color:var(--bb);
  font-size:15px;
  font-weight:900;
}
.priority-bridge-card h3{
  margin:0 0 9px;
  color:var(--bb);
  font-size:28px;
  font-weight:500;
  letter-spacing:-.035em;
}
.priority-bridge-card p{
  margin:0;
  color:var(--muted);
  font-size:16px;
  line-height:1.5;
}
.priority-bridge-question{
  margin:25px auto 0;
  color:var(--ink);
  font-size:clamp(22px,2.4vw,31px);
  line-height:1.3;
  font-weight:800;
  opacity:0;
  transform:translateY(10px);
}
.priority-bridge-question strong{
  color:var(--bb);
}
.priority-bridge-slide.play .priority-bridge-heading .eyebrow{
  animation:bridgeFade .65s ease both;
}
.priority-bridge-slide.play .priority-bridge-heading h1{
  animation:bridgeRise .8s ease .25s both;
}
.priority-bridge-slide.play .priority-bridge-heading .lead{
  animation:bridgeRise .8s ease .8s both;
}
.priority-bridge-slide.play .priority-bridge-label{
  animation:bridgeFade .65s ease 1.25s both;
}
.priority-bridge-slide.play .priority-bridge-card:nth-child(1){
  animation:bridgeCard .9s cubic-bezier(.2,.8,.2,1) 1.55s forwards;
}
.priority-bridge-slide.play .priority-bridge-card:nth-child(2){
  animation:bridgeCard .9s cubic-bezier(.2,.8,.2,1) 2.35s forwards;
}
.priority-bridge-slide.play .priority-bridge-question{
  animation:bridgeRise .8s ease 3.25s forwards;
}
@keyframes bridgeFade{
  from{opacity:0}
  to{opacity:1}
}
@keyframes bridgeRise{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes bridgeCard{
  to{opacity:1;transform:translateY(0) scale(1)}
}
@media(max-height:820px){
  .priority-selection-slide{padding-top:96px}
  .priority-selection-slide h2{font-size:48px}
  .priority-selection-slide .lead{font-size:17px;margin-bottom:16px}
  .priority-selection-slide .goal-card{min-height:154px;padding:18px 22px 17px 27px}
  .priority-selection-slide .goal-card .goal-topline{margin-bottom:9px}
  .priority-selection-slide .goal-card b{font-size:19px}
  .priority-selection-slide .goal-card span{font-size:13px}
  .priority-selection-slide .goal-card ul,
  .priority-selection-slide .goal-card.active ul{font-size:12px;margin-top:7px}

  .priority-bridge-slide{padding-top:84px;padding-bottom:78px}
  .priority-bridge-heading h1{font-size:47px}
  .priority-bridge-heading .lead{font-size:17px}
  .priority-bridge-label{margin-top:16px}
  .priority-bridge-card{min-height:155px;padding:20px 24px}
  .priority-bridge-card .priority-number{margin-bottom:10px}
  .priority-bridge-card h3{font-size:23px}
  .priority-bridge-card p{font-size:14px}
  .priority-bridge-question{margin-top:17px;font-size:23px}
}
@media(max-width:800px){
  .priority-bridge-grid{grid-template-columns:1fr;max-width:620px}
  .priority-bridge-card{min-height:auto}
}


/* v1.8.0 — fuller priority bridge cards */
.priority-bridge-card{
  min-height:250px;
  padding:24px 28px 22px;
}
.priority-bridge-card .priority-number{
  margin-bottom:12px;
}
.priority-bridge-card h3{
  font-size:26px;
}
.priority-bridge-card p{
  font-size:15px;
  line-height:1.42;
  margin-bottom:10px;
}
.priority-bridge-card ul{
  margin:0;
  padding-left:18px;
  color:var(--muted);
  font-size:14px;
  line-height:1.38;
}
.priority-bridge-card li{
  margin:3px 0;
}
.priority-bridge-slide.play .priority-bridge-heading h1{
  animation-delay:.45s;
}
.priority-bridge-slide.play .priority-bridge-heading .lead{
  animation-delay:1.65s;
}
.priority-bridge-slide.play .priority-bridge-label{
  animation-delay:3s;
}
.priority-bridge-slide.play .priority-bridge-card:nth-child(1){
  animation-delay:4s;
}
.priority-bridge-slide.play .priority-bridge-card:nth-child(2){
  animation-delay:6.2s;
}
.priority-bridge-slide.play .priority-bridge-question{
  animation-delay:8.8s;
}

/* v1.8.0 — integrated Digital Trade Credits journey */
.dtc-journey-slide{
  padding:96px 4vw 92px;
  overflow:hidden;
}
.dtc-journey-shell{
  max-width:1280px;
  height:100%;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  gap:12px;
}
.dtc-journey-heading h1{
  margin:0 0 7px;
  font-size:clamp(38px,4.4vw,60px);
}
.dtc-journey-heading .eyebrow{
  margin-bottom:8px;
}
.dtc-journey-heading .lead{
  max-width:1000px;
  margin-bottom:0;
  font-size:17px;
  line-height:1.35;
}
.dtc-journey-flow{
  min-height:0;
  display:grid;
  grid-template-columns:1fr 72px 1.08fr 72px 1.2fr;
  gap:10px;
  align-items:center;
}
.dtc-step{
  position:relative;
  height:min(42vh,390px);
  min-height:315px;
  overflow:hidden;
  padding:20px 22px;
  border:1px solid var(--line);
  border-radius:23px;
  background:#fff;
  box-shadow:var(--shadow);
  text-align:left;
  opacity:0;
  transform:translateY(18px) scale(.985);
}
.dtc-step::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:7px;
  background:linear-gradient(180deg,var(--bb),var(--accent));
}
.dtc-step-number{
  display:inline-grid;
  place-items:center;
  width:40px;
  height:40px;
  border-radius:12px;
  background:#eaf7ff;
  color:var(--bb);
  font-weight:900;
  font-size:14px;
}
.dtc-step h3{
  margin:12px 0 7px;
  font-size:clamp(23px,2vw,30px);
}
.dtc-step p{
  margin:0;
  font-size:14px;
  line-height:1.42;
}
.dtc-business-box,
.dtc-sale-value{
  width:84%;
  margin:18px auto 0;
  padding:12px;
  border-radius:15px;
  text-align:center;
  color:var(--bb);
  font-weight:800;
}
.dtc-business-box{
  border:1px solid var(--line);
  background:#fbfdff;
}
.dtc-sale-value{
  margin-top:10px;
  border:1px solid #cae7f6;
  background:#eaf6fc;
  font-size:26px;
}
.dtc-connector{
  position:relative;
  height:5px;
  border-radius:999px;
  background:#d8edf7;
  opacity:0;
}
.dtc-connector::after{
  content:"";
  position:absolute;
  right:0;
  top:-6px;
  width:15px;
  height:15px;
  border-top:5px solid var(--accent);
  border-right:5px solid var(--accent);
  transform:rotate(45deg);
}
.dtc-flow-dot{
  position:absolute;
  left:0;
  top:-8px;
  width:21px;
  height:21px;
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 0 8px rgba(108,201,243,.18);
  opacity:0;
}
.dtc-wallet{
  position:relative;
  margin:16px 0 9px;
  padding:15px 12px;
  border:2px solid var(--accent);
  border-radius:17px;
  background:#f7fcff;
  text-align:center;
}
.dtc-wallet-label{
  display:block;
  color:var(--muted);
  font-size:13px;
}
.dtc-balance{
  display:block;
  margin-top:2px;
  color:var(--bb);
  font-size:clamp(30px,3vw,44px);
  line-height:1.1;
}
.dtc-token{
  position:absolute;
  z-index:4;
  left:-36px;
  top:25%;
  display:grid;
  place-items:center;
  width:62px;
  height:33px;
  border-radius:18px;
  background:linear-gradient(180deg,#10abe2,#078bc8);
  box-shadow:0 8px 18px rgba(0,159,227,.28);
  color:#fff;
  font-size:12px;
  font-weight:900;
  opacity:0;
}
.dtc-rate{
  color:var(--ink)!important;
  text-align:center;
  font-weight:700;
}
.dtc-priority-list{
  display:grid;
  gap:9px;
  margin-top:12px;
}
.dtc-priority-list.single{
  grid-template-columns:1fr;
}
.dtc-priority-card{
  display:grid;
  grid-template-columns:34px 1fr;
  gap:10px;
  padding:10px 11px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fbfdff;
  opacity:0;
  transform:translateX(12px);
}
.dtc-priority-card > span{
  display:grid;
  place-items:center;
  width:32px;
  height:32px;
  border-radius:10px;
  background:#eaf7ff;
  color:var(--bb);
  font-size:12px;
  font-weight:900;
}
.dtc-priority-card h4{
  margin:0 0 3px;
  color:var(--bb);
  font-size:16px;
}
.dtc-priority-card ul{
  margin:0;
  padding-left:17px;
  color:var(--muted);
  font-size:12px;
  line-height:1.3;
}
.dtc-community-note{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:14px;
  align-items:center;
  padding:12px 17px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  box-shadow:0 8px 20px rgba(0,87,167,.06);
  opacity:0;
}
.dtc-community-note strong{
  color:var(--bb);
  white-space:nowrap;
}
.dtc-community-note span{
  color:var(--muted);
  font-size:13px;
  line-height:1.35;
}

/* Deliberately slower pacing so each stage can be read before the next appears */
.dtc-journey-slide.play .dtc-journey-heading .eyebrow{
  animation:bridgeFade .7s ease both;
}
.dtc-journey-slide.play .dtc-journey-heading h1{
  animation:bridgeRise .85s ease .6s both;
}
.dtc-journey-slide.play .dtc-journey-heading .lead{
  animation:bridgeRise .85s ease 1.8s both;
}
.dtc-journey-slide.play .dtc-step-one{
  animation:bridgeCard .9s cubic-bezier(.2,.8,.2,1) 3.2s forwards;
}
.dtc-journey-slide.play .dtc-connector-one{
  animation:bridgeFade .6s ease 6.1s forwards;
}
.dtc-journey-slide.play .dtc-connector-one .dtc-flow-dot{
  animation:dtcFlow 1.6s ease 6.6s forwards;
}
.dtc-journey-slide.play .dtc-step-two{
  animation:bridgeCard .9s cubic-bezier(.2,.8,.2,1) 8s forwards;
}
.dtc-journey-slide.play .dtc-token{
  animation:dtcTokenIntoWallet 1.8s cubic-bezier(.2,.7,.3,1) 9.8s forwards;
}
.dtc-journey-slide.play .dtc-connector-two{
  animation:bridgeFade .6s ease 12.4s forwards;
}
.dtc-journey-slide.play .dtc-connector-two .dtc-flow-dot{
  animation:dtcFlow 1.6s ease 12.9s forwards;
}
.dtc-journey-slide.play .dtc-step-three{
  animation:bridgeCard .9s cubic-bezier(.2,.8,.2,1) 14.3s forwards;
}
.dtc-journey-slide.play .dtc-priority-card:nth-child(1){
  animation:dtcPriorityIn .65s ease 16.1s forwards;
}
.dtc-journey-slide.play .dtc-priority-card:nth-child(2){
  animation:dtcPriorityIn .65s ease 17.5s forwards;
}
.dtc-journey-slide.play .dtc-community-note{
  animation:bridgeFade .7s ease 19.2s forwards;
}
@keyframes dtcFlow{
  0%{opacity:0;transform:translateX(0) scale(.75)}
  15%{opacity:1}
  85%{opacity:1}
  100%{opacity:0;transform:translateX(54px) scale(1)}
}
@keyframes dtcTokenIntoWallet{
  0%{opacity:0;left:-36px;top:20%;transform:scale(.8)}
  18%{opacity:1}
  65%{left:50%;top:20%;transform:translateX(-50%) scale(1)}
  100%{left:50%;top:51%;transform:translate(-50%,-50%) scale(.3);opacity:0}
}
@keyframes dtcPriorityIn{
  to{opacity:1;transform:translateX(0)}
}
@media(max-height:820px){
  .priority-bridge-slide{
    padding-top:90px;
    padding-bottom:82px;
  }
  .priority-bridge-heading h1{
    font-size:clamp(36px,4.4vw,58px);
  }
  .priority-bridge-heading .lead{
    font-size:16px;
    line-height:1.35;
  }
  .priority-bridge-label{
    margin:14px 0 9px;
  }
  .priority-bridge-card{
    min-height:225px;
    padding:18px 24px;
  }
  .priority-bridge-card .priority-number{
    margin-bottom:8px;
  }
  .priority-bridge-card h3{
    font-size:23px;
  }
  .priority-bridge-question{
    margin-top:15px;
  }
  .dtc-journey-slide{
    padding-top:88px;
    padding-bottom:82px;
  }
  .dtc-step{
    height:41vh;
    min-height:290px;
    padding:16px 18px;
  }
  .dtc-step h3{
    margin-top:8px;
  }
  .dtc-business-box{
    margin-top:12px;
  }
}


/* =========================================================
   v1.8.3 — Correct Slide 12
   All selectors are scoped to bbx12-
   ========================================================= */

.bbx12-slide{
  padding:86px 3.6vw 74px;
  overflow:hidden;
}

.bbx12-shell{
  max-width:1280px;
  height:100%;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  gap:10px;
}

.bbx12-heading h1{
  margin:0 0 6px;
  font-size:clamp(42px,4.5vw,64px);
  line-height:1;
}

.bbx12-heading .lead{
  max-width:980px;
  margin:0;
  font-size:17px;
  line-height:1.3;
}

.bbx12-flow{
  min-height:0;
  display:grid;
  grid-template-columns:1fr 52px 1fr 52px 1.05fr;
  gap:10px;
  align-items:center;
}

.bbx12-card{
  position:relative;
  height:min(43vh,390px);
  min-height:315px;
  padding:18px 20px;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:22px;
  background:#fff;
  box-shadow:var(--shadow);
  text-align:left;
  display:flex;
  flex-direction:column;
}

.bbx12-card::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:7px;
  background:linear-gradient(180deg,var(--bb),var(--accent));
}

.bbx12-hidden{
  opacity:0;
  transform:translateY(16px) scale(.987);
  pointer-events:none;
}

.bbx12-reveal{
  opacity:1;
  transform:none;
  pointer-events:auto;
  animation:bbx12In .65s ease;
}

@keyframes bbx12In{
  from{opacity:0;transform:translateY(16px) scale(.987)}
  to{opacity:1;transform:none}
}

.bbx12-number{
  display:inline-grid;
  place-items:center;
  width:38px;
  height:38px;
  border-radius:11px;
  background:#eaf7ff;
  color:var(--bb);
  font-size:13px;
  font-weight:900;
}

.bbx12-card h3{
  margin:8px 0 5px;
  color:var(--bb);
  font-size:clamp(23px,1.9vw,30px);
  line-height:1.08;
}

.bbx12-card p{
  margin:0;
  color:var(--muted);
  font-size:14px;
  line-height:1.35;
}

.bbx12-form{
  display:grid;
  gap:12px;
  margin-top:18px;
  flex:1;
}

.bbx12-form label{
  display:grid;
  gap:4px;
  color:var(--bb);
  font-size:11px;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.bbx12-form input{
  width:100%;
  height:38px;
  border:1px solid #cfe0ed;
  border-radius:10px;
  padding:7px 10px;
  background:#fbfdff;
  color:var(--ink);
  font:inherit;
  font-size:14px;
}

.bbx12-amount{
  display:grid;
  grid-template-columns:1fr 82px;
  gap:8px;
}

.bbx12-amount span{
  display:grid;
  place-items:center;
  border-radius:10px;
  background:#eaf6fc;
  color:var(--bb);
  font-size:12px;
  font-weight:900;
}

.bbx12-card button{
  min-height:42px;
  border:0;
  border-radius:11px;
  padding:10px 14px;
  background:linear-gradient(180deg,#0a68bb,#075aa8);
  color:#fff;
  font-size:14px;
  font-weight:900;
  cursor:pointer;
}

.bbx12-form button{
  width:100%;
  margin-top:auto;
}

.bbx12-arrow{
  color:var(--accent);
  font-size:44px;
  font-weight:300;
  text-align:center;
  opacity:.2;
}

.bbx12-arrow.active{opacity:1}

.bbx12-summary{
  display:grid;
  gap:9px;
  margin-top:14px;
}

.bbx12-summary div{
  padding:12px 10px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fbfdff;
  text-align:center;
}

.bbx12-summary span{
  display:block;
  color:var(--muted);
  font-size:10px;
}

.bbx12-summary strong{
  display:block;
  margin-top:3px;
  color:var(--bb);
  font-size:clamp(20px,1.7vw,27px);
}

.bbx12-centre-button{
  display:flex;
  justify-content:center;
  margin-top:auto;
}

.bbx12-centre-button button{
  min-width:190px;
}

.bbx12-wallet{
  margin:16px 0 10px;
  padding:17px 10px;
  border:2px solid var(--accent);
  border-radius:16px;
  background:#f7fcff;
  text-align:center;
}

.bbx12-wallet span{
  display:block;
  color:var(--muted);
  font-size:11px;
}

.bbx12-wallet strong{
  display:block;
  color:var(--bb);
  font-size:clamp(34px,3vw,48px);
}

.bbx12-rate{
  color:var(--ink)!important;
  text-align:center;
  font-size:14px!important;
  font-weight:800;
}

.bbx12-note{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:12px;
  align-items:center;
  padding:10px 14px;
  border:1px solid var(--line);
  border-radius:15px;
  background:#fff;
  box-shadow:0 7px 18px rgba(0,87,167,.05);
}

.bbx12-note strong{
  color:var(--bb);
  white-space:nowrap;
  font-size:13px;
}

.bbx12-note span{
  color:var(--muted);
  font-size:12px;
  line-height:1.25;
}

@media(max-height:760px){
  .bbx12-slide{
    padding-top:78px;
    padding-bottom:68px;
  }

  .bbx12-card{
    height:40vh;
    min-height:290px;
    padding-top:14px;
  }

  .bbx12-heading h1{
    font-size:44px;
  }
}


/* =========================================================
   v1.8.4 — Correct Slide 13
   All selectors are scoped to bbx13-
   ========================================================= */

.bbx13-slide{
  padding:86px 3.5vw 74px;
  overflow:hidden;
}

.bbx13-shell{
  max-width:1280px;
  height:100%;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  gap:12px;
}

.bbx13-heading h1{
  margin:0 0 6px;
  font-size:clamp(40px,4.25vw,62px);
  line-height:1;
}

.bbx13-heading .lead{
  max-width:1040px;
  margin:0;
  font-size:17px;
  line-height:1.3;
}

.bbx13-grid{
  min-height:0;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  align-items:stretch;
}

.bbx13-card{
  position:relative;
  min-height:390px;
  padding:20px 18px 18px 22px;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:20px;
  background:#fff;
  box-shadow:var(--shadow);
  text-align:left;
  display:flex;
  flex-direction:column;
  opacity:0;
  transform:translateY(12px) scale(.987);
}

.bbx13-card::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:7px;
  background:linear-gradient(180deg,var(--bb),var(--accent));
}

.bbx13-number{
  display:grid;
  place-items:center;
  width:36px;
  height:36px;
  border-radius:10px;
  background:#e8f5fc;
  color:var(--bb);
  font-size:12px;
  font-weight:900;
}

.bbx13-card h3{
  margin:9px 0 6px;
  color:var(--bb);
  font-size:20px;
  line-height:1.12;
}

.bbx13-card p{
  margin:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.4;
}

.bbx13-image-card img{
  width:100%;
  height:180px;
  margin-top:auto;
  border-radius:14px;
  object-fit:cover;
  border:1px solid var(--line);
}

.bbx13-priorities{
  margin-top:14px;
}

.bbx13-priorities small{
  display:block;
  margin-bottom:6px;
  color:var(--muted);
  font-size:10px;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
}

#bbx13PriorityList{
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
}

.bbx13-priority{
  padding:9px 10px;
  border:1px solid var(--line);
  border-radius:11px;
  background:#fbfdff;
}

.bbx13-priority h4{
  margin:0 0 3px;
  color:var(--bb);
  font-size:12px;
}

.bbx13-priority ul{
  margin:0;
  padding-left:14px;
  color:var(--muted);
  font-size:10px;
  line-height:1.28;
}

.bbx13-note{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:12px;
  align-items:center;
  padding:10px 14px;
  border:1px solid var(--line);
  border-radius:15px;
  background:#fff;
  box-shadow:0 7px 18px rgba(0,87,167,.05);
}

.bbx13-note strong{
  color:var(--bb);
  white-space:nowrap;
  font-size:13px;
}

.bbx13-note span{
  color:var(--muted);
  font-size:12px;
  line-height:1.25;
}

.bbx13-slide.play .bbx13-card:nth-child(1){animation:bbx13In .6s ease .5s forwards}
.bbx13-slide.play .bbx13-card:nth-child(2){animation:bbx13In .6s ease 1.4s forwards}
.bbx13-slide.play .bbx13-card:nth-child(3){animation:bbx13In .6s ease 2.3s forwards}
.bbx13-slide.play .bbx13-card:nth-child(4){animation:bbx13In .6s ease 3.2s forwards}

@keyframes bbx13In{
  to{opacity:1;transform:none}
}

@media(max-height:780px){
  .bbx13-card{
    min-height:345px;
    padding-top:16px;
  }

  .bbx13-image-card img{
    height:145px;
  }

  .bbx13-card h3{
    font-size:18px;
  }

  .bbx13-card p{
    font-size:11px;
  }
}


/* =========================================================
   v1.8.5 Refined — Approved Slide 14
   All rules are scoped to bbx14-
   ========================================================= */

.bbx14-slide{
  padding:78px 3.6vw 82px;
  overflow:hidden;
}

.bbx14-shell{
  max-width:1280px;
  height:100%;
  margin:0 auto;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  gap:12px;
}

.bbx14-heading{
  text-align:center;
}

.bbx14-heading h1{
  margin:0 0 7px;
  color:var(--bb);
  font-size:clamp(40px,4.15vw,58px);
  line-height:1.02;
  letter-spacing:-1px;
}

.bbx14-heading .lead{
  max-width:1080px;
  margin:0 auto;
  color:var(--muted);
  font-size:16px;
  line-height:1.3;
}

.bbx14-flow{
  min-height:0;
  display:grid;
  grid-template-columns:1fr 44px 1fr 44px 1.12fr;
  gap:10px;
  align-items:stretch;
}

.bbx14-card{
  position:relative;
  height:450px;
  min-height:450px;
  padding:18px 20px;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:22px;
  background:#fff;
  box-shadow:var(--shadow);
  text-align:left;
  display:flex;
  flex-direction:column;
}

.bbx14-card::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:7px;
  background:linear-gradient(180deg,var(--bb),var(--accent));
}

.bbx14-number{
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  flex:0 0 38px;
  border-radius:11px;
  background:#eaf7ff;
  color:var(--bb);
  font-size:13px;
  font-weight:900;
  line-height:1;
}

.bbx14-card h3{
  margin:9px 0 6px;
  color:var(--bb);
  font-size:clamp(23px,1.9vw,30px);
  line-height:1.08;
}

.bbx14-card p{
  margin:0;
  color:var(--muted);
  font-size:14px;
  line-height:1.35;
}

.bbx14-arrow{
  align-self:center;
  color:var(--accent);
  font-size:42px;
  font-weight:300;
  line-height:1;
  text-align:center;
}

.bbx14-example{
  margin-top:12px;
  padding:13px 14px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fbfdff;
}

.bbx14-example strong{
  display:block;
  color:var(--bb);
  font-size:15px;
}

.bbx14-example ul{
  margin:7px 0 0;
  padding-left:18px;
  color:var(--muted);
  font-size:12px;
  line-height:1.4;
}

.bbx14-message{
  margin-top:12px;
  padding:12px 13px;
  border-radius:13px;
  background:#eef7fc;
  color:var(--bb);
  font-size:13px;
  font-weight:800;
  line-height:1.3;
  text-align:center;
}

.bbx14-form{
  display:grid;
  gap:4px;
  margin-top:8px;
  flex:1;
  grid-template-rows:auto auto auto 42px;
}

.bbx14-field-label{
  margin:0 !important;
  padding:0 !important;
  display:grid;
  gap:2px;
  color:var(--bb);
  font-size:11px;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.bbx14-form input{
  width:100%;
  height:36px;
  border:1px solid #cfe0ed;
  border-radius:10px;
  padding:7px 10px;
  background:#fbfdff;
  color:var(--ink);
  font:inherit;
  font-size:14px;
}

.bbx14-input-row{
  display:grid;
  grid-template-columns:1fr 76px;
  gap:8px;
}

.bbx14-input-row span{
  display:grid;
  place-items:center;
  border-radius:10px;
  background:#eaf6fc;
  color:var(--bb);
  font-size:12px;
  font-weight:900;
}

#bbx14Calculate{
  width:100%;
  height:42px;
  min-height:42px;
  margin:2px 0 0;
  border:0;
  border-radius:11px;
  padding:10px 14px;
  background:linear-gradient(180deg,#0a68bb,#075aa8);
  color:#fff;
  font-size:14px;
  font-weight:900;
  cursor:pointer;
  align-self:end;
}

.bbx14-hidden{
  opacity:0;
  transform:translateY(16px) scale(.987);
  pointer-events:none;
}

.bbx14-show{
  opacity:1;
  transform:none;
  pointer-events:auto;
  animation:bbx14Reveal .65s ease;
}

@keyframes bbx14Reveal{
  from{opacity:0;transform:translateY(16px) scale(.987)}
  to{opacity:1;transform:none}
}

.bbx14-calc{
  margin-top:16px;
  display:grid;
  grid-template-columns:1fr 22px 1fr 22px 1.15fr;
  gap:7px;
  align-items:center;
}

.bbx14-calc-box{
  min-height:130px;
  display:grid;
  place-items:center;
  padding:12px 9px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fbfdff;
  text-align:center;
}

.bbx14-calc-box span{
  display:block;
  color:var(--muted);
  font-size:11px;
  line-height:1.2;
}

.bbx14-calc-box strong{
  display:block;
  margin-top:5px;
  color:var(--bb);
  font-size:clamp(24px,2vw,31px);
}

.bbx14-calc-box small{
  display:block;
  margin-top:5px;
  color:var(--muted);
  font-size:10px;
  line-height:1.2;
}

.bbx14-symbol{
  color:var(--accent);
  font-size:25px;
  font-weight:900;
  text-align:center;
}

.bbx14-cost{
  border-color:#efc4b4;
  background:#fff8f4;
}

.bbx14-cost strong{color:#c45b2f}

.bbx14-retained{
  border-color:#9ddbc7;
  background:#f3fbf8;
}

.bbx14-retained strong{color:#0b7a55}

.bbx14-result-message{
  margin-top:14px;
  padding:13px 14px;
  border:1px solid #cfe7dc;
  border-radius:14px;
  background:linear-gradient(90deg,#eef8fd,#f3fbf8);
  text-align:center;
}

.bbx14-result-message strong{
  display:block;
  color:var(--bb);
  font-size:16px;
}

.bbx14-result-message span{
  display:block;
  margin-top:5px;
  color:#0b7a55;
  font-size:13px;
  font-weight:800;
  line-height:1.3;
}

.bbx14-note{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:12px;
  align-items:center;
  padding:10px 14px;
  border:1px solid var(--line);
  border-radius:15px;
  background:#fff;
  box-shadow:0 7px 18px rgba(0,87,167,.05);
  transform:translateY(-18px);
}

.bbx14-note strong{
  color:var(--bb);
  white-space:nowrap;
  font-size:13px;
}

.bbx14-note span{
  color:var(--muted);
  font-size:12px;
  line-height:1.25;
}

@media(max-height:780px){
  .bbx14-slide{
    padding-top:68px;
    padding-bottom:70px;
  }

  .bbx14-card{
    height:430px;
    min-height:430px;
  }

  .bbx14-heading h1{
    font-size:42px;
  }

  .bbx14-heading .lead{
    font-size:14px;
  }

  .bbx14-note{
    transform:translateY(-12px);
  }
}


/* =========================================================
   v1.8.6 — Slide 15 Purchasing Power in Action
   All selectors are scoped to bbx15-
   ========================================================= */

.bbx15-slide{
  padding:72px 3.4vw 92px;
  overflow:hidden;
  background:linear-gradient(180deg,#f8fcff 0%,#edf7fd 100%);
}

.bbx15-shell{
  max-width:1320px;
  height:100%;
  margin:0 auto;
  display:grid;
  grid-template-rows:auto auto minmax(0,1fr) auto auto;
  gap:9px;
}

.bbx15-heading{
  text-align:center;
}

.bbx15-heading .eyebrow{
  margin:0 0 5px;
  color:#00a7df;
  font-size:13px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.bbx15-heading h1{
  margin:0;
  color:var(--bb);
  font-size:clamp(40px,4.1vw,60px);
  line-height:1;
  letter-spacing:-1px;
}

.bbx15-heading .lead{
  max-width:1080px;
  margin:7px auto 0;
  color:var(--muted);
  font-size:15px;
  line-height:1.25;
}

.bbx15-purchase-strip{
  width:min(640px,56vw);
  margin:0 auto;
  padding:10px 18px;
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
  box-shadow:0 8px 20px rgba(0,87,167,.06);
  text-align:center;
}

.bbx15-purchase-strip span{
  display:block;
  color:var(--muted);
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.bbx15-purchase-strip strong{
  display:block;
  margin-top:3px;
  color:var(--bb);
  font-size:clamp(30px,2.8vw,44px);
  line-height:1;
}

.bbx15-main{
  min-height:0;
  display:grid;
  grid-template-columns:1fr 1.18fr 1.18fr;
  gap:16px;
  align-items:stretch;
}

.bbx15-card,
.bbx15-image-panel{
  position:relative;
  min-height:320px;
  border:1px solid var(--line);
  border-radius:22px;
  background:#fff;
  box-shadow:var(--shadow);
  overflow:hidden;
}

.bbx15-card{
  padding:19px 22px;
  display:flex;
  flex-direction:column;
  text-align:left;
}

.bbx15-card::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:7px;
  background:linear-gradient(180deg,var(--bb),var(--accent));
}

.bbx15-funded::before{
  background:linear-gradient(180deg,#0b7a55,#0fc282);
}

.bbx15-card h3{
  margin:0 0 9px;
  color:var(--bb);
  font-size:clamp(24px,1.95vw,31px);
  line-height:1.08;
}

.bbx15-funded h3{
  color:#0b7a55;
}

.bbx15-card p{
  margin:0;
  color:var(--muted);
  font-size:14px;
  line-height:1.3;
}

.bbx15-question{
  margin-top:15px;
  padding:10px 13px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fbfdff;
  color:var(--ink);
  font-size:14px;
  font-weight:900;
  text-align:center;
  text-transform:uppercase;
  letter-spacing:.02em;
}

.bbx15-funded .bbx15-question{
  border-color:#9ddbc7;
  background:#f3fbf8;
  color:#0b7a55;
}

.bbx15-big-money{
  margin:18px 0 10px;
  text-align:center;
}

.bbx15-big-money strong{
  display:block;
  color:#df1f1f;
  font-size:clamp(54px,5.5vw,82px);
  line-height:.95;
}

.bbx15-lost-img{
  width:100%;
  height:145px;
  margin-top:auto;
  border-radius:14px;
  object-fit:cover;
  object-position:center bottom;
  border:1px solid var(--line);
}

.bbx15-breakdown{
  display:grid;
  grid-template-columns:1fr 24px 1fr;
  gap:8px;
  align-items:center;
  margin:16px 0 12px;
}

.bbx15-breakdown-box{
  min-height:98px;
  display:grid;
  place-items:center;
  padding:10px 8px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fbfdff;
  text-align:center;
}

.bbx15-breakdown-box span{
  display:block;
  color:var(--muted);
  font-size:10px;
  line-height:1.2;
  text-transform:uppercase;
  letter-spacing:.03em;
}

.bbx15-breakdown-box strong{
  display:block;
  margin-top:4px;
  color:var(--bb);
  font-size:clamp(24px,2.25vw,34px);
  line-height:1;
}

.bbx15-breakdown-box small{
  display:block;
  margin-top:5px;
  color:var(--muted);
  font-size:10px;
  line-height:1.25;
}

.bbx15-breakdown-symbol{
  color:var(--accent);
  font-size:27px;
  font-weight:900;
  text-align:center;
}

.bbx15-cost strong{
  color:#c45b2f;
}

.bbx15-saved{
  margin-top:auto;
  padding:12px 12px;
  border:1px solid #9ddbc7;
  border-radius:15px;
  background:#f3fbf8;
  text-align:center;
}

.bbx15-saved strong{
  display:block;
  color:#0b7a55;
  font-size:clamp(24px,2.1vw,34px);
  line-height:1;
  white-space:nowrap;
}

.bbx15-saved span{
  display:block;
  margin-top:5px;
  color:var(--muted);
  font-size:11px;
  font-weight:800;
}

.bbx15-image-panel img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;
}

.bbx15-retained-title{
  position:absolute;
  top:0;
  left:0;
  right:0;
  padding:13px 16px;
  background:rgba(9,145,67,.95);
  color:#fff;
  font-size:clamp(28px,2.55vw,42px);
  font-weight:900;
  line-height:1;
  text-align:center;
  box-shadow:0 8px 20px rgba(0,0,0,.16);
  z-index:2;
}

.bbx15-saving-line{
  width:min(1160px,92%);
  margin:0 auto;
  color:var(--bb);
  font-size:clamp(20px,1.85vw,28px);
  font-weight:900;
  line-height:1.05;
  text-align:center;
  white-space:nowrap;
}

.bbx15-saving-line strong{
  color:#0b7a55;
}

.bbx15-choice{
  width:min(1140px,90%);
  margin:0 auto;
  padding:10px 18px;
  border:1px solid var(--line);
  border-radius:17px;
  background:#fff;
  box-shadow:0 7px 18px rgba(0,87,167,.05);
  color:var(--bb);
  font-size:clamp(19px,1.65vw,25px);
  font-weight:900;
  line-height:1.15;
  text-align:center;
  white-space:nowrap;
}

@media(max-height:780px){
  .bbx15-slide{
    padding-top:64px;
    padding-bottom:82px;
  }

  .bbx15-heading h1{
    font-size:42px;
  }

  .bbx15-heading .lead{
    font-size:13px;
  }

  .bbx15-card,
  .bbx15-image-panel{
    min-height:300px;
  }

  .bbx15-lost-img{
    height:110px;
  }

  .bbx15-retained-title{
    font-size:30px;
    padding:10px 14px;
  }

  .bbx15-saving-line{
    font-size:20px;
  }

  .bbx15-choice{
    font-size:20px;
    padding:9px 16px;
  }
}

@media(max-width:1200px){
  .bbx15-main{
    gap:12px;
  }

  .bbx15-saving-line,
  .bbx15-choice{
    white-space:normal;
  }
}


/* =========================================================
   v1.8.7 — Slide 16 Summary
   All selectors are scoped to bbx16-
   ========================================================= */

.bbx16-slide{
  padding:72px 3.6vw 92px;
  overflow:hidden;
  background:linear-gradient(180deg,#f8fcff 0%,#edf7fd 100%);
}

.bbx16-shell{
  max-width:1320px;
  height:100%;
  margin:0 auto;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  gap:16px;
}

.bbx16-heading{
  text-align:center;
}

.bbx16-heading .eyebrow{
  margin:0 0 8px;
  color:#00a7df;
  font-size:13px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.bbx16-heading h1{
  margin:0;
  color:var(--bb);
  font-size:clamp(44px,4.7vw,68px);
  line-height:.98;
  letter-spacing:-1.4px;
}

.bbx16-heading .lead{
  max-width:1080px;
  margin:10px auto 0;
  color:var(--muted);
  font-size:16px;
  line-height:1.3;
}

.bbx16-main{
  min-height:0;
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:22px;
  align-items:stretch;
}

.bbx16-list-card,
.bbx16-action-card{
  position:relative;
  border:1px solid var(--line);
  border-radius:24px;
  background:#fff;
  box-shadow:var(--shadow);
  overflow:hidden;
}

.bbx16-list-card{
  padding:26px 28px 24px 32px;
}

.bbx16-list-card::before,
.bbx16-action-card::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:7px;
  background:linear-gradient(180deg,var(--bb),var(--accent));
}

.bbx16-list-card h2,
.bbx16-action-card h2{
  margin:0 0 14px;
  color:var(--bb);
  font-size:clamp(28px,2.5vw,40px);
  line-height:1.05;
}

.bbx16-benefits{
  display:grid;
  gap:9px;
  margin:0;
  padding:0;
  list-style:none;
}

.bbx16-benefits li{
  display:grid;
  grid-template-columns:34px 1fr;
  gap:12px;
  align-items:start;
  padding:9px 12px;
  border:1px solid #d9e9f4;
  border-radius:15px;
  background:#fbfdff;
}

.bbx16-tick{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:#e9f9f1;
  color:#0b7a55;
  font-size:21px;
  font-weight:900;
}

.bbx16-benefits strong{
  display:block;
  color:var(--bb);
  font-size:17px;
  line-height:1.15;
}

.bbx16-benefits span{
  display:block;
  margin-top:3px;
  color:var(--muted);
  font-size:12px;
  line-height:1.25;
}

.bbx16-action-card{
  padding:28px 28px 24px 34px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}

.bbx16-check-wrap{
  display:grid;
  place-items:center;
  margin:8px 0 12px;
}

.bbx16-check{
  width:210px;
  height:210px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:linear-gradient(135deg,#7bd000,#11b96e);
  color:#fff;
  font-size:126px;
  font-weight:900;
  line-height:1;
  box-shadow:0 18px 42px rgba(21,148,74,.24);
}

.bbx16-action-card p{
  margin:0;
  color:var(--muted);
  font-size:16px;
  line-height:1.35;
  text-align:center;
}

.bbx16-highlight{
  margin-top:16px;
  padding:16px 18px;
  border:1px solid #9ddbc7;
  border-radius:17px;
  background:#f3fbf8;
  text-align:center;
}

.bbx16-highlight strong{
  display:block;
  color:#0b7a55;
  font-size:clamp(26px,2.6vw,38px);
  line-height:1.05;
}

.bbx16-highlight span{
  display:block;
  margin-top:6px;
  color:var(--muted);
  font-size:13px;
  font-weight:800;
}

.bbx16-choice{
  width:min(1120px,92%);
  margin:0 auto;
  padding:12px 18px;
  border:1px solid var(--line);
  border-radius:17px;
  background:#fff;
  box-shadow:0 7px 18px rgba(0,87,167,.05);
  color:var(--bb);
  font-size:clamp(21px,1.9vw,30px);
  font-weight:900;
  line-height:1.15;
  text-align:center;
}

@media(max-height:780px){
  .bbx16-slide{
    padding-top:64px;
    padding-bottom:82px;
  }

  .bbx16-heading h1{
    font-size:46px;
  }

  .bbx16-heading .lead{
    font-size:14px;
  }

  .bbx16-benefits{
    gap:6px;
  }

  .bbx16-benefits li{
    padding:7px 10px;
  }

  .bbx16-benefits strong{
    font-size:15px;
  }

  .bbx16-benefits span{
    font-size:11px;
  }

  .bbx16-check{
    width:170px;
    height:170px;
    font-size:102px;
  }

  .bbx16-choice{
    font-size:22px;
  }
}


/* =========================================================
   v1.9.0 Phase 1 — controlled board feedback changes
   Scoped to v190 / bbx-account selectors only
   ========================================================= */

.bbx-cover-v190{
  position:relative;
}

.bbx-cover-v190 > img{
  filter:brightness(.62) saturate(1.05);
}

.bbx-cover-overlay{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  align-content:center;
  gap:16px;
  padding:0 8vw;
  text-align:center;
  color:#fff;
}

.bbx-cover-overlay .eyebrow{
  margin:0;
  color:#6cc9f3;
  font-size:15px;
  letter-spacing:.18em;
  font-weight:900;
  text-transform:uppercase;
}

.bbx-cover-overlay h1{
  max-width:1120px;
  margin:0;
  color:#fff;
  font-size:clamp(48px,6vw,86px);
  line-height:.96;
  letter-spacing:-1.8px;
  text-shadow:0 16px 34px rgba(0,0,0,.28);
}

.bbx-cover-sub{
  max-width:1060px;
  margin:0;
  color:#f4fbff;
  font-size:clamp(20px,2vw,31px);
  font-weight:800;
  line-height:1.35;
  text-shadow:0 10px 24px rgba(0,0,0,.22);
}

.bbx-problem-v190{
  padding:76px 3.6vw 82px;
  overflow:hidden;
  background:linear-gradient(180deg,#f8fcff 0%,#edf7fd 100%);
}

.bbx-problem-shell{
  max-width:1280px;
  height:100%;
  margin:0 auto;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  gap:20px;
}

.bbx-problem-heading{
  text-align:center;
}

.bbx-problem-heading h1{
  max-width:1060px;
  margin:0 auto 10px;
  color:var(--bb);
  font-size:clamp(44px,5vw,72px);
  line-height:.98;
  letter-spacing:-1.5px;
}

.bbx-problem-heading .lead{
  max-width:950px;
  margin:0 auto;
  color:var(--muted);
  font-size:17px;
  line-height:1.32;
}

.bbx-problem-challenges{
  min-height:0;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:22px;
  align-items:stretch;
}

.bbx-problem-card{
  position:relative;
  min-height:360px;
  padding:28px 30px;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:24px;
  background:#fff;
  box-shadow:var(--shadow);
  text-align:left;
  display:flex;
  flex-direction:column;
}

.bbx-problem-card:before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:7px;
  background:linear-gradient(180deg,var(--bb),var(--accent));
}

.bbx-problem-number{
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  border-radius:13px;
  background:#eaf7ff;
  color:var(--bb);
  font-size:14px;
  font-weight:900;
}

.bbx-problem-card h2{
  margin:16px 0 10px;
  color:var(--bb);
  font-size:clamp(32px,3vw,48px);
  line-height:1.02;
}

.bbx-problem-card p{
  margin:0;
  color:var(--muted);
  font-size:17px;
  line-height:1.35;
}

.bbx-problem-examples{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:auto;
}

.bbx-problem-examples span{
  display:grid;
  place-items:center;
  min-height:48px;
  padding:10px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fbfdff;
  color:var(--bb);
  font-size:15px;
  font-weight:900;
  text-align:center;
}

.bbx-problem-examples.cash span{
  border-color:#9ddbc7;
  background:#f3fbf8;
  color:#0b7a55;
}

.bbx-problem-bottom{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:12px;
  align-items:center;
  width:min(1120px,92%);
  margin:0 auto;
  padding:12px 16px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  box-shadow:0 7px 18px rgba(0,87,167,.05);
}

.bbx-problem-bottom strong{
  color:var(--bb);
  font-size:15px;
  white-space:nowrap;
}

.bbx-problem-bottom span{
  color:var(--muted);
  font-size:14px;
  line-height:1.25;
}

.bbx-account-slide{
  padding:76px 3.6vw 82px;
  overflow:hidden;
  background:linear-gradient(180deg,#f8fcff 0%,#edf7fd 100%);
}

.bbx-account-shell{
  max-width:1280px;
  height:100%;
  margin:0 auto;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  gap:22px;
}

.bbx-account-heading{
  text-align:center;
}

.bbx-account-heading h1{
  max-width:1100px;
  margin:0 auto 10px;
  color:var(--bb);
  font-size:clamp(42px,4.7vw,68px);
  line-height:1;
  letter-spacing:-1.4px;
}

.bbx-account-heading .lead{
  max-width:1000px;
  margin:0 auto;
  color:var(--muted);
  font-size:17px;
  line-height:1.32;
}

.bbx-account-flow{
  min-height:0;
  display:grid;
  grid-template-columns:1fr 48px 1fr 48px 1fr;
  gap:12px;
  align-items:center;
}

.bbx-account-card{
  position:relative;
  min-height:340px;
  padding:26px 28px;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:24px;
  background:#fff;
  box-shadow:var(--shadow);
  text-align:left;
  display:flex;
  flex-direction:column;
}

.bbx-account-card:before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:7px;
  background:linear-gradient(180deg,var(--bb),var(--accent));
}

.bbx-account-number{
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  border-radius:13px;
  background:#eaf7ff;
  color:var(--bb);
  font-size:14px;
  font-weight:900;
}

.bbx-account-card h3{
  margin:18px 0 10px;
  color:var(--bb);
  font-size:clamp(26px,2.4vw,38px);
  line-height:1.05;
}

.bbx-account-card p{
  margin:0;
  color:var(--muted);
  font-size:17px;
  line-height:1.38;
}

.bbx-account-arrow{
  color:var(--accent);
  font-size:44px;
  font-weight:300;
  text-align:center;
  line-height:1;
}

.bbx-account-credit{
  display:grid;
  gap:5px;
  width:min(1120px,92%);
  margin:0 auto;
  padding:16px 20px;
  border:1px solid #9ddbc7;
  border-radius:18px;
  background:#f3fbf8;
  box-shadow:0 7px 18px rgba(0,87,167,.05);
  text-align:center;
}

.bbx-account-credit strong{
  color:#0b7a55;
  font-size:clamp(21px,2vw,30px);
  line-height:1.12;
}

.bbx-account-credit span{
  color:var(--muted);
  font-size:14px;
  font-weight:800;
}

@media(max-height:780px){
  .bbx-problem-v190,
  .bbx-account-slide{
    padding-top:64px;
    padding-bottom:74px;
  }

  .bbx-problem-heading h1,
  .bbx-account-heading h1{
    font-size:46px;
  }

  .bbx-problem-heading .lead,
  .bbx-account-heading .lead{
    font-size:14px;
  }

  .bbx-problem-card,
  .bbx-account-card{
    min-height:300px;
  }

  .bbx-problem-card h2,
  .bbx-account-card h3{
    font-size:30px;
  }

  .bbx-problem-card p,
  .bbx-account-card p{
    font-size:14px;
  }
}


/* v1.9.1 — Slide 2 image layout and navigation clearance */
.bbx-problem-v190{
  padding-bottom:96px;
}

.bbx-problem-card{
  min-height:390px;
}

.bbx-problem-image{
  width:100%;
  height:165px;
  margin-top:auto;
  border-radius:14px;
  border:1px solid var(--line);
  object-fit:cover;
  object-position:center;
}

.bbx-problem-bottom{
  margin-bottom:4px;
}

@media(max-height:780px){
  .bbx-problem-v190{
    padding-bottom:86px;
  }

  .bbx-problem-card{
    min-height:340px;
  }

  .bbx-problem-image{
    height:135px;
  }
}


/* v1.9.2 — Slide 2 image height and master nav restore */
.bbx-problem-card{
  min-height:430px;
}

.bbx-problem-image{
  height:340px;
  margin-top:16px;
}

.bbx-problem-card p{
  margin-bottom:0;
}

@media(max-height:780px){
  .bbx-problem-card{
    min-height:390px;
  }

  .bbx-problem-image{
    height:285px;
    margin-top:12px;
  }
}


/* v1.9.2 — navigation visibility safeguard */
.nav,
.nav-bar,
.slide-nav,
.progress,
.progress-bar,
#backBtn,
#nextBtn,
#progressFill{
  visibility:visible;
}

#nextBtn{
  display:inline-flex !important;
  opacity:1 !important;
  pointer-events:auto !important;
}


/* v1.9.3 — Slide 2 exact alignment and navigation fix
   Reason: old intro CSS had .app.problem-mode .nav { display:none; } */
.app.problem-mode .nav{
  display:flex !important;
  visibility:visible !important;
}

.app.problem-mode .progress{
  display:block !important;
  visibility:visible !important;
  position:relative;
  z-index:12;
}

.app.problem-mode .topbar{
  display:grid !important;
  visibility:visible !important;
}

.app.problem-mode #nextBtn{
  display:inline-flex !important;
  visibility:visible !important;
  opacity:1 !important;
  pointer-events:auto !important;
}

/* Slide 2 card layout: both images start at the same vertical position */
.bbx-problem-v190 .bbx-problem-challenges{
  align-items:stretch;
}

.bbx-problem-v190 .bbx-problem-card{
  display:grid;
  grid-template-rows:44px 98px 82px 340px;
  align-content:start;
  min-height:auto;
}

.bbx-problem-v190 .bbx-problem-card h2{
  align-self:start;
  margin:16px 0 0;
}

.bbx-problem-v190 .bbx-problem-card p{
  align-self:start;
  margin:0;
}

.bbx-problem-v190 .bbx-problem-image{
  height:340px;
  margin-top:0;
  align-self:start;
}

@media(max-height:780px){
  .bbx-problem-v190 .bbx-problem-card{
    grid-template-rows:40px 84px 66px 285px;
  }

  .bbx-problem-v190 .bbx-problem-image{
    height:285px;
    margin-top:0;
  }
}


/* v1.9.4 — Slide 11 Secret Sauce refinement only */
.bbx-account-priority{
  margin-top:18px;
  padding:12px 14px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#eef8ff;
  color:var(--bb);
  font-size:18px;
  font-weight:900;
  text-align:center;
}

.bbx-account-secret{
  padding-bottom:22px;
}

.bbx-account-secret img{
  width:100%;
  height:150px;
  margin-top:auto;
  border:1px solid var(--line);
  border-radius:14px;
  object-fit:cover;
  object-position:center;
}

@media(max-height:780px){
  .bbx-account-priority{
    margin-top:12px;
    padding:10px 12px;
    font-size:15px;
  }

  .bbx-account-secret img{
    height:120px;
  }
}


/* =========================================================
   v1.9.5 — Fixed 1920 × 1080 presentation stage
   The browser viewport scales the whole stage proportionally.
   Slides no longer rely on browser width/height for composition.
   ========================================================= */

html,
body{
  width:100%;
  height:100%;
  overflow:hidden !important;
}

body{
  margin:0;
  background:#dcecf6;
}

.bbx-stage-viewport{
  position:fixed;
  inset:0;
  width:100vw;
  height:100vh;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:#dcecf6;
}

.bbx-stage{
  width:1920px;
  height:1080px;
  transform-origin:center center;
  will-change:transform;
}

.bbx-stage .app{
  width:1920px;
  height:1080px;
  min-height:1080px;
  max-height:1080px;
  overflow:hidden;
  position:relative;
}

/* Override viewport-based slide sizing now that the app is a fixed stage */
.bbx-stage .slide{
  width:1920px;
  height:1080px;
}

/* Keep all existing nav/progress/topbar inside the 1920 × 1080 stage */
.bbx-stage .progress{
  position:absolute;
  top:0;
  left:0;
  right:0;
  z-index:30;
}

.bbx-stage .topbar{
  z-index:31;
}

.bbx-stage .nav{
  z-index:32;
}

/* Disable old mobile responsive reflow inside the fixed presentation stage */
@media(max-width:960px){
  html,
  body{
    overflow:hidden !important;
  }

  .bbx-stage-viewport{
    overflow:hidden;
  }

  .bbx-stage .app{
    height:1080px !important;
    min-height:1080px !important;
    overflow:hidden !important;
  }

  .bbx-stage .topbar{
    position:absolute !important;
    top:28px !important;
    left:44px !important;
    right:44px !important;
    padding:0 !important;
    background:transparent !important;
    backdrop-filter:none !important;
  }

  .bbx-stage .phase{
    display:block !important;
  }

  .bbx-stage .slide{
    position:absolute !important;
    inset:0 !important;
    display:block !important;
    min-height:1080px !important;
    padding:110px 7vw 96px;
    opacity:0;
    transform:translateX(30px);
    pointer-events:none;
  }

  .bbx-stage .slide.active{
    opacity:1;
    transform:none;
    pointer-events:auto;
  }

  .bbx-stage .split,
  .bbx-stage .wide{
    display:inherit;
  }

  .bbx-stage .nav{
    position:absolute !important;
    left:44px !important;
    right:44px !important;
    bottom:28px !important;
  }
}

/* v1.9.5 — keep Slide 2 and Slide 11 aligned inside fixed stage */
.bbx-stage .bbx-problem-v190 .bbx-problem-card{
  grid-template-rows:44px 98px 82px 340px;
}

.bbx-stage .bbx-problem-v190 .bbx-problem-image{
  height:340px;
  margin-top:0;
}

.bbx-stage .bbx-account-secret img{
  height:150px;
  margin-top:auto;
}

/* v1.9.5 — expose nav/progress on Slide 2 despite old prototype intro mode */
.bbx-stage .app.problem-mode .nav{
  display:flex !important;
  visibility:visible !important;
}

.bbx-stage .app.problem-mode .progress{
  display:block !important;
  visibility:visible !important;
}

.bbx-stage .app.problem-mode .topbar{
  display:grid !important;
  visibility:visible !important;
}


/* =========================================================
   v1.9.6 — Corrected fixed-stage architecture
   - Stage is a fixed 1920 × 1080 canvas.
   - Stage scales to fit the visible browser viewport.
   - Stage is anchored top-left, not centred, avoiding offset/cropping.
   - No individual slide reflow.
   ========================================================= */

html,
body{
  width:100%;
  height:100%;
  margin:0 !important;
  overflow:hidden !important;
  background:#dcecf6 !important;
}

.bbx-stage-viewport{
  position:fixed !important;
  inset:0 !important;
  width:100vw !important;
  height:100vh !important;
  overflow:hidden !important;
  background:#dcecf6 !important;
  display:block !important;
}

.bbx-stage{
  position:absolute !important;
  top:0 !important;
  left:0 !important;
  width:1920px !important;
  height:1080px !important;
  transform-origin:0 0 !important;
  will-change:transform;
  background:#f8fcff;
}

.bbx-stage .app{
  width:1920px !important;
  height:1080px !important;
  min-width:1920px !important;
  min-height:1080px !important;
  max-width:1920px !important;
  max-height:1080px !important;
  overflow:hidden !important;
  position:relative !important;
}

.bbx-stage .slide{
  width:1920px !important;
  height:1080px !important;
  min-width:1920px !important;
  min-height:1080px !important;
}

/* Prevent earlier stage centring from influencing layout */
.bbx-stage-viewport > .bbx-stage{
  margin:0 !important;
}

/* Keep the original presentation controls visible unless deliberately hidden on cover */
.bbx-stage .progress{
  position:absolute !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  z-index:30 !important;
}

.bbx-stage .topbar{
  position:absolute !important;
  z-index:31 !important;
}

.bbx-stage .nav{
  position:absolute !important;
  z-index:32 !important;
}

/* Old prototype Slide 2 mode must not hide nav/progress/topbar */
.bbx-stage .app.problem-mode .nav{
  display:flex !important;
  visibility:visible !important;
}

.bbx-stage .app.problem-mode .progress{
  display:block !important;
  visibility:visible !important;
}

.bbx-stage .app.problem-mode .topbar{
  display:grid !important;
  visibility:visible !important;
}

/* Cover still behaves like an opening slide */
.bbx-stage .app.cover-mode .progress,
.bbx-stage .app.cover-mode .topbar,
.bbx-stage .app.cover-mode .nav{
  display:none !important;
}

/* Disable the mobile stacked layout inside the scaled stage */
@media(max-width:960px){
  .bbx-stage .app{
    width:1920px !important;
    height:1080px !important;
    min-height:1080px !important;
    overflow:hidden !important;
  }

  .bbx-stage .slide{
    position:absolute !important;
    inset:0 !important;
    display:block !important;
    width:1920px !important;
    height:1080px !important;
    min-height:1080px !important;
    opacity:0;
    transform:translateX(30px);
    pointer-events:none;
  }

  .bbx-stage .slide.active{
    opacity:1 !important;
    transform:none !important;
    pointer-events:auto !important;
  }

  .bbx-stage .topbar{
    position:absolute !important;
    top:28px !important;
    left:44px !important;
    right:44px !important;
    padding:0 !important;
    background:transparent !important;
    backdrop-filter:none !important;
  }

  .bbx-stage .phase{
    display:block !important;
  }

  .bbx-stage .nav{
    position:absolute !important;
    left:44px !important;
    right:44px !important;
    bottom:28px !important;
  }
}


/* =========================================================
   v1.9.7 — Slide 12A Spending Branch
   ========================================================= */

.bbx-buying-slide{
  padding:76px 3.6vw 92px;
  overflow:hidden;
  background:linear-gradient(180deg,#f8fcff 0%,#edf7fd 100%);
}

.bbx-buying-shell{
  max-width:1320px;
  height:100%;
  margin:0 auto;
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  gap:22px;
}

.bbx-buying-heading{
  text-align:center;
}

.bbx-buying-heading h1{
  max-width:1180px;
  margin:0 auto 10px;
  color:var(--bb);
  font-size:clamp(44px,4.7vw,68px);
  line-height:1;
  letter-spacing:-1.4px;
}

.bbx-buying-heading .lead{
  max-width:1040px;
  margin:0 auto;
  color:var(--muted);
  font-size:17px;
  line-height:1.32;
}

.bbx-buying-grid{
  min-height:0;
  display:grid;
  grid-template-columns:1.1fr .95fr .95fr;
  gap:20px;
  align-items:stretch;
}

.bbx-buying-card{
  position:relative;
  min-height:520px;
  padding:24px 26px;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:24px;
  background:#fff;
  box-shadow:var(--shadow);
  text-align:left;
  display:flex;
  flex-direction:column;
}

.bbx-buying-card:before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:7px;
  background:linear-gradient(180deg,var(--bb),var(--accent));
}

.bbx-buying-number{
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  border-radius:13px;
  background:#eaf7ff;
  color:var(--bb);
  font-size:14px;
  font-weight:900;
}

.bbx-buying-card h3{
  margin:18px 0 8px;
  color:var(--bb);
  font-size:clamp(27px,2.25vw,38px);
  line-height:1.05;
}

.bbx-buying-card p{
  margin:0 0 14px;
  color:var(--muted);
  font-size:16px;
  line-height:1.34;
}

.bbx-pillar-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-top:2px;
}

.bbx-pillar{
  min-height:58px;
  padding:9px 10px;
  border:1px solid var(--line);
  border-radius:13px;
  background:#fbfdff;
  color:var(--bb);
  font-size:13px;
  font-weight:900;
  line-height:1.15;
  text-align:left;
  cursor:pointer;
}

.bbx-pillar.active{
  border-color:#00a7df;
  background:#eaf7ff;
  box-shadow:inset 5px 0 0 #00a7df;
}

.bbx-buying-range{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin:8px 0 24px;
}

.bbx-buying-range div{
  min-height:94px;
  padding:14px 12px;
  display:grid;
  place-items:center;
  border:1px solid var(--line);
  border-radius:15px;
  background:#fbfdff;
  text-align:center;
}

.bbx-buying-range span{
  color:var(--muted);
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.05em;
}

.bbx-buying-range strong{
  color:var(--bb);
  font-size:clamp(26px,2.35vw,38px);
  line-height:1;
}

.bbx-buying-label{
  display:block;
  margin:8px 0 7px;
  color:var(--bb);
  font-size:13px;
  font-weight:900;
  letter-spacing:.05em;
  text-transform:uppercase;
}

.bbx-buying-input-row{
  display:grid;
  grid-template-columns:1fr 82px;
  gap:10px;
  align-items:center;
}

.bbx-buying-input-row input{
  min-height:52px;
  padding:12px 14px;
  border:1px solid var(--line);
  border-radius:13px;
  background:#fbfdff;
  color:var(--ink);
  font-size:18px;
  font-weight:900;
}

.bbx-buying-input-row span{
  min-height:52px;
  display:grid;
  place-items:center;
  border-radius:13px;
  background:#eaf7ff;
  color:var(--bb);
  font-size:16px;
  font-weight:900;
}

.bbx-buying-process{
  display:grid;
  gap:10px;
  margin-top:2px;
}

.bbx-buying-process div{
  display:grid;
  grid-template-columns:34px 1fr;
  gap:10px;
  align-items:center;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fbfdff;
}

.bbx-buying-process strong{
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  border-radius:10px;
  background:#eaf7ff;
  color:var(--bb);
  font-size:14px;
}

.bbx-buying-process span{
  color:var(--muted);
  font-size:14px;
  font-weight:800;
  line-height:1.2;
}

.bbx-buying-summary{
  margin-top:auto;
  padding:14px 16px;
  border:1px solid #9ddbc7;
  border-radius:16px;
  background:#f3fbf8;
  text-align:center;
}

.bbx-buying-summary strong{
  display:block;
  color:#0b7a55;
  font-size:clamp(25px,2.2vw,34px);
  line-height:1;
}

.bbx-buying-summary span{
  display:block;
  margin-top:6px;
  color:var(--muted);
  font-size:12px;
  font-weight:800;
  line-height:1.25;
}

@media(max-height:780px){
  .bbx-buying-slide{
    padding-top:64px;
    padding-bottom:82px;
  }

  .bbx-buying-heading h1{
    font-size:46px;
  }

  .bbx-buying-heading .lead{
    font-size:14px;
  }

  .bbx-buying-card{
    min-height:455px;
  }

  .bbx-pillar{
    min-height:46px;
    font-size:11px;
    padding:7px 8px;
  }

  .bbx-buying-card h3{
    font-size:28px;
  }

  .bbx-buying-card p{
    font-size:13px;
  }
}


/* =========================================================
   v1.9.9 — Slide 11 staged reveal and Slide 12A gated flow
   ========================================================= */

/* Slide 11: reveal the mechanism one piece at a time */
.bbx-account-slide .bbx-account-card,
.bbx-account-slide .bbx-account-arrow,
.bbx-account-slide .bbx-account-credit{
  opacity:0;
  transform:translateY(18px);
}

.bbx-account-slide.play .bbx-account-card:nth-of-type(1){
  animation:bbxAccountReveal .62s ease forwards .15s;
}

.bbx-account-slide.play .bbx-account-flow > .bbx-account-arrow:nth-of-type(1){
  animation:bbxAccountReveal .45s ease forwards .75s;
}

.bbx-account-slide.play .bbx-account-card:nth-of-type(2){
  animation:bbxAccountReveal .62s ease forwards 1.05s;
}

.bbx-account-slide.play .bbx-account-flow > .bbx-account-arrow:nth-of-type(2){
  animation:bbxAccountReveal .45s ease forwards 1.65s;
}

.bbx-account-slide.play .bbx-account-card:nth-of-type(3){
  animation:bbxAccountReveal .62s ease forwards 1.95s;
}

.bbx-account-slide.play .bbx-account-credit{
  animation:bbxAccountReveal .62s ease forwards 2.55s;
}

@keyframes bbxAccountReveal{
  to{opacity:1;transform:none;}
}

/* Slide 12A: improve pillar explanations and reveal cards in stages */
.bbx-buying-card{
  transition:opacity .35s ease, transform .35s ease, filter .35s ease;
}

.bbx-buying-locked{
  opacity:0;
  transform:translateY(16px);
  pointer-events:none;
  filter:blur(2px);
}

.bbx-buying-card.bbx-buying-revealed{
  opacity:1;
  transform:none;
  pointer-events:auto;
  filter:none;
}

.bbx-pillar{
  position:relative;
}

.bbx-pillar-grid{
  gap:9px;
}

.bbx-pillar-info{
  min-height:86px;
  margin-top:12px;
  padding:12px 14px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fbfdff;
  box-shadow:0 7px 18px rgba(0,87,167,.04);
}

.bbx-pillar-info strong{
  display:block;
  color:var(--bb);
  font-size:15px;
  line-height:1.15;
}

.bbx-pillar-info span{
  display:block;
  margin-top:5px;
  color:var(--muted);
  font-size:12px;
  font-weight:800;
  line-height:1.25;
}

.bbx-buying-action{
  width:100%;
  min-height:52px;
  margin-top:auto;
  border:0;
  border-radius:14px;
  background:var(--bb);
  color:#fff;
  font-size:16px;
  font-weight:900;
  cursor:pointer;
  box-shadow:0 14px 30px rgba(0,87,167,.18);
}

.bbx-buying-action:disabled{
  opacity:.42;
  cursor:not-allowed;
  box-shadow:none;
}

.bbx-buying-action-secondary{
  margin-top:16px;
}

.bbx-turnover-box{
  display:grid;
  place-items:center;
  min-height:76px;
  margin:6px 0 14px;
  padding:12px 14px;
  border:1px solid var(--line);
  border-radius:15px;
  background:#eef8ff;
  text-align:center;
}

.bbx-turnover-box span{
  color:var(--muted);
  font-size:12px;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.bbx-turnover-box strong{
  color:var(--bb);
  font-size:clamp(26px,2.2vw,36px);
  line-height:1;
}

@media(max-height:780px){
  .bbx-pillar-info{
    min-height:70px;
    margin-top:8px;
    padding:9px 11px;
  }

  .bbx-pillar-info strong{
    font-size:13px;
  }

  .bbx-pillar-info span{
    font-size:11px;
  }

  .bbx-buying-action{
    min-height:44px;
    font-size:14px;
  }

  .bbx-turnover-box{
    min-height:62px;
    margin-bottom:10px;
  }
}


/* =========================================================
   v1.9.10 — Slide 15 / Wider Value refinement
   - Box 4 moved to first position.
   - Wider shell, larger text, shorter cards.
   - Images sit closer to the text to reduce white space.
   ========================================================= */

.bbx13-shell{
  max-width:1500px;
  gap:10px;
}

.bbx13-grid{
  gap:18px;
}

.bbx13-card{
  min-height:350px;
  padding:22px 20px 20px 25px;
}

.bbx13-card h3{
  margin:12px 0 8px;
  font-size:clamp(22px,1.65vw,28px);
  line-height:1.08;
}

.bbx13-card p{
  font-size:15px;
  line-height:1.34;
}

.bbx13-image-card img{
  height:185px;
  margin-top:18px;
}

.bbx13-priorities{
  margin-top:20px;
}

.bbx13-priorities small{
  font-size:12px;
  margin-bottom:8px;
}

.bbx13-priority{
  padding:11px 12px;
}

.bbx13-priority h4{
  font-size:15px;
  margin-bottom:5px;
}

.bbx13-priority ul{
  font-size:12px;
  line-height:1.32;
}

.bbx13-note{
  max-width:1500px;
  margin:0 auto;
}

@media(max-height:780px){
  .bbx13-card{
    min-height:315px;
  }

  .bbx13-image-card img{
    height:150px;
    margin-top:12px;
  }

  .bbx13-card h3{
    font-size:22px;
  }

  .bbx13-card p{
    font-size:13px;
  }

  .bbx13-priority h4{
    font-size:13px;
  }

  .bbx13-priority ul{
    font-size:10px;
  }
}


/* =========================================================
   v1.9.12 — Slide 16 fourth box / branch-specific calculation
   ========================================================= */

.bbx14-shell{
  max-width:1560px;
}

.bbx14-flow{
  grid-template-columns:1fr 34px 1fr 34px 1.12fr 34px 1.12fr;
  gap:10px;
}

.bbx14-arrow{
  font-size:36px;
}

.bbx14-card{
  height:438px;
  min-height:438px;
  padding:17px 18px;
}

.bbx14-card h3{
  font-size:clamp(21px,1.55vw,28px);
}

.bbx14-card p{
  font-size:13px;
}

.bbx14-calc{
  margin-top:12px;
  grid-template-columns:1fr 16px 1fr 16px 1.05fr;
  gap:5px;
}

.bbx14-calc-box{
  min-height:116px;
  padding:10px 7px;
}

.bbx14-calc-box strong{
  font-size:clamp(21px,1.55vw,28px);
}

.bbx14-result-message{
  margin-top:12px;
  padding:11px 12px;
}

.bbx14-result-message strong{
  font-size:14px;
}

.bbx14-result-message span{
  font-size:12px;
}

.bbx14-opportunity-card{
  overflow:hidden;
}

.bbx14-opportunity-metrics{
  display:grid;
  gap:9px;
  margin-top:12px;
}

.bbx14-opportunity-metric{
  display:grid;
  grid-template-columns:1fr auto;
  gap:12px;
  align-items:center;
  padding:11px 12px;
  border:1px solid var(--line);
  border-radius:13px;
  background:#fbfdff;
}

.bbx14-opportunity-metric span{
  color:var(--muted);
  font-size:11px;
  font-weight:900;
  letter-spacing:.05em;
  text-transform:uppercase;
  line-height:1.2;
}

.bbx14-opportunity-metric strong{
  color:var(--bb);
  font-size:clamp(18px,1.35vw,25px);
  line-height:1.05;
  text-align:right;
  white-space:nowrap;
}

.bbx14-opportunity-metric.green{
  border-color:#9ddbc7;
  background:#f3fbf8;
}

.bbx14-opportunity-metric.green strong{
  color:#0b7a55;
}

.bbx14-opportunity-metric.orange{
  border-color:#efc4b4;
  background:#fff8f4;
}

.bbx14-opportunity-metric.orange strong{
  color:#c45b2f;
}

.bbx14-opportunity-message{
  margin-top:auto;
  padding:12px 13px;
  border:1px solid #cfe7dc;
  border-radius:14px;
  background:linear-gradient(90deg,#eef8fd,#f3fbf8);
  text-align:center;
}

.bbx14-opportunity-message strong{
  display:block;
  color:var(--bb);
  font-size:15px;
  line-height:1.15;
}

.bbx14-opportunity-message span{
  display:block;
  margin-top:5px;
  color:#0b7a55;
  font-size:12px;
  font-weight:800;
  line-height:1.25;
}

@media(max-height:780px){
  .bbx14-card{
    height:410px;
    min-height:410px;
  }

  .bbx14-calc-box{
    min-height:102px;
  }

  .bbx14-opportunity-metric{
    padding:9px 10px;
  }

  .bbx14-opportunity-message{
    padding:10px 11px;
  }
}


/* =========================================================
   v1.9.13 — Slide 18 personalised summary
   ========================================================= */

.bbx16-shell{
  max-width:1420px;
  grid-template-rows:auto minmax(0,1fr) auto;
  gap:14px;
}

.bbx16-main{
  grid-template-columns:1.03fr .97fr;
  gap:24px;
}

.bbx16-list-card,
.bbx16-metrics-card{
  position:relative;
  border:1px solid var(--line);
  border-radius:24px;
  background:#fff;
  box-shadow:var(--shadow);
  overflow:hidden;
}

.bbx16-list-card,
.bbx16-metrics-card{
  padding:24px 28px 24px 32px;
}

.bbx16-list-card::before,
.bbx16-metrics-card::before,
.bbx16-score-card::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:7px;
  background:linear-gradient(180deg,var(--bb),var(--accent));
}

.bbx16-metrics-card h2{
  margin:0 0 12px;
  color:var(--bb);
  font-size:clamp(28px,2.5vw,40px);
  line-height:1.05;
}

.bbx16-metrics-card p{
  margin:0;
  color:var(--muted);
  font-size:15px;
  line-height:1.35;
  text-align:left;
}

.bbx16-metrics-grid{
  display:grid;
  gap:12px;
  margin-top:20px;
}

.bbx16-metric{
  display:grid;
  grid-template-columns:1fr auto;
  gap:18px;
  align-items:center;
  padding:16px 18px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fbfdff;
}

.bbx16-metric span{
  color:var(--muted);
  font-size:13px;
  font-weight:900;
  letter-spacing:.05em;
  text-transform:uppercase;
  line-height:1.2;
}

.bbx16-metric strong{
  color:var(--bb);
  font-size:clamp(26px,2.3vw,38px);
  line-height:1;
  text-align:right;
  white-space:nowrap;
}

.bbx16-primary-metric{
  border-color:#9ddbc7;
  background:#f3fbf8;
}

.bbx16-primary-metric strong{
  color:#0b7a55;
}

.bbx16-metric-note{
  margin-top:20px;
  padding:16px 18px;
  border:1px solid #cfe7dc;
  border-radius:17px;
  background:linear-gradient(90deg,#eef8fd,#f3fbf8);
  text-align:center;
}

.bbx16-metric-note strong{
  display:block;
  color:var(--bb);
  font-size:22px;
  line-height:1.08;
}

.bbx16-metric-note span{
  display:block;
  margin-top:6px;
  color:#0b7a55;
  font-size:13px;
  font-weight:800;
  line-height:1.28;
}

.bbx16-score-card{
  position:relative;
  width:min(1240px,95%);
  margin:0 auto;
  padding:14px 18px 14px 24px;
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
  box-shadow:0 7px 18px rgba(0,87,167,.05);
  display:grid;
  grid-template-columns:1fr auto;
  gap:22px;
  align-items:center;
}

.bbx16-score-card strong{
  display:block;
  color:var(--bb);
  font-size:clamp(20px,1.7vw,28px);
  line-height:1.08;
}

.bbx16-score-card span{
  display:block;
  margin-top:4px;
  color:var(--muted);
  font-size:12px;
  font-weight:800;
}

.bbx16-score-buttons{
  display:grid;
  grid-template-columns:repeat(10,42px);
  gap:7px;
}

.bbx16-score-button{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border:1px solid var(--line);
  border-radius:12px;
  background:#fbfdff;
  color:var(--bb);
  font-size:16px;
  font-weight:900;
  cursor:pointer;
}

.bbx16-score-button.active{
  border-color:#00a7df;
  background:#eaf7ff;
  box-shadow:inset 0 -4px 0 #00a7df;
}

@media(max-height:780px){
  .bbx16-shell{
    max-width:1380px;
    gap:10px;
  }

  .bbx16-list-card,
  .bbx16-metrics-card{
    padding:20px 24px 20px 28px;
  }

  .bbx16-metric{
    padding:12px 14px;
  }

  .bbx16-metric strong{
    font-size:28px;
  }

  .bbx16-score-buttons{
    grid-template-columns:repeat(10,36px);
  }

  .bbx16-score-button{
    width:36px;
    height:36px;
    font-size:14px;
  }
}


/* =========================================================
   v1.9.14 — Slides 19–23
   Account Options, Rewards, Guarantee, Decision, PDF Report
   ========================================================= */

.bbx-account-options-slide,
.bbx-rewards-slide,
.bbx-guarantee-slide,
.bbx-report-slide{
  padding:72px 3.6vw 92px;
  overflow:hidden;
  background:linear-gradient(180deg,#f8fcff 0%,#edf7fd 100%);
}

.bbx-account-options-shell,
.bbx-rewards-shell,
.bbx-guarantee-shell,
.bbx-report-shell{
  max-width:1480px;
  height:100%;
  margin:0 auto;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  gap:16px;
}

.bbx-guarantee-shell{
  grid-template-rows:auto minmax(0,1fr);
}

.bbx-account-options-heading,
.bbx-rewards-heading,
.bbx-guarantee-heading,
.bbx-report-heading{
  text-align:center;
}

.bbx-account-options-heading h1,
.bbx-rewards-heading h1,
.bbx-guarantee-heading h1,
.bbx-report-heading h1{
  margin:0;
  color:var(--bb);
  font-size:clamp(46px,4.8vw,74px);
  line-height:.98;
  letter-spacing:-1.5px;
}

.bbx-account-options-heading .lead,
.bbx-rewards-heading .lead,
.bbx-guarantee-heading .lead,
.bbx-report-heading .lead{
  max-width:1080px;
  margin:10px auto 0;
  color:var(--muted);
  font-size:17px;
  line-height:1.3;
}

.bbx-account-table{
  min-height:0;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  align-items:stretch;
}

.bbx-account-option{
  position:relative;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:22px;
  background:#fff;
  box-shadow:var(--shadow);
  display:grid;
  grid-template-rows:auto repeat(4,1fr);
  cursor:pointer;
}

.bbx-account-option::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:7px;
  background:linear-gradient(180deg,var(--bb),var(--accent));
}

.bbx-account-option.active{
  border-color:#00a7df;
  box-shadow:0 20px 46px rgba(0,87,167,.18);
}

.bbx-account-head{
  min-height:118px;
  padding:24px 20px 18px 27px;
  color:#fff;
  background:#c77a2d;
}

.bbx-account-option.gold .bbx-account-head{background:#f0c400;color:#082a45;}
.bbx-account-option.black .bbx-account-head{background:#050505;color:#fff;}
.bbx-account-option.micro .bbx-account-head{background:#c77a2d;color:#fff;}
.bbx-account-option.bronze .bbx-account-head{background:#c77a2d;color:#fff;}

.bbx-account-head h3{
  margin:0;
  font-size:clamp(28px,2.3vw,40px);
  line-height:1.05;
  font-style:italic;
}

.bbx-account-head span{
  display:block;
  margin-top:8px;
  font-size:14px;
  font-weight:900;
  line-height:1.15;
}

.bbx-account-row{
  display:grid;
  align-content:center;
  padding:18px 18px 18px 25px;
  border-top:1px solid #e0edf5;
  background:linear-gradient(180deg,#f9fcff,#eef6fb);
  text-align:center;
}

.bbx-account-row span{
  color:var(--ink);
  font-size:16px;
  font-weight:900;
  line-height:1.15;
}

.bbx-account-row strong{
  display:block;
  margin-top:8px;
  color:var(--ink);
  font-size:clamp(24px,2.1vw,34px);
  line-height:1;
}

.bbx-account-note{
  width:min(1280px,94%);
  margin:0 auto;
  padding:10px 14px;
  border:1px solid var(--line);
  border-radius:15px;
  background:#fff;
  color:var(--muted);
  font-size:13px;
  font-weight:800;
  line-height:1.25;
  text-align:center;
}

.bbx-rewards-shell{
  max-width:1440px;
}

.bbx-rewards-heading .sublead{
  margin:14px auto 0;
  color:var(--bb);
  font-size:clamp(20px,2vw,30px);
  font-style:italic;
  font-weight:800;
}

.bbx-rewards-board{
  min-height:0;
  padding:28px 34px;
  border:1px solid var(--line);
  border-radius:38px;
  background:#fff;
  box-shadow:var(--shadow);
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:18px;
  align-items:center;
}

.bbx-reward-logo{
  min-height:72px;
  display:grid;
  place-items:center;
  border:1px solid #e4edf4;
  border-radius:16px;
  background:#fbfdff;
  color:#0d2b43;
  font-size:clamp(22px,2vw,34px);
  font-weight:900;
  text-align:center;
  line-height:1;
}

.bbx-reward-logo.tesco{color:#e22626;}
.bbx-reward-logo.marks{font-size:42px;color:#111;}
.bbx-reward-logo.easyjet,.bbx-reward-logo.halfords,.bbx-reward-logo.homebase{background:#ff7800;color:#fff;}
.bbx-reward-logo.asda{color:#68b82f;font-size:42px;}
.bbx-reward-logo.argos{background:#e92c2c;color:#fff;font-size:42px;}
.bbx-reward-logo.boots{font-family:cursive;font-size:44px;}
.bbx-reward-logo.shell{color:#e31b23;background:#fff5d6;}
.bbx-reward-logo.bp{color:#1a9f4a;}
.bbx-reward-logo.apple{font-size:38px;}

.bbx-rewards-footer{
  width:min(1120px,92%);
  margin:0 auto;
  padding:13px 18px;
  border:1px solid #9ddbc7;
  border-radius:17px;
  background:#f3fbf8;
  text-align:center;
}

.bbx-rewards-footer strong{
  display:block;
  color:#0b7a55;
  font-size:22px;
}

.bbx-rewards-footer span{
  display:block;
  margin-top:4px;
  color:var(--muted);
  font-size:13px;
  font-weight:800;
}

.bbx-guarantee-main{
  min-height:0;
  display:grid;
  grid-template-columns:1.45fr .55fr;
  gap:28px;
  align-items:center;
}

.bbx-guarantee-card{
  position:relative;
  padding:44px 50px;
  border:1px solid var(--line);
  border-radius:28px;
  background:#fff;
  box-shadow:var(--shadow);
  overflow:hidden;
}

.bbx-guarantee-card::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:7px;
  background:linear-gradient(180deg,var(--bb),var(--accent));
}

.bbx-guarantee-card p{
  margin:0 0 34px;
  color:var(--bb);
  font-size:clamp(27px,2.4vw,40px);
  line-height:1.26;
  font-style:italic;
  font-weight:700;
  text-align:center;
}

.bbx-guarantee-card p:last-child{
  margin-bottom:0;
  font-size:clamp(24px,2.1vw,34px);
}

.bbx-guarantee-badge{
  display:grid;
  place-items:center;
}

.bbx-guarantee-seal{
  width:300px;
  height:300px;
  display:grid;
  place-items:center;
  align-content:center;
  gap:10px;
  border-radius:999px;
  border:12px solid #86c5f4;
  background:radial-gradient(circle at 35% 30%,#eef8ff,#0b63b6);
  color:#fff;
  text-align:center;
  box-shadow:0 24px 56px rgba(0,87,167,.24);
}

.bbx-guarantee-seal span{
  font-size:72px;
  font-weight:900;
  line-height:1;
}

.bbx-guarantee-seal strong{
  width:220px;
  font-size:21px;
  line-height:1.05;
  text-transform:uppercase;
}

.bbx-report-main{
  min-height:0;
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:24px;
  align-items:stretch;
}

.bbx-report-card,
.bbx-report-actions{
  position:relative;
  padding:28px 32px;
  border:1px solid var(--line);
  border-radius:24px;
  background:#fff;
  box-shadow:var(--shadow);
  overflow:hidden;
}

.bbx-report-card::before,
.bbx-report-actions::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:7px;
  background:linear-gradient(180deg,var(--bb),var(--accent));
}

.bbx-report-card h2,
.bbx-report-actions h2{
  margin:0 0 16px;
  color:var(--bb);
  font-size:clamp(30px,2.6vw,42px);
}

.bbx-report-actions p{
  margin:0 0 22px;
  color:var(--muted);
  font-size:17px;
  line-height:1.35;
}

.bbx-report-preview{
  display:grid;
  gap:10px;
}

.bbx-report-line{
  display:grid;
  grid-template-columns:1fr auto;
  gap:14px;
  align-items:center;
  padding:13px 15px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fbfdff;
}

.bbx-report-line span{
  color:var(--muted);
  font-size:13px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.05em;
}

.bbx-report-line strong{
  color:var(--bb);
  font-size:20px;
  text-align:right;
}

.bbx-report-button{
  width:100%;
  min-height:58px;
  margin-bottom:14px;
  border:0;
  border-radius:15px;
  background:var(--bb);
  color:#fff;
  font-size:18px;
  font-weight:900;
  cursor:pointer;
}

.bbx-report-button.secondary{
  background:#eef8ff;
  color:var(--bb);
  border:1px solid var(--line);
}

.bbx-report-smallprint{
  margin-top:16px;
  padding:14px 16px;
  border:1px solid #9ddbc7;
  border-radius:16px;
  background:#f3fbf8;
}

.bbx-report-smallprint strong{
  display:block;
  color:#0b7a55;
  font-size:16px;
}

.bbx-report-smallprint span{
  display:block;
  margin-top:5px;
  color:var(--muted);
  font-size:13px;
  font-weight:800;
}

@media(max-height:780px){
  .bbx-account-options-slide,
  .bbx-rewards-slide,
  .bbx-guarantee-slide,
  .bbx-report-slide{
    padding-top:62px;
    padding-bottom:82px;
  }

  .bbx-account-head{
    min-height:96px;
    padding-top:18px;
  }

  .bbx-account-row{
    padding:13px 14px 13px 21px;
  }

  .bbx-account-row span{
    font-size:13px;
  }

  .bbx-rewards-board{
    padding:22px 26px;
    gap:12px;
  }

  .bbx-reward-logo{
    min-height:58px;
    font-size:24px;
  }

  .bbx-guarantee-card{
    padding:34px 40px;
  }

  .bbx-guarantee-card p{
    font-size:28px;
  }

  .bbx-guarantee-seal{
    width:240px;
    height:240px;
  }

  .bbx-guarantee-seal span{
    font-size:58px;
  }
}


/* =========================================================
   v1.9.15 — Case Studies slide
   ========================================================= */

.bbx-case-slide{
  padding:72px 3.6vw 92px;
  overflow:hidden;
  background:linear-gradient(180deg,#f8fcff 0%,#edf7fd 100%);
}

.bbx-case-shell{
  max-width:1420px;
  height:100%;
  margin:0 auto;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  gap:18px;
}

.bbx-case-heading{
  text-align:center;
}

.bbx-case-heading h1{
  margin:0;
  color:var(--bb);
  font-size:clamp(46px,4.8vw,74px);
  line-height:.98;
  letter-spacing:-1.5px;
}

.bbx-case-heading .lead{
  max-width:1060px;
  margin:10px auto 0;
  color:var(--muted);
  font-size:17px;
  line-height:1.3;
}

.bbx-case-grid{
  min-height:0;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
  align-items:stretch;
}

.bbx-case-card{
  position:relative;
  display:grid;
  grid-template-rows:210px auto 1fr auto;
  gap:16px;
  padding:26px 28px 24px 34px;
  border:1px solid var(--line);
  border-radius:24px;
  background:#fff;
  box-shadow:var(--shadow);
  overflow:hidden;
}

.bbx-case-card::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:7px;
  background:linear-gradient(180deg,var(--bb),var(--accent));
}

.bbx-case-image{
  display:grid;
  place-items:center;
  width:100%;
  height:210px;
  border:1px solid var(--line);
  border-radius:18px;
  background:linear-gradient(135deg,#fbfdff,#eef8ff);
  overflow:hidden;
}

.bbx-case-image img{
  max-width:76%;
  max-height:76%;
  object-fit:contain;
}

.bbx-case-card h2{
  margin:0;
  color:var(--bb);
  font-size:clamp(31px,2.8vw,46px);
  line-height:1.02;
}

.bbx-case-card .bbx-case-result{
  margin:0;
  color:#0b7a55;
  font-size:clamp(21px,1.9vw,30px);
  font-weight:900;
  line-height:1.12;
}

.bbx-case-card .bbx-case-excerpt{
  margin:0;
  color:var(--muted);
  font-size:17px;
  line-height:1.35;
}

.bbx-case-button{
  justify-self:start;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:52px;
  padding:0 22px;
  border-radius:15px;
  background:var(--bb);
  color:#fff;
  font-size:16px;
  font-weight:900;
  text-decoration:none;
  box-shadow:0 14px 30px rgba(0,87,167,.18);
}

.bbx-case-note{
  width:min(1180px,94%);
  margin:0 auto;
  padding:13px 18px;
  border:1px solid var(--line);
  border-radius:17px;
  background:#fff;
  box-shadow:0 7px 18px rgba(0,87,167,.05);
  display:grid;
  grid-template-columns:auto 1fr;
  gap:14px;
  align-items:center;
}

.bbx-case-note strong{
  color:var(--bb);
  font-size:16px;
  white-space:nowrap;
}

.bbx-case-note span{
  color:var(--muted);
  font-size:13px;
  font-weight:800;
}

@media(max-height:780px){
  .bbx-case-slide{
    padding-top:62px;
    padding-bottom:82px;
  }

  .bbx-case-card{
    grid-template-rows:165px auto 1fr auto;
    gap:12px;
  }

  .bbx-case-image{
    height:165px;
  }

  .bbx-case-card h2{
    font-size:34px;
  }

  .bbx-case-card .bbx-case-result{
    font-size:22px;
  }

  .bbx-case-card .bbx-case-excerpt{
    font-size:14px;
  }
}


/* =========================================================
   v1.9.16 — Confirmed late-stage amendments
   ========================================================= */

.bbx-cover-sub{
  display:grid;
  gap:12px;
}

.bbx-cover-indirect{
  display:block;
  max-width:1180px;
  margin:0 auto;
  color:#9be5ff;
  font-size:clamp(16px,1.55vw,25px);
  line-height:1.32;
  font-weight:800;
}

.bbx-cover-indirect strong{
  color:#fff;
  text-transform:none;
  font-weight:900;
}

.growth-target-panel{
  display:grid;
  grid-template-columns:1.12fr 1.4fr .95fr;
  gap:12px;
  align-items:center;
  margin-top:11px;
  padding:12px 14px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  box-shadow:0 7px 18px rgba(0,87,167,.05);
}

.growth-target-copy strong{
  display:block;
  color:var(--bb);
  font-size:15px;
  line-height:1.12;
}

.growth-target-copy span{
  display:block;
  margin-top:4px;
  color:var(--muted);
  font-size:11px;
  font-weight:800;
  line-height:1.2;
}

.growth-target-metrics{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
}

.growth-target-metrics div{
  min-height:54px;
  display:grid;
  place-items:center;
  padding:8px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#fbfdff;
  text-align:center;
}

.growth-target-metrics span{
  color:var(--muted);
  font-size:10px;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.growth-target-metrics strong{
  color:var(--bb);
  font-size:20px;
  line-height:1;
}

.growth-target-input{
  display:grid;
  gap:5px;
  color:var(--bb);
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.04em;
}

.growth-target-input div{
  display:grid;
  grid-template-columns:1fr 48px;
  gap:7px;
}

.growth-target-input input{
  min-height:42px;
  padding:10px 11px;
  border:1px solid var(--line);
  border-radius:11px;
  background:#fbfdff;
  color:var(--ink);
  font-size:15px;
  font-weight:900;
}

.growth-target-input span{
  min-height:42px;
  display:grid;
  place-items:center;
  border-radius:11px;
  background:#eaf7ff;
  color:var(--bb);
}

.growth-target-warning{
  grid-column:1/-1;
  min-height:16px;
  margin:0;
  color:#c45b2f;
  font-size:12px;
  font-weight:900;
  text-align:center;
}

.bbx13-extra-repay{
  display:block;
  margin-top:8px;
  color:#0b7a55;
  font-size:12px;
  font-weight:900;
  line-height:1.25;
}

@media(max-height:820px){
  .growth-target-panel{
    grid-template-columns:1.05fr 1.4fr .95fr;
    padding:9px 12px;
  }

  .growth-target-metrics div{
    min-height:45px;
  }

  .growth-target-metrics strong{
    font-size:17px;
  }

  .growth-target-copy strong{
    font-size:13px;
  }

  .growth-target-copy span,
  .growth-target-input{
    font-size:10px;
  }

  .growth-target-input input,
  .growth-target-input span{
    min-height:36px;
  }
}


/* v1.9.17 — Slide 15: repayment note sits outside selected-priority box */
.bbx13-extra-repay{
  display:block;
  margin-top:10px;
  color:var(--muted);
  font-size:12px;
  font-weight:900;
  letter-spacing:.05em;
  line-height:1.25;
  text-transform:uppercase;
}



/* =========================================================
   v1.9.19 — HTML Hero visual fix

   Strategy:
   - Use the supplied opening-hero.png as the full visual artwork.
   - Preserve the BBX / IRTA branding and right-hand city imagery exactly.
   - Mask only the old baked-in copy area and bottom country strip.
   - Render editable headline, heritage statement, global statement
     and country lists as HTML from BBX_CONFIG.hero.
   ========================================================= */

.bbx-html-hero{
  position:relative;
  padding:0 !important;
  background:#061e4c;
  overflow:hidden;
  cursor:pointer;
  transform:none !important;
}

.bbx-html-hero .bbx-hero-artwork{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  z-index:0;
}

/* Cover the old baked-in "Earn more / Since 1993 / body copy" only.
   This leaves the original BBX + IRTA logo area and right-side imagery untouched. */
.bbx-html-hero .bbx-hero-copy-mask{
  position:absolute;
  left:86px;
  top:360px;
  width:790px;
  height:360px;
  z-index:1;
  background:
    radial-gradient(circle at 18% 10%,rgba(10,45,103,.18),transparent 35%),
    linear-gradient(135deg,#061e4c 0%,#071f51 100%);
}

/* Editable copy overlay */
.bbx-html-hero .bbx-hero-copy{
  position:absolute;
  left:92px;
  top:375px;
  width:760px;
  z-index:2;
  color:#fff;
}

.bbx-html-hero .bbx-hero-copy h1{
  margin:0;
  color:#fff;
  font-size:104px;
  line-height:.92;
  font-weight:300;
  letter-spacing:-3px;
}

.bbx-html-hero .bbx-hero-accent{
  width:118px;
  height:5px;
  margin:26px 0 22px;
  background:linear-gradient(90deg,#00a7e1,#168bd1);
}

.bbx-html-hero .bbx-hero-copy h2{
  margin:0 0 16px;
  color:#fff;
  font-size:36px;
  line-height:1;
  font-weight:900;
}

.bbx-html-hero .bbx-hero-copy p{
  max-width:700px;
  margin:0;
  color:#fff;
  font-size:28px;
  line-height:1.28;
  font-weight:400;
}

/* Completely replace the baked-in country strip with editable HTML. */
.bbx-html-hero .bbx-hero-country-strip{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  min-height:122px;
  z-index:4;
  padding:14px 70px 13px;
  display:grid;
  align-content:center;
  gap:8px;
  background:linear-gradient(90deg,#0878ce,#0b55b1);
  box-shadow:0 -8px 30px rgba(0,0,0,.12);
}

.bbx-html-hero .bbx-hero-country-row{
  display:flex;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;
  color:#fff;
  font-size:15px;
  font-weight:800;
  line-height:1.15;
  text-transform:uppercase;
  letter-spacing:.02em;
}

.bbx-html-hero .bbx-hero-country-row > span{
  display:inline-flex;
  align-items:center;
}

.bbx-html-hero .bbx-hero-country-row > span:not(:last-child)::after{
  content:"";
  width:1px;
  height:18px;
  margin:0 13px;
  background:rgba(255,255,255,.55);
}

.bbx-html-hero .bbx-hero-country-row-indirect{
  color:#c7efff;
  font-size:13px;
  text-transform:none;
  font-weight:700;
}

.bbx-html-hero .bbx-hero-country-row-indirect strong{
  margin-right:10px;
  color:#fff;
  font-weight:900;
}

.bbx-html-hero .bbx-hero-country-row-indirect span{
  display:inline;
}

.bbx-html-hero .bbx-hero-country-row-indirect span::after{
  display:none !important;
}

.bbx-html-hero .prototype-hint{
  z-index:5;
  bottom:12px;
  font-size:14px;
}

/* Do not let older short-height rules distort the hero.
   The whole 1920×1080 stage should scale proportionally instead. */
@media(max-height:780px){
  .bbx-html-hero .bbx-hero-copy h1{font-size:104px}
  .bbx-html-hero .bbx-hero-copy h2{font-size:36px}
  .bbx-html-hero .bbx-hero-copy p{font-size:28px}
}
