:root{--finance-navy:#07152f;--finance-navy2:#0d2348;--finance-gold:var(--gold,#f2b300);--finance-ink:var(--ink,#07152f);--finance-muted:var(--muted,#687386);--finance-line:var(--line,#e8edf3);--finance-bg:#f6f8fb;--finance-ease:var(--ease,cubic-bezier(.2,.8,.2,1));--finance-shadow:0 18px 45px rgba(7,21,47,.09)}
body.locked{overflow:hidden}
.finance-hero{position:relative;overflow:hidden;height:75vh;min-height:520px;max-height:720px;padding:clamp(35px,5vh,70px) 0;color:#fff;display:flex;align-items:center;background:#07152f}.finance-hero-bg{position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,21,47,.92) 0%,rgba(7,21,47,.72) 48%,rgba(7,21,47,.3) 100%),url("assets/background3.webp") center/cover no-repeat}.finance-hero-inner{position:relative;z-index:1}
.finance-hero:before,.finance-hero:after{content:"";position:absolute;border-radius:50%;pointer-events:none}
.finance-hero:before{width:520px;height:520px;right:-180px;top:-250px;background:rgba(242,179,0,.08);border:1px solid rgba(255,255,255,.08)}
.finance-hero:after{width:400px;height:400px;left:-210px;bottom:-270px;background:rgba(255,255,255,.035)}
.finance-hero-inner{position:relative;z-index:1}
.finance-hero-copy{max-width:850px}
.finance-eyebrow,.section-kicker{display:inline-flex;align-items:center;gap:8px;font-size:10px;font-weight:800;letter-spacing:.16em;color:var(--finance-gold)}
.finance-eyebrow i{font-size:14px}
.finance-hero h1{max-width:760px;margin:12px 0;font-size:clamp(2.4rem,4.4vw,4.2rem);line-height:1.04;letter-spacing:-.055em}
.finance-hero h1 strong,.section-heading h2 strong,.finance-value h2 strong{color:var(--finance-gold)}
.finance-hero-copy>p{max-width:680px;margin:0 0 14px;color:#d6dfec;font-size:13px;line-height:1.65}
.finance-actions{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px}
.finance-hero .btn,.calculator-card .btn,.finance-cta .btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:0 22px;border-radius:12px;font-size:12px;font-weight:800;cursor:pointer;transition:.25s var(--finance-ease)}
.btn.primary{border:1px solid var(--finance-gold);background:var(--finance-gold);color:var(--finance-ink);box-shadow:0 12px 30px rgba(242,179,0,.2)}
.btn.primary:hover{transform:translateY(-3px)}
.btn.glass{border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.08);color:#fff}
.btn.glass:hover{background:rgba(255,255,255,.15);transform:translateY(-3px)}
.btn.outline{border:1px solid var(--finance-line);background:#fff;color:var(--finance-ink)}
.finance-trust{display:flex;flex-wrap:wrap;gap:7px}
.finance-trust div{display:inline-flex;align-items:center;gap:7px;padding:7px 11px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:rgba(255,255,255,.06);font-size:10px;font-weight:700;color:#eef3fb}
.finance-trust i{color:var(--finance-gold)}
.finance-value{padding:35px 0;background:#fff;border-bottom:1px solid var(--finance-line)}
.finance-value-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.8fr);gap:50px;align-items:center}
.finance-value h2,.section-heading h2{margin:10px 0 0;font-size:clamp(2rem,3.7vw,3.25rem);line-height:1.13;letter-spacing:-.045em;color:var(--finance-ink)}
.finance-value-copy p,.section-heading>p{margin:0;color:var(--finance-muted);font-size:14px;line-height:1.8}
.finance-benefits,.finance-calculators,.finance-requirements{padding:35px 0}
.finance-solutions{background:var(--finance-bg)}
.section-heading{max-width:800px}
.section-heading>p{margin-top:10px}
.finance-solution-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:28px}
.finance-solution-card,.requirement-grid>div{position:relative;overflow:hidden;padding:23px 20px;border:1px solid var(--finance-line);border-radius:18px;background:#fff;box-shadow:0 7px 20px rgba(7,21,47,.04);transition:.28s var(--finance-ease)}
.finance-solution-card:before,.requirement-grid>div:before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--finance-gold);transform:scaleX(0);transform-origin:left;transition:.3s}
.finance-solution-card:hover:before,.requirement-grid>div:hover:before{transform:scaleX(1)}
.finance-solution-card:hover,.requirement-grid>div:hover{transform:translateY(-7px);border-color:rgba(242,179,0,.4);box-shadow:var(--finance-shadow)}
.finance-solution-card>i,.requirement-grid i{width:48px;height:48px;display:grid;place-items:center;margin-bottom:17px;border-radius:14px;background:#fff7df;color:#bd8500;font-size:18px}
.finance-solution-card h3,.requirement-grid h3{margin:0 0 8px;color:var(--finance-ink);font-size:14px}
.finance-solution-card p,.requirement-grid p{margin:0;color:var(--finance-muted);font-size:11px;line-height:1.7}
.finance-solution-card strong{display:inline-block;margin-top:14px;color:#a87400;font-size:11px;font-weight:800}
.finance-calculators{background:#fff}
.calculator-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:28px}
.calculator-card{padding:24px;border:1px solid var(--finance-line);border-radius:20px;background:#fff;box-shadow:var(--finance-shadow);transition:.3s}
.calculator-card:hover{transform:translateY(-5px)}
.calculator-head{display:flex;align-items:center;gap:14px;padding-bottom:16px;margin-bottom:18px;border-bottom:1px solid var(--finance-line)}
.calculator-head>i{width:48px;height:48px;display:grid;place-items:center;border-radius:14px;background:var(--finance-navy);color:var(--finance-gold);font-size:18px}
.calculator-head span{display:block;margin-bottom:4px;color:#a87400;font-size:9px;font-weight:800;letter-spacing:.12em}
.calculator-head h3{margin:0;color:var(--finance-ink);font-size:17px}
.calc-fields{display:grid;grid-template-columns:repeat(2,1fr);gap:13px}
.calc-fields label,.hp-field label,.range-row label{display:flex;flex-direction:column;gap:7px;color:#465266;font-size:11px;font-weight:700}
.calc-fields input,.hp-field input{width:100%;min-height:44px;padding:9px 12px;border:1px solid var(--finance-line);border-radius:10px;background:#fff;color:var(--finance-ink);font:inherit;font-size:13px}
.calc-fields input:focus,.hp-field input:focus{outline:none;border-color:var(--finance-gold);box-shadow:0 0 0 3px rgba(242,179,0,.12)}
.hp-field{margin-bottom:17px}
.range-row{display:grid;gap:17px}
.range-row label>strong{color:var(--finance-ink);font-size:12px}
.range-row input[type=range]{width:100%;height:6px;margin:3px 0 0;accent-color:var(--finance-gold);cursor:pointer}
.range-row small{display:flex;justify-content:space-between;color:var(--finance-muted);font-size:9px}
.calc-result{margin:18px 0 13px;padding:17px;border-radius:15px;background:linear-gradient(135deg,var(--finance-navy),var(--finance-navy2));color:#fff}
.calc-result span{display:block;margin-bottom:6px;color:#bfcce0;font-size:10px;font-weight:700}
.calc-result strong{display:block;color:var(--finance-gold);font-size:25px;line-height:1.1}
.calc-result small{display:block;margin-top:6px;color:#bfcce0;font-size:9px}
.calc-summary{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--finance-line);border-radius:13px;overflow:hidden}
.calc-summary>div{min-height:68px;padding:11px;border-right:1px solid var(--finance-line);display:flex;flex-direction:column;justify-content:center;color:var(--finance-muted);font-size:9px;font-weight:700}
.calc-summary>div:last-child{border-right:0}
.calc-summary strong{display:block;margin-top:5px;color:var(--finance-ink);font-size:11px}
.calc-summary small{display:block;margin-top:3px;color:var(--finance-muted);font-size:8px}
.calculator-card:nth-child(2) .calc-summary{grid-template-columns:repeat(2,1fr)}
.calculator-card:nth-child(2) .calc-summary>div:nth-child(2n){border-right:0}
.calculator-card:nth-child(2) .calc-summary>div:nth-child(n+3){border-top:1px solid var(--finance-line)}
.calc-actions{display:flex;gap:10px;margin-top:16px}
.calc-actions .btn:first-child{flex:1}
.finance-requirements{background:var(--finance-bg)}
.requirement-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-top:28px}
.finance-cta{padding:42px 0;background:linear-gradient(135deg,var(--finance-navy),var(--finance-navy2));color:#fff}
.finance-cta-inner{display:flex;align-items:center;justify-content:space-between;gap:25px}
.finance-cta h2{margin:8px 0 0;font-size:clamp(1.8rem,3vw,2.6rem);letter-spacing:-.04em}
.finance-modal{position:fixed;inset:0;z-index:5000;display:none;align-items:center;justify-content:center;padding:18px}
.finance-modal.show{display:flex}
.finance-modal-bg{position:absolute;inset:0;background:rgba(4,13,29,.72);backdrop-filter:blur(7px)}
.finance-modal-box{position:relative;width:min(880px,100%);max-height:92vh;overflow:auto;border-radius:22px;background:#fff;box-shadow:0 35px 100px rgba(0,0,0,.35);animation:financeIn .25s var(--finance-ease)}
@keyframes financeIn{from{opacity:0;transform:translateY(18px) scale(.985)}to{opacity:1;transform:none}}
.finance-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:25px 30px;border-bottom:1px solid var(--finance-line);background:linear-gradient(135deg,#fff,#fffaf0)}
.finance-modal-head span{font-size:9px;font-weight:800;letter-spacing:.15em;color:#a87400}
.finance-modal-head h2{margin:6px 0 5px;font-size:24px;line-height:1.15;color:var(--finance-ink)}
.finance-modal-head p{margin:0;color:var(--finance-muted);font-size:12px}
.finance-modal-head button{width:40px;height:40px;flex:0 0 40px;border:1px solid var(--finance-line);border-radius:12px;background:#fff;color:var(--finance-ink);font-size:17px;cursor:pointer}
.finance-modal-head button:hover{transform:rotate(90deg);border-color:#f0c75d;background:#fff7df}
#financeForm{padding:5px 30px 25px}
.finance-section{padding:15px 0;border-bottom:1px solid var(--finance-line)}
.finance-section-title{display:flex;align-items:center;gap:12px;margin-bottom:17px}
.finance-section-title>i{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:#fff7df;color:#b27d00;font-size:16px}
.finance-section-title span{display:block;color:#a87400;font-size:9px;font-weight:800;letter-spacing:.12em}
.finance-section-title h3{margin:3px 0 0;font-size:14px;color:var(--finance-ink)}
.finance-fields{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.finance-fields label{display:flex;flex-direction:column;gap:7px;color:#465266;font-size:11px;font-weight:700}
.finance-fields label.wide{grid-column:1/-1}
.finance-fields b{color:#c52525}
.finance-fields input,.finance-fields select,.finance-fields textarea{width:100%;min-height:44px;padding:10px 12px;border:1px solid var(--finance-line);border-radius:10px;background:#fff;color:var(--finance-ink);font:inherit;font-size:13px}
.finance-fields textarea{min-height:100px;resize:vertical}
.finance-fields input:focus,.finance-fields select:focus,.finance-fields textarea:focus{outline:none;border-color:var(--finance-gold);box-shadow:0 0 0 3px rgba(242,179,0,.12)}
.finance-notice{display:flex;gap:10px;margin-top:17px;padding:13px 14px;border:1px solid #f3dfaa;border-radius:12px;background:#fffaf0;color:#7a621d;font-size:11px;line-height:1.6}
.finance-notice i,.finance-privacy i{color:#bd8500;margin-top:2px}
.finance-notice p{margin:0}
.finance-privacy{display:flex;gap:10px;margin-top:12px;padding:13px 14px;border-radius:12px;background:#f7f9fb;color:var(--finance-muted);font-size:10px;line-height:1.6}
.finance-privacy strong{color:var(--finance-ink)}
.finance-actions-bottom{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}
.finance-cancel{min-height:46px;padding:0 20px;border:1px solid var(--finance-line);border-radius:12px;background:#fff;color:#536174;font-size:12px;font-weight:800;cursor:pointer}
.finance-actions-bottom .btn{min-height:46px}
.finance-response{margin:14px 0 0;text-align:center;color:var(--finance-muted);font-size:10px}

/* ====== RESPONSIVE: TABLETS & SMALL LAPTOPS ====== */
@media (max-width: 992px) {
  .finance-hero {
    height: auto;
    min-height: 0;
    padding: 40px 0;
  }
  .finance-hero h1 {
    font-size: clamp(2rem, 8vw, 3rem);
  }
  .finance-value-grid {
    grid-template-columns: 1fr;
    gap: 25px;
  }
  .finance-solution-grid,
  .requirement-grid {
    grid-template-columns: repeat(3, 1fr);
  }
  .calculator-grid {
    grid-template-columns: 1fr; /* Stack calculators on tablet */
  }
}

/* ====== RESPONSIVE: TABLETS & LARGE PHONES ====== */
@media (max-width: 768px) {
  /* Hero */
  .finance-hero {
    height: auto;
    min-height: 0;
    padding: 40px 0;
  }
  .finance-hero-inner {
    gap: 24px;
  }
  .finance-hero h1 {
    font-size: clamp(1.9rem, 7vw, 2.8rem);
  }
  .finance-hero-copy > p {
    font-size: 12px;
  }
  .finance-actions {
    flex-direction: column;
    align-items: flex-start;
  }
  .finance-actions .btn {
    width: 100%;
    justify-content: center;
  }
  .finance-trust {
    gap: 6px;
  }
  .finance-trust div {
    font-size: 9px;
    padding: 6px 9px;
  }

  /* Solution cards – two columns */
  .finance-solution-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
  .finance-solution-card {
    padding: 18px 15px;
  }
  .finance-solution-card > i {
    width: 40px;
    height: 40px;
    font-size: 16px;
    margin-bottom: 12px;
  }
  .finance-solution-card h3 {
    font-size: 12px;
  }
  .finance-solution-card p {
    font-size: 9px;
  }
  .finance-solution-card strong {
    font-size: 10px;
  }

  /* Requirements – two columns */
  .requirement-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
  .requirement-grid > div {
    padding: 18px 15px;
  }
  .requirement-grid i {
    width: 40px;
    height: 40px;
    font-size: 16px;
    margin-bottom: 12px;
  }
  .requirement-grid h3 {
    font-size: 12px;
  }
  .requirement-grid p {
    font-size: 9px;
  }

  /* Calculators – stack on small tablets/phones */
  .calculator-grid {
    grid-template-columns: 1fr;
    gap: 15px;
  }
  .calculator-card {
    padding: 18px;
  }
  .calc-fields {
    grid-template-columns: 1fr; /* Single column fields */
  }
  .calc-summary {
    grid-template-columns: 1fr; /* Stack summary items */
  }
  .calculator-card:nth-child(2) .calc-summary {
    grid-template-columns: 1fr;
  }
  .calc-actions {
    flex-direction: column;
  }
  .calc-actions .btn {
    width: 100%;
  }

  /* CTA */
  .finance-cta-inner {
    flex-direction: column;
    text-align: center;
    gap: 20px;
  }
  .finance-cta .btn {
    width: 100%;
    justify-content: center;
  }

  /* Modal */
  .finance-modal-box {
    width: 100%;
    max-height: 100vh;
    border-radius: 0;
  }
  .finance-modal-head {
    padding: 18px 20px;
  }
  #financeForm {
    padding: 5px 20px 25px;
  }
  .finance-section {
    padding: 14px 0;
  }
  .finance-fields {
    grid-template-columns: 1fr; /* Single column form fields */
  }
  .finance-fields label.wide {
    grid-column: auto;
  }
  .finance-actions-bottom {
    flex-direction: column-reverse;
  }
  .finance-cancel,
  .finance-actions-bottom .btn {
    width: 100%;
  }
}

/* ====== RESPONSIVE: SMALL PHONES ====== */
@media (max-width: 480px) {
  .finance-hero h1 {
    font-size: 1.8rem;
  }
  .finance-trust div {
    font-size: 8px;
    padding: 5px 8px;
  }

  /* Keep two columns but even smaller */
  .finance-solution-grid,
  .requirement-grid {
    gap: 8px;
  }
  .finance-solution-card,
  .requirement-grid > div {
    padding: 14px 10px;
    border-radius: 14px;
  }
  .finance-solution-card > i,
  .requirement-grid i {
    width: 34px;
    height: 34px;
    font-size: 14px;
    margin-bottom: 10px;
  }
  .finance-solution-card h3,
  .requirement-grid h3 {
    font-size: 11px;
  }
  .finance-solution-card p,
  .requirement-grid p {
    font-size: 8px;
    line-height: 1.5;
  }
  .finance-solution-card strong {
    font-size: 9px;
  }

  /* Calculator adjustments */
  .calculator-card {
    padding: 14px;
  }
  .calc-result strong {
    font-size: 22px;
  }
  .mpesa-presets {
    grid-template-columns: 1fr 1fr;
  }
}

.finance-success{display:none;align-items:center;gap:14px;margin:17px 0 0;padding:15px 17px;border:1px solid #bfe8d0;border-radius:12px;background:#f1fbf5;color:#174d2d}
.finance-success.show{display:flex;animation:financeSuccessIn .3s ease}
.finance-success-icon{width:42px;height:42px;flex:0 0 42px;display:grid;place-items:center;border-radius:50%;background:#1fa463;color:#fff;font-size:17px}
.finance-success>div:nth-child(2){display:flex;flex-direction:column;gap:4px;flex:1}
.finance-success strong{font-size:12px;color:#145c32}
.finance-success span{font-size:10px;line-height:1.55;color:#4d6b59}
@keyframes financeSuccessIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}