/* =========================================================
   BBX UK — DESIGN TWEAKS
   Load AFTER:
   1. styles.css
   2. responsive-overrides.css

   Purpose:
   Final visual refinements only.
   Keep structural / scaling rules in responsive-overrides.css.
   ========================================================= */


/* =========================================================
   SLIDE 2 — INTRODUCTION / COMMERCIAL CHALLENGES
   ========================================================= */

/* Let the number, heading and paragraph size naturally.
   Keep the image at a fixed 340px height. */
.bbx-stage .bbx-problem-v190 .bbx-problem-card {
  grid-template-rows: 44px auto auto 340px !important;
  row-gap: 12px !important;
  padding-top: 24px !important;
  padding-bottom: 24px !important;
}

/* Card headings */
.bbx-stage .bbx-problem-v190 .bbx-problem-card h3,
.bbx-stage .bbx-problem-v190 .bbx-problem-card h2 {
  font-size: 44px !important;
  line-height: 1.08 !important;
  margin: 0 !important;
}

/* Paragraph copy */
.bbx-stage .bbx-problem-v190 .bbx-problem-card p {
  font-size: 24px !important;
  line-height: 1.35 !important;
  margin: 0 !important;
}

/* Small gap between paragraph and image */
.bbx-stage .bbx-problem-v190 .bbx-problem-image {
  height: 340px !important;
  margin-top: 6px !important;
}

/* Intro line under the main slide heading */
.bbx-stage .bbx-problem-heading .lead {
  font-size: 26px !important;
  line-height: 1.25 !important;
  margin-top: 8px !important;
}


/* =========================================================
   GENERAL SUBHEADING RULE
   Use this for secondary headings where space allows.
   ========================================================= */

.slide h3,
.slide .subheading,
.slide .section-subheading {
  font-size: 26px;
  line-height: 1.1;
font-weight: bold;
}






/* =========================================================
   SLIDE 3 
   ========================================================= */

.industry-card b, .goal-card b {
    font-size: 30px;
    margin-bottom: 8px;
}

.industry-card span, .goal-card span {
    font-size: 20px;

}

/* =========================================================
   SLIDE 5 
   ========================================================= */


.priority-selection-slide .goal-card b {
    font-size: 30px;
}

.priority-selection-slide .goal-card span {
    font-size: 20px;
}

.priority-selection-slide .goal-card ul, .priority-selection-slide .goal-card.active ul {
    font-size: 20px;
}

/* =========================================================
   SLIDE 9 — CALCULATION LABELS
   ========================================================= */

.bbx-stage .calc-row span,
.bbx-stage .total span,
.bbx-stage .bar-label {
  font-size: 20px !important;
  line-height: 1.25 !important;
}

/* =========================================================
   SLIDE 10
   ========================================================= */


.priority-bridge-label {
    font-size: 20px;
}

.priority-bridge-card p {
    font-size: 20px;
}

.priority-bridge-card ul {
    font-size: 20px;
}

.priority-bridge-card h3 {
    font-size: 36px;
}

/* =========================================================
   SLIDE 11
   ========================================================= */

.bbx-account-card p {
    font-size: 20px;
}

.bbx-account-card h3 {
  font-size: 36px !important;
}

.bbx-account-credit {
    border: 1px solid #FFE800;
    background: #FFFF00;
}

.bbx-account-credit span {
    color: #12617e;
    font-size: 20px;
}

/* =========================================================
   SLIDE 12 A
   ========================================================= */

.bbx-buying-shell {
    max-width: 1420px;
}

.bbx-buying-heading .lead {
    max-width: 1400px;
}

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

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

.bbx-buying-process span {
    font-size: 20px;
}

.bbx-buying-summary span {
    font-size: 14px;
}

.bbx-pillar {
    font-size: 16px;
}

/* =========================================================
   SLIDE 13
   ========================================================= */

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

.network-card {
    width: 300px;
}

.network-card p {
    font-size: 16px;
}

/* =========================================================
   SLIDE 13 — ADDITIONAL REVENUE TARGET
   ========================================================= */


/* Replacement for the four small outcome boxes */
.bbx-stage .growth-target-heading {
  width: 100%;
  margin: 14px 0 10px;
  padding: 12px 20px;

  border: 1px solid var(--line);
  border-radius: 14px;

  background: #ffff00;

  text-align: center;
}

.bbx-stage .growth-target-heading strong {
  display: block;

  color: var(--bb);

  font-size: 26px;
  line-height: 1.15;
  font-weight: 900;
}

.bbx-stage .growth-target-heading span {
  display: block;

  margin-top: 5px;

  color: var(--muted);

  font-size: 20px;
  line-height: 1.25;
  font-weight: 700;
}


/* The panel now only contains the figures + input */
.bbx-stage .growth-target-panel {
  grid-template-columns: 1.4fr 1fr !important;

  margin-top: 0 !important;

  padding: 16px 18px !important;

  gap: 18px !important;
}


/* Give the figures more breathing room */
.bbx-stage .growth-target-metrics {
  gap: 12px !important;
}


/* Slightly larger target figures */
.bbx-stage .growth-target-metrics strong {
  font-size: 34px !important;
}


/* Larger input label */
.bbx-stage .growth-target-input {
  font-size: 16px !important;
}


/* Larger actual input */
.bbx-stage .growth-target-input input {
  min-height: 50px !important;

  font-size: 20px !important;
}


/* Currency box beside the input */
.bbx-stage .growth-target-input span {
  min-height: 50px !important;

  font-size: 18px !important;
}

/* Slide 13 — rebalance revenue target widths */
.bbx-stage .growth-target-panel {
  grid-template-columns: 1.85fr 0.7fr !important;
  gap: 18px !important;
}

.bbx-stage .growth-target-metrics {
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 14px !important;
}

.growth-target-metrics span {
    font-size: 20px;
}

.bbx-stage .growth-target-input input {
  text-align: right !important;
}

.growth-target-warning {
    font-size: 20px;
}

.bbx-stage .growth-target-input {
    font-size: 20px !important;
}

/* =========================================================
   SLIDE 14 
   ========================================================= */



.bbx12-form label {
    font-size: 20px;
}


.bbx-stage .bbx12-slide .bbx12-card p {
    font-size: 20px;
}

.bbx12-rate {
    font-size: 20px !important;
}

/* Slide 14 — natural card height, vertically centred */
.bbx-stage .bbx12-slide .bbx12-flow {
  align-items: center !important;
}

.bbx-stage .bbx12-slide .bbx12-card {
  height: auto !important;
  min-height: max-content !important;
  align-self: center !important;
  overflow: hidden !important;
}

.bbx12-form input {
    font-size: 20px;
    height: 58px;
}

.bbx12-heading .lead {
    margin: 0 auto;
}

.bbx12-centre-button {
    margin-top: 10px;
}

/* =========================================================
   SLIDE 15 
   ========================================================= */

.bbx13-heading .lead {
    margin: 0 auto;
}

.bbx-stage .bbx13-slide .bbx13-grid {
  align-items: center !important;
}

.bbx-stage .bbx13-slide .bbx13-card {
  height: auto !important;
  min-height: max-content !important;
  align-self: center !important;
  overflow: hidden !important;
}

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

.bbx13-priorities small {
    font-size: 20px;
}

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

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

/* =========================================================
   SLIDE 16 
   ========================================================= */

.bbx-stage .bbx14-slide .bbx14-flow {
  align-items: stretch !important;
}

.bbx-stage .bbx14-slide .bbx14-card {
  height: auto !important;
  min-height: 500px !important;
  overflow: hidden !important;
}

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

.bbx14-example strong {
    font-size: 24px;
}

.bbx14-example ul {
    font-size: 18px;
}

.bbx14-message {
    font-size: 16px;
}

.bbx14-field-label {
    font-size: 18px;
}

.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: 20px;
margin: 10px 0;
}

.bbx14-calc-box span {
    font-size: 16px;
}

.bbx14-calc-box small {
    font-size: 16px;
}

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

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

.bbx14-opportunity-metric span {
    font-size: 16px;
}


.bbx14-opportunity-message strong {
    font-size: 20px;
}

.bbx14-opportunity-message span {
    font-size: 18px;
}

.bbx-stage .bbx14-slide .bbx14-flow {
  align-items: center !important;
}

.bbx-stage .bbx14-slide .bbx14-card {
  height: auto !important;
  min-height: max-content !important;
  align-self: center !important;
  overflow: hidden !important;
}

/* =========================================================
   SLIDE 17 
   ========================================================= */

.bbx15-card p {
    font-size: 20px;
}

.bbx15-question {
    font-size: 24px;
background: #FFFF00;
}

.bbx15-breakdown-box span {
    font-size: 18px;
}

.bbx15-breakdown-box small {
    font-size: 18px;
}

.bbx15-saved {
    background: #099143;
}

.bbx15-saved span {
    font-size: 20px;
}

.bbx15-choice {
    background: #ffff00;
}

.bbx15-purchase-strip span {
    font-size: 18px;
}

.bbx15-saved strong {
    color: #FFF;
}

.bbx15-saved span {
    color: #FFF;
}

/* =========================================================
   SLIDE 18 
   ========================================================= */

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

.bbx-case-card h2 {
    font-weight: bold;
    margin-bottom: 27px;
}

/* =========================================================
   SLIDE 19 
   ========================================================= */

.bbx16-list-card h2, .bbx16-action-card .bbx16-metrics-card h2 {
    font-weight: bold;
}

.bbx16-metrics-card h2 {
    font-weight: bold;
}

.bbx16-metrics-card p {
    font-size: 20px;
}

.bbx16-metric span {
    font-size: 18px;
}

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

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

.bbx16-heading .lead {
    max-width: 1200px;
    font-size: 16px;
}

.bbx16-shell {
    max-width: 1520px;
}

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

.bbx16-metric-note span {
    font-size: 18px;
}

.bbx16-score-card strong {
    font-size: 24px;
}

.bbx16-score-card {

    width: min(1540px, 100%);

}

.bbx-account-note {
    font-size: 20px;
   font-weight: 400; 
}

/* =========================================================
   SLIDE 20 
   ========================================================= */

.bbx-account-head h3 {
    font-size: 40px !important;
}

.bbx-stage .bbx-account-option.black .bbx-account-head h3 {
  color: #fff !important;
}

.bbx-stage .bbx-account-option.bronze .bbx-account-head h3 {
  color: #f0c400 !important;
}

.bbx-stage .bbx-account-option.micro .bbx-account-head h3 {
  color: #f0c400 !important;
}


.bbx-account-head span {
    font-size: 20px;
    font-weight: 400;
}

.bbx-account-row span {
    font-size: 24px;
    font-weight: 400;
}

/* =========================================================
   SLIDE 21
   ========================================================= */


.bbx-rewards-footer span {
    font-size: 24px;
    font-weight: 400;
}

.bbx-rewards-footer strong {
    font-size: 30px;
}

.bbx-rewards-footer {
    width: min(1420px, 92%);
}

/* =========================================================
   SLIDE 24
   ========================================================= */

.bbx-report-card h2, .bbx-report-actions h2 {
    font-weight: bold;
}

.bbx-report-actions p {
    font-size: 20px;
}

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

/* =========================================================
   ALL SLIDES 
   ========================================================= */

.slide {
    padding: 70px 7vw 96px;
}

.bbx-stage .lead {
  font-size: 26px !important;
  line-height: 1.25 !important;
}

.eyebrow {
    font-size: 24px;
}

p {
    font-size: 24px;
}

label {
    font-size: 20px;
}

.big-list li {
    font-size: 24px;
}

.bbx-stage .choice-grid button,
.bbx-stage .choice-card,
.bbx-stage .frequency-grid button {
  font-size: 20px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
}



.bbx-report-contact-fields{
  display:grid;
  grid-template-columns:1fr;
  gap:14px;
  margin:0 0 20px;
}

.bbx-report-field{
  display:grid;
  gap:7px;
}

.bbx-report-field span{
  color:var(--bb);
  font-size:14px;
  font-weight:900;
}

.bbx-report-field input{
  width:100%;
  min-height:52px;
  padding:0 16px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fbfdff;
  color:#1d2d3d;
  font:inherit;
  font-size:16px;
  box-sizing:border-box;
}

.bbx-report-field input:focus{
  outline:2px solid var(--accent);
  outline-offset:1px;
  border-color:var(--accent);
}
/* UK SLIDE 13 — INDIA-MATCHED LAYOUT REFINEMENT */
.bbx-stage .how-bbx-slide .how-bbx-network{height:480px !important;margin-top:20px !important;}
.bbx-stage .how-bbx-slide .card-marketing{top:2.5% !important;}
.bbx-stage .how-bbx-slide .card-events{bottom:2.5% !important;}
.bbx-stage .how-bbx-slide .card-marketing,.bbx-stage .how-bbx-slide .card-events{width:320px !important;}
.bbx-stage .how-bbx-slide .card-marketing h3,.bbx-stage .how-bbx-slide .card-events h3{font-size:24px !important;line-height:1.05 !important;}
.bbx-stage .how-bbx-slide .growth-target-heading{margin-top:12px !important;margin-bottom:10px !important;}
.bbx-stage .how-bbx-slide .growth-target-panel{margin-top:0 !important;}
.bbx-stage .how-bbx-slide .business-centre strong{max-width:170px;text-align:center;line-height:1.05;overflow-wrap:break-word;}
