:root {
      --bz-navy: #29286B;
      --bz-yellow: #DECA2E;
      --bz-light: #F7F8FC;
      --bz-text: #1F2430;
    }

    body { 
        font-family: 'Manrope', sans-serif; 
        color: var(--bz-text); 
    }

    .bg-dark, .navbar-dark { 
        background-color: var(--bz-navy) !important; 
    }

    .btn-success { 
        background-color: var(--bz-yellow); 
        border-color: var(--bz-yellow); 
        color: #111 !important; 
        font-weight: 800; 
    }

    .btn-success:hover { 
        background-color: #cdbb27; 
        border-color: #cdbb27; 
        color: #111 !important; 
    }

    .text-success { 
        color: var(--bz-yellow) !important; 
    }

    .border-success { 
        border-color: var(--bz-yellow) !important; 
    }

    .navbar-brand img { 
        max-height: 48px; 
        width: auto; 
    }

    .hero-mark { 
        position: absolute; 
        right: -6%; 
        top: 8%; 
        max-width: 48%; 
        opacity: .13; 
    }

    .service-card { 
        border: 1px solid #E6E8F0; 
        border-radius: 18px; 
        padding: 30px; 
        height: 100%; 
        background: #fff; 
        transition: all .2s ease-in-out; 
    }

    .service-card:hover { 
        transform: translateY(-4px); 
        box-shadow: 0 18px 45px rgba(20,20,60,.12); 
    }

    .icon-circle { 
        width: 56px; 
        height: 56px; 
        border-radius: 50%; 
        background: rgba(222,202,46,.18); 
        display: inline-flex; 
        align-items: center; 
        justify-content: center; 
        color: var(--bz-navy); 
        margin-bottom: 18px; 
    }

    .section-kicker { 
        color: var(--bz-navy); 
        font-weight: 800; 
        letter-spacing: .08em; 
        text-transform: uppercase; 
        font-size: .85rem; 
    }

    .problem-card { 
        background: var(--bz-light); 
        border-radius: 18px; 
        padding: 24px; 
        height: 100%; 
    }

    .cta-box { 
        background: var(--bz-navy); 
        border-radius: 24px; 
        overflow: hidden; 
    }

    .mini-stat { 
        border-left: 4px solid var(--bz-yellow); 
        padding-left: 18px; 
    }

    .footer-logo { 
        max-height: 58px; 
        width: auto; 
    }

    .link-arrow { 
        color: var(--bz-navy); 
        font-weight: 800; 
        text-decoration: none; 
        border-bottom: 2px solid var(--bz-yellow); 
        padding-bottom: 4px; 
    }

    .hero-badge { 
        display: inline-flex; 
        align-items: center; 
        gap: 10px; 
        border: 1px solid rgba(255,255,255,.25); 
        color: #fff; 
        border-radius: 999px; 
        padding: 8px 14px; 
        margin-bottom: 18px; 
    }


    .visibility-review-section {
  background: #ffffff;
}

.section-kicker {
  color: #e2c92f;
  letter-spacing: 0.08em;
  font-size: 0.85rem;
}

.problem-card {
  background: #ffffff;
  border: 1px solid rgba(8, 31, 56, 0.10);
  border-radius: 20px;
  padding: 30px 26px;
  box-shadow: 0 12px 30px rgba(8, 31, 56, 0.06);
  transition: all 0.25s ease;
}

.problem-card:hover {
  transform: translateY(-5px);
  border-color: rgba(226, 201, 47, 0.55);
  box-shadow: 0 18px 40px rgba(8, 31, 56, 0.10);
}

.problem-icon {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: rgba(226, 201, 47, 0.16);
  color: #081f38;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  margin-bottom: 22px;
}

.problem-card h5 {
  color: #081f38;
  font-weight: 700;
  margin-bottom: 12px;
}

.problem-card p {
  color: #5f6b76;
  line-height: 1.6;
}

.btn-dark {
  background-color: #081f38;
  border-color: #081f38;
  font-weight: 700;
}

.btn-dark:hover {
  background-color: #e2c92f;
  border-color: #e2c92f;
  color: #081f38;
}

/*--------------------------------------------------------------
# Background Slider
--------------------------------------------------------------*/
.background_slider {
  background: url("/public/assets/img/background.jpg") fixed center center;
  background-size: cover;
  padding: 60px 0;
}