:root{
  --navy:#0a2f5f;
  --navy-dk:#07264d;
  --blue:#0e4fa7;
  --blue-lg:#eef3ff;
  --ink:#0f1b2d;
  --white:#ffffff;
  --nav-h: 72px;
}

/* Base */
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:'Montserrat', sans-serif;
  background:#ffffff;
  color:var(--ink);
  scroll-behavior:smooth;
  font-size: 15.5px;
}

/* =========================
   NAVBAR (full white background)
   ========================= */
.nav-gradient{
  background: #ffffff;   /* solid white */
  border-bottom: 1px solid #eaeaea;
}
.navbar .nav-link{ 
  color: var(--navy) !important; 
  font-weight:600;
}
.navbar .nav-link:hover{ 
  color: var(--blue) !important; 
}
.btn-loan{ 
  background:#1f57a8; 
  border:none; 
  color:#fff; 
  font-weight:700; 
  box-shadow:0 6px 16px rgba(15,40,100,.15);
}
.btn-loan:hover{ background:#194885; }

/* =========================
   HOME / HERO
   ========================= */
.section-hero.hero-white{
  min-height: calc(100vh - var(--nav-h));
  padding-top: calc(var(--nav-h) + 40px);
  padding-bottom: 140px;

  background:#fff;
  display:flex;
  align-items:center;
}

.finbridge-title{
  font-size:clamp(4.2rem, 7.2vw, 6.8rem);
  font-weight:800;
  color:var(--navy);
  line-height:1;
}

/* Image in hero */
.hero-img{
  border-radius:18px;
  box-shadow:0 18px 40px rgba(10,31,68,.12);
  max-width: 100%;
  height: auto;
}

/* Divider */
.divider-flat{
  height:72px;
  background:var(--blue-lg);
}

/* =========================
   FEATURES / ABOUT / CONTACT
   ========================= */
.bg-soft{ background:var(--blue-lg); }
.text-navy{ color:var(--navy); }
.card.feature{ 
  border-radius:16px; 
  transition:transform .18s ease, box-shadow .18s ease;
}
.card.feature:hover{ 
  transform:translateY(-4px); 
  box-shadow:0 22px 48px rgba(14,47,110,.16); 
}
.icon-box{
  width:56px; height:56px; display:grid; place-items:center;
  border-radius:14px; background:#eaf2ff; color:#1e62b6; font-size:1.4rem;
}

/* Inputs */
.form-soft{ background:#f5f8ff; border:1px solid #e2e8ff; }
.form-soft:focus{ border-color:#1e62b6; box-shadow:0 0 0 .2rem rgba(30,98,182,.15); }

/* =========================
   FOOTER (full white background)
   ========================= */
.footer-grad{
  background:#ffffff;
  color: var(--navy);
  border-top: 1px solid #eaeaea;
}

/* =========================
   LOGIN / SIGNUP MODAL
   ========================= */
.login2p { background:#fff; }

.login2p-left{
  background:
    radial-gradient(900px 500px at 10% 10%, rgba(74,110,255,.22), transparent 60%),
    linear-gradient(135deg, #0e4fa7 0%, #1d63d6 50%, #2f77ff 100%);
  min-height: 520px;
}
.login2p-logo{
  width: 160px; height: auto;
  filter: drop-shadow(0 10px 24px rgba(0,0,0,.18));
}

.login2p-tabs .nav-link{
  border-radius: 999px;
  padding: .45rem 1.25rem;
  font-weight: 700;
  color: #0e4fa7;
  border: 1px solid rgba(14,79,167,.15);
  background: #f6f8ff;
}
.login2p-tabs .nav-link.active{
  color: #fff;
  background: linear-gradient(135deg, #1d63d6, #2f77ff);
  border-color: transparent;
  box-shadow: 0 10px 24px rgba(47,119,255,.25);
}

.login2p-input .input-group-text{
  background:#f3f6ff;
  color:#1e50b5;
  border: 1px solid #e2e8ff;
}
.login2p-input .form-control{
  border: 1px solid #e2e8ff;
  background:#fff;
}
.login2p-input .form-control:focus{
  border-color:#2f77ff;
  box-shadow: 0 0 0 .2rem rgba(47,119,255,.15);
}

.btn-login2p{
  font-weight: 800;
  letter-spacing: .5px;
  color:#fff;
  background: linear-gradient(135deg, #1d63d6, #2f77ff);
  border: none;
  box-shadow: 0 14px 30px rgba(47,119,255,.30);
}
.btn-login2p:hover{
  filter: brightness(0.95);
  color:#fff;
}

/* =========================
   RESPONSIVE
   ========================= */
@media (max-width: 991.98px){
  :root{ --nav-h: 64px; }
  .finbridge-title{ text-align:center; margin-bottom:18px; }
  .login2p-left{
    min-height: 220px;
    padding: 28px 16px;
  }
  .login2p-logo{ width: 120px; }
}