:root{
  --blue:#063d91;
  --blue2:#075fc4;
  --navy:#082544;
  --green:#09a94f;
  --red:#e52222;
  --yellow:#ffd315;
  --light:#eef6ff;
  --muted:#60738a;
  --border:#d7e4f2;
  --shadow:0 18px 50px rgba(11,63,125,.18);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Arial,sans-serif;color:var(--navy);background:#fff;padding-bottom:74px}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}
button,input{font:inherit}
.container{width:min(1220px,calc(100% - 34px));margin:auto}
.topbar{background:linear-gradient(90deg,#06347a,#0757b6);color:#fff;font-size:13px}
.topbar-inner{min-height:38px;display:flex;justify-content:space-between;align-items:center;gap:20px}
.header{position:sticky;top:0;z-index:80;background:#fff;box-shadow:0 1px 0 var(--border)}
.navbar{height:100px;display:flex;align-items:center;gap:34px}
.brand{width:250px;flex:0 0 250px}
.brand img{width:250px;height:92px;object-fit:contain}
.nav-links{margin-left:auto;display:flex;gap:30px;font-size:15px;font-weight:700}
.nav-links a:hover{color:var(--blue2)}
.menu-toggle{display:none;margin-left:auto;border:0;background:transparent;font-size:28px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 24px;border:1px solid transparent;border-radius:10px;font-weight:800;cursor:pointer;transition:.2s}
.btn:hover{transform:translateY(-1px)}
.btn-blue{background:linear-gradient(135deg,var(--blue),var(--blue2));color:#fff;box-shadow:0 10px 25px rgba(7,95,196,.22)}
.btn-white{background:#fff;color:var(--blue);border-color:#adc9e7}
.btn-green{background:linear-gradient(135deg,#09a94f,#10bd5d);color:#fff}
.btn-full{width:100%}
.hero{
  background:linear-gradient(135deg,#f7fbff 0%,#e8f4ff 58%,#d9ecff 100%);
  overflow:hidden;
}
.hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) 420px;
  gap:46px;
  align-items:start;
  min-height:670px;
  padding:52px 0 42px;
}
.hero-content{
  min-width:0;
}
.trust-pill{
  display:inline-flex;
  padding:8px 14px;
  border-radius:999px;
  background:#dcecff;
  color:#063b90;
  font-size:13px;
  font-weight:900;
  letter-spacing:.04em;
}
.hero h1{
  margin:18px 0 14px;
  max-width:760px;
  font-size:clamp(46px,5.3vw,74px);
  line-height:1.02;
  letter-spacing:-.055em;
}
.hero h1 span{color:#0a4fa8}
.hero-points{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
  font-size:17px;
  font-weight:800;
}
.hero-points span{
  padding-right:12px;
  border-right:2px solid #8aa6c1;
}
.hero-points strong{
  display:inline-flex;
  padding:8px 12px;
  border-radius:6px;
  background:#ffd318;
  color:#dc1f1f;
  box-shadow:0 5px 14px rgba(141,93,0,.12);
}
.approval-banner{
  display:inline-flex;
  align-items:center;
  gap:12px;
  margin-top:20px;
  padding:12px 18px;
  border-radius:12px;
  background:linear-gradient(135deg,#ffd91f,#ffb800);
  border-bottom:8px solid #063f95;
  box-shadow:0 14px 28px rgba(63,76,93,.16);
}
.approval-clock{
  width:66px;
  height:66px;
  display:grid;
  place-items:center;
  border:5px solid #073f94;
  border-radius:50%;
  background:#fff;
  color:#df1d1d;
  font-size:34px;
  font-weight:900;
}
.approval-banner small,
.approval-banner strong,
.approval-banner em{
  display:block;
}
.approval-banner small{
  color:#d91919;
  font-size:13px;
  font-weight:900;
}
.approval-banner strong{
  padding:3px 7px;
  background:#073f94;
  color:#fff;
  font-size:19px;
  font-style:normal;
}
.approval-banner em{
  margin-top:4px;
  color:#533e00;
  font-size:11px;
  font-style:normal;
  font-weight:700;
}
.hero-car-visual{
  width:100%;
  max-width:800px;
  margin:22px 0 0;
  overflow:hidden;
  border-radius:18px;
  box-shadow:0 18px 38px rgba(10,62,116,.18);
}
.hero-car-visual img{
  width:100%;
  height:auto;
  aspect-ratio:1983/793;
  object-fit:cover;
}
.benefit-row{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
  max-width:760px;
  margin-top:24px;
}
.benefit-row>div{
  padding:14px 10px;
  border:1px solid rgba(183,208,234,.7);
  border-radius:12px;
  background:rgba(255,255,255,.66);
  text-align:center;
}
.mini-icon{
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  margin:0 auto 8px;
  border-radius:11px;
  background:#fff;
  color:#064ba5;
  box-shadow:0 8px 18px rgba(28,87,146,.12);
  font-size:20px;
  font-weight:900;
}
.benefit-row b,
.benefit-row small{display:block}
.benefit-row b{font-size:14px}
.benefit-row small{
  margin-top:3px;
  color:#60738a;
  font-size:11px;
}
.approval-benefit{
  border-color:#ffd318!important;
  background:#fffceb!important;
}
.approval-benefit b,
.approval-benefit small{color:#d91d1d}
.hero-actions{
  display:flex;
  gap:12px;
  margin-top:22px;
}
.lead-card{
  position:sticky;
  top:132px;
  align-self:start;
  background:#fff;
  border:1px solid rgba(144,181,218,.55);
  border-radius:22px;
  overflow:hidden;
  box-shadow:0 20px 55px rgba(11,63,125,.18);
}
.form-title{
  display:flex;
  gap:14px;
  align-items:center;
  padding:24px;
  color:#fff;
  background:linear-gradient(135deg,#062f77,#0757bb);
}
.form-title h2{margin:0;font-size:23px}
.form-title p{margin:4px 0 0;color:rgba(255,255,255,.82)}
.shield{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  border:3px solid #fff;
  border-radius:14px;
  font-weight:900;
}
.lead-card form{padding:22px}
label{display:block;margin-bottom:7px;font-size:13px;font-weight:800}
input{
  width:100%;
  height:48px;
  padding:0 14px;
  margin-bottom:15px;
  border:1px solid #cbd9e9;
  border-radius:8px;
  outline:none;
}
input:focus{
  border-color:#075fc4;
  box-shadow:0 0 0 3px rgba(7,95,196,.12);
}
.response-time{
  margin-top:14px;
  color:#415a75;
  font-size:12px;
  text-align:center;
}
.form-message{
  min-height:19px;
  margin-top:10px;
  font-size:12px;
  font-weight:800;
  text-align:center;
}
.form-message.success{color:#078541}
.form-message.error{color:#d12626}
.stats{position:relative;margin-top:-1px;background:#fff}
.stats-inner{transform:translateY(-28px);display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border:1px solid var(--border);border-radius:18px;box-shadow:var(--shadow);padding:20px 25px}
.stats-inner>div{display:grid;grid-template-columns:48px 1fr;grid-template-rows:auto auto;align-items:center;padding:0 28px;border-right:1px solid var(--border)}
.stats-inner>div:last-child{border-right:0}
.stats-inner span{grid-row:1/3;font-size:30px;color:var(--blue)}
.stats-inner strong{font-size:26px;color:var(--blue)}
.stats-inner small{color:var(--muted)}
.section{padding:78px 0}
.section-heading{text-align:center;max-width:760px;margin:0 auto 38px}
.section-heading.left{text-align:left;margin-left:0}
.section-heading>span{color:var(--blue2);font-size:12px;font-weight:900;letter-spacing:.16em}
.section-heading h2{margin:10px 0;font-size:clamp(32px,4vw,48px);letter-spacing:-.035em}
.section-heading em{color:var(--blue2);font-style:normal}
.section-heading p{color:var(--muted);line-height:1.65}
.feature-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}
.feature-card{padding:24px 18px;border:1px solid var(--border);border-radius:14px;background:#fff;text-align:center;box-shadow:0 8px 24px rgba(27,74,119,.08)}
.feature-icon{width:52px;height:52px;display:grid;place-items:center;margin:auto;border-radius:50%;background:#e9f3ff;color:var(--blue);font-size:24px;font-weight:900}
.feature-card h3{font-size:16px;line-height:1.25}
.feature-card p{color:var(--muted);font-size:13px;line-height:1.55}
.approval-card{border:2px solid var(--yellow);background:#fffdf0}
.approval-card h3{color:var(--red)}
.disclaimer{margin:26px auto 0;max-width:960px;text-align:center;color:#6b7c90;font-size:12px;line-height:1.6}
.section-blue{background:linear-gradient(135deg,#062d6b,#0759b7);color:#fff}
.section-heading.light span,.section-heading.light p{color:#d7eaff}
.loan-grid{display:grid;gap:20px}
.loan-grid.two{grid-template-columns:repeat(2,1fr)}
.loan-grid.four{grid-template-columns:repeat(4,1fr)}
.loan-card{position:relative;padding:28px;border-radius:16px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22)}
.loan-card h3{font-size:24px;margin:14px 0 8px}
.loan-card p{line-height:1.6;color:rgba(255,255,255,.82)}
.loan-symbol{font-size:34px}
.main-loan{border:2px solid var(--yellow)}
.ribbon{position:absolute;right:18px;top:18px;background:var(--yellow);color:#a31616;padding:6px 10px;border-radius:999px;font-size:11px;font-weight:900}
.white-card{background:#fff;color:var(--navy);border:1px solid var(--border);box-shadow:0 10px 28px rgba(23,68,111,.09)}
.white-card p{color:var(--muted)}
.white-card a{color:var(--blue2);font-weight:800}
.emi-section{background:#f1f7fd}
.emi-grid{display:grid;grid-template-columns:1fr .8fr;gap:50px;align-items:center}
.calculator{padding:28px;border-radius:16px;background:#fff;box-shadow:var(--shadow)}
.emi-result{padding:34px;border-radius:20px;background:linear-gradient(145deg,#062f71,#0764cc);color:#fff;box-shadow:var(--shadow)}
.emi-result>small{opacity:.8}.emi-result>strong{display:block;font-size:50px;margin:12px 0 26px}
.emi-result>div{display:flex;justify-content:space-between;padding:14px 0;border-top:1px solid rgba(255,255,255,.2)}
.emi-result p{font-size:12px;opacity:.72;line-height:1.55}
footer{background:#052b5b;color:#fff}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:42px;padding:55px 0}
.footer-logo{width:250px;height:90px;object-fit:contain}
footer a,footer span,footer p{display:block;margin:8px 0;color:rgba(255,255,255,.8)}
.copyright{text-align:center;border-top:1px solid rgba(255,255,255,.14);padding:17px;color:rgba(255,255,255,.65)}
.bottom-cta{position:fixed;left:0;right:0;bottom:0;z-index:100;height:74px;display:grid;grid-template-columns:1fr 1fr 1fr .8fr;align-items:center;background:linear-gradient(90deg,#063a87,#075dbd);color:#fff;box-shadow:0 -8px 24px rgba(0,0,0,.16)}
.bottom-cta>*{height:100%;display:flex;align-items:center;justify-content:center;text-align:center;border-right:1px solid rgba(255,255,255,.23);font-weight:700}
.bottom-cta small{margin-left:8px;font-weight:500;opacity:.85}
.bottom-cta .apply-bottom{margin:10px 20px;height:52px;border:0;border-radius:10px;background:#ec2020}
@media(max-width:1080px){
  .topbar-inner span:nth-child(2),.topbar-inner span:nth-child(3){display:none}
  .nav-links{display:none;position:absolute;top:100px;left:0;right:0;flex-direction:column;padding:20px;background:#fff;border-bottom:1px solid var(--border)}
  .nav-links.open{display:flex}
  .menu-toggle{display:block}
  .nav-apply{display:none}
  .hero-grid{grid-template-columns:1fr}
  .hero-content{min-height:680px}
  .lead-card{margin-bottom:48px}
  .highlight-badge{right:10px}
  .feature-grid{grid-template-columns:repeat(3,1fr)}
  .loan-grid.four{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:700px){
  body{padding-bottom:0}
  .topbar-inner span:last-child{display:none}
  .navbar{height:80px}
  .brand,.brand img{width:185px}.brand{flex-basis:185px}.brand img{height:72px}
  .nav-links{top:80px}
  .hero-grid{padding-top:12px}
  .hero-content{min-height:auto;padding-bottom:0}
  .hero h1{font-size:43px}
  .highlight-badge{position:relative;top:auto;right:auto;display:inline-flex;margin-top:16px}
  .benefit-row{grid-template-columns:repeat(2,1fr)}
  .hero-actions{flex-direction:column}
  .stats-inner{grid-template-columns:1fr 1fr;gap:20px;transform:none;margin:20px auto}
  .stats-inner>div{padding:0;border:0}
  .feature-grid,.loan-grid.two,.loan-grid.four,.emi-grid,.footer-grid{grid-template-columns:1fr}
  .bottom-cta{
    position:static;
    height:auto;
    grid-template-columns:1fr 1fr;
  }
  .bottom-cta>*{
    min-width:0;
    min-height:86px;
    padding:12px 8px;
    flex-direction:column;
    gap:4px;
    border-bottom:1px solid rgba(255,255,255,.23);
    font-size:15px;
    line-height:1.2;
  }
  .bottom-cta small{
    display:block;
    margin:0;
    font-size:13px;
    overflow-wrap:anywhere;
  }
  .bottom-cta>div b{font-size:17px}
  .bottom-cta .apply-bottom{
    width:calc(100% - 16px);
    height:auto;
    min-height:64px;
    margin:8px;
    padding:10px;
  }
}

@media(max-width:1080px){
  .hero-grid{grid-template-columns:1fr;gap:28px}
  .hero-content{min-height:auto}
  .approval-banner{display:none!important}
  .hero-car-visual{max-width:none}
  .lead-card{position:static;max-width:720px;width:100%;margin:0 auto}
}
@media(max-width:700px){
  .hero-grid{padding:34px 0 24px}
  .hero h1{font-size:43px}
  .hero-points{font-size:14px}
  .hero-points span{border:0;padding:0}
  .approval-banner{width:100%}
  .hero-car-visual{
    width:100%;
    margin:22px 0 0;
    border-radius:14px;
  }
  .benefit-row{grid-template-columns:1fr 1fr}
  .hero-actions{flex-direction:column}
}

/* Reference-matched desktop hero */
@media(min-width:1081px){
  .container{width:min(1400px,calc(100% - 80px))}
  .topbar-inner{min-height:44px}
  .navbar{height:98px;gap:28px}
  .brand{width:270px;flex-basis:270px}
  .brand img{width:270px;height:90px}
  .nav-links{gap:27px;font-size:14px}
  .nav-links a:first-child{
    position:relative;
    color:#063dba;
  }
  .nav-links a:first-child:after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:-24px;
    height:2px;
    background:#063dba;
  }
  .hero{
    position:relative;
    min-height:575px;
    overflow:visible;
    background:#eaf5ff url("/assets/hero-cars-background.png") center bottom / cover no-repeat;
  }
  .hero-grid{
    grid-template-columns:minmax(0,1fr) 420px;
    gap:34px;
    min-height:575px;
    padding:28px 0 44px;
  }
  .hero-content{max-width:850px}
  .trust-pill{
    padding:8px 13px;
    border-radius:7px;
    background:#ffdc1a;
    box-shadow:0 6px 16px rgba(124,91,0,.16);
    color:#06378f;
    font-size:16px;
  }
  .hero h1{
    margin:12px 0 15px;
    font-size:clamp(50px,4.2vw,67px);
    line-height:1.03;
  }
  .hero-points{gap:12px;font-size:15px}
  .hero-points span:first-child:before{
    content:"✓";
    display:inline-grid;
    place-items:center;
    width:16px;
    height:16px;
    margin-right:7px;
    border-radius:50%;
    background:#0752b6;
    color:#fff;
    font-size:11px;
  }
  .hero-points strong{
    padding:7px 13px;
    border:2px solid #efb900;
    font-size:15px;
    color:#c51414;
    box-shadow:0 7px 18px rgba(145,102,0,.2);
  }
  .approval-banner,.hero-car-visual,.hero-actions{display:none}
  .hero-content{position:relative}
  .approval-banner{
    position:absolute;
    top:48px;
    right:-10px;
    z-index:4;
    display:block;
    width:300px;
    min-height:0;
    margin:0;
    padding:0;
    overflow:hidden;
    border:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
    transform:none;
    clip-path:none;
  }
  #approvalBadgeCanvas{display:block;width:100%;height:auto}
  .approval-clock{
    position:absolute;
    left:-15px;
    top:21px;
    width:92px;
    height:92px;
    border:7px solid #092c68;
    background:#fff;
    color:transparent;
    box-shadow:0 3px 0 #fff,0 8px 16px rgba(0,31,81,.25);
  }
  .approval-clock:before,
  .approval-clock:after{
    content:"";
    position:absolute;
    left:50%;
    top:50%;
    width:4px;
    border-radius:3px;
    background:#092c68;
    transform-origin:50% 100%;
  }
  .approval-clock:before{
    height:27px;
    transform:translate(-50%,-100%) rotate(4deg);
  }
  .approval-clock:after{
    height:21px;
    transform:translate(-50%,-100%) rotate(52deg);
  }
  .approval-banner small{
    display:block;
    color:#d71919;
    font-size:24px;
    line-height:1;
    font-weight:900;
    white-space:nowrap;
  }
  .approval-banner small span{font-size:48px}
  .approval-banner strong{
    display:block;
    margin-top:2px;
    padding:3px 8px;
    background:#063991;
    font-size:20px;
    line-height:1;
    white-space:nowrap;
  }
  .approval-banner em{
    margin:4px 0 0 48px;
    color:#111;
    font-size:17px;
    font-weight:900;
    white-space:nowrap;
  }
  .benefit-row{
    width:600px;
    max-width:100%;
    gap:0;
    margin-top:20px;
  }
  .benefit-row>div{
    min-height:92px;
    padding:7px 12px;
    border:0;
    border-right:1px solid rgba(8,57,112,.18);
    border-radius:0;
    background:rgba(255,255,255,.28);
  }
  .benefit-row>div:last-child{border-right:0}
  .benefit-row>div:nth-child(1){
    position:relative;
    z-index:1;
    border:1px solid #8eb9ec;
    border-radius:12px;
    background:rgba(255,255,255,.9);
    box-shadow:0 8px 20px rgba(7,65,139,.16);
  }
  .benefit-row>div:nth-child(1) b{
    color:#0646a5;
    font-size:15px;
    font-weight:900;
  }
  .benefit-row>div:nth-child(1) small{
    color:#173b68;
    font-weight:700;
  }
  .benefit-row>div:nth-child(2){
    position:relative;
    z-index:2;
    border:2px solid #efb900!important;
    border-radius:12px;
    background:#fff9d9!important;
    box-shadow:0 8px 20px rgba(145,102,0,.2);
  }
  .benefit-row>div:nth-child(2) b{
    color:#d31616;
    font-size:15px;
    font-weight:900;
  }
  .benefit-row>div:nth-child(2) small{
    color:#9e1919;
    font-weight:800;
  }
  .benefit-row>div:nth-child(3),
  .benefit-row>div:nth-child(4){
    position:relative;
    z-index:1;
    border:1px solid #8eb9ec;
    border-radius:12px;
    background:rgba(255,255,255,.9);
    box-shadow:0 8px 20px rgba(7,65,139,.16);
  }
  .benefit-row>div:nth-child(3) b,
  .benefit-row>div:nth-child(4) b{
    color:#0646a5;
    font-size:15px;
    font-weight:900;
  }
  .benefit-row>div:nth-child(3) small,
  .benefit-row>div:nth-child(4) small{
    color:#173b68;
    font-weight:700;
  }
  .mini-icon{
    width:42px;
    height:42px;
    margin-bottom:5px;
    border:0;
    border-radius:10px;
    font-size:20px;
  }
  .benefit-row b{font-size:13px}
  .benefit-row small{font-size:10px;color:#102844}
  .approval-benefit{border-color:rgba(8,57,112,.18)!important;background:rgba(255,255,255,.28)!important}
  .lead-card{
    position:relative;
    top:-14px;
    border-radius:20px;
    box-shadow:0 16px 35px rgba(3,37,91,.28);
  }
  .form-title{padding:16px 22px}
  .form-title h2{font-size:21px}
  .form-title p{font-size:13px}
  .shield{width:44px;height:44px}
  .lead-card form{padding:16px 22px 15px}
  label{margin-bottom:5px;font-size:11px}
  input{height:42px;margin-bottom:12px}
  .lead-card .btn{min-height:46px}
  .response-time{margin-top:11px}
  .stats{height:58px;background:#f5f9fd}
  .stats-inner{
    transform:translateY(-28px);
    padding:13px 24px;
    border-radius:16px;
  }
  .stats-inner>div{padding:0 28px}
  .stats-inner strong{font-size:24px}
  .stats-inner small{font-size:12px}
  #why-cbfc{padding:12px 0 44px;background:#f5f9fd}
  #why-cbfc .section-heading{margin-bottom:16px}
  #why-cbfc .section-heading>span,
  #why-cbfc .section-heading p{display:none}
  #why-cbfc .section-heading h2{margin:0;font-size:25px}
  .feature-card{min-height:165px;padding:13px 12px}
  .feature-icon{width:43px;height:43px;font-size:20px}
  .feature-card h3{margin:10px 0 7px;font-size:13px}
  .feature-card p{margin:0;font-size:11px;line-height:1.45}
  .disclaimer{display:none}
}