/* LoanFitCalc visual enhancement layer (loaded after inline styles) */
:root{
  --lf-navy:#0f2338; --lf-blue:#1f4e79; --lf-teal:#1f8a8f; --lf-gold:#e0a23f;
  --lf-line:#e6ecf3; --lf-shadow:0 10px 30px rgba(15,35,56,.09); --lf-shadow-lg:0 18px 48px rgba(15,35,56,.16);
}
html{scroll-behavior:smooth}
body{background:
  radial-gradient(1100px 480px at 92% -8%,rgba(31,138,143,.09),transparent 60%),
  radial-gradient(900px 480px at -8% 0%,rgba(31,78,121,.08),transparent 55%),
  #f5f8fc !important;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto}
html,body{overflow-x:hidden;max-width:100%}
table{max-width:100%;display:block;overflow-x:auto}

/* header */
header.site{position:sticky;top:0;z-index:60;
  background:linear-gradient(180deg,rgba(15,35,56,.97),rgba(15,35,56,.92)) !important;
  backdrop-filter:saturate(160%) blur(8px);box-shadow:0 2px 18px rgba(15,35,56,.22)}
header.site .logo{letter-spacing:-.3px}
header.site nav a{position:relative;transition:color .15s}
header.site nav a::after{content:"";position:absolute;left:0;bottom:-6px;height:2px;width:0;background:var(--lf-gold);transition:width .2s}
header.site nav a:hover::after{width:100%}

/* hero (homepage) */
.lf-hero{position:relative;overflow:hidden;border-radius:18px;margin:20px auto;max-width:1040px;
  color:#fff;box-shadow:var(--lf-shadow-lg);display:flex;align-items:center;min-height:270px;
  background-image:linear-gradient(100deg,rgba(11,26,46,.94) 0%,rgba(11,26,46,.8) 36%,rgba(31,78,121,.35) 66%,rgba(31,138,143,.12) 100%),url('/img/hero-v1.jpg');
  background-size:cover;background-position:right center}
.lf-hero .inner{padding:40px 42px;max-width:610px}
.lf-hero h1{color:#fff !important;font-size:clamp(28px,4.6vw,42px);line-height:1.12;margin:0 0 12px;letter-spacing:-.5px}
.lf-hero p{color:#e8f0f7 !important;font-size:clamp(15px,2.2vw,19px);margin:0 0 22px;max-width:52ch}
.lf-hero .btns{display:inline-flex;gap:12px;flex-wrap:wrap}
.lf-hero a.b1{background:linear-gradient(135deg,var(--lf-teal),#26a7ad);color:#fff;padding:13px 24px;border-radius:12px;font-weight:700;box-shadow:0 8px 20px rgba(31,138,143,.35);text-decoration:none}
.lf-hero a.b2{background:#fff;color:var(--lf-navy);padding:13px 22px;border-radius:12px;font-weight:600;text-decoration:none}
.lf-hero a.b1:hover,.lf-hero a.b2:hover{transform:translateY(-2px);transition:transform .12s}

/* cards & tiles */
.card{border-radius:16px !important;box-shadow:var(--lf-shadow);border-color:var(--lf-line) !important}
.tile{border-radius:14px !important;box-shadow:var(--lf-shadow);transition:transform .15s,box-shadow .2s,border-color .2s}
.tile:hover{transform:translateY(-4px);box-shadow:var(--lf-shadow-lg);border-color:var(--lf-teal) !important}
.badge{border-radius:999px !important}

/* buttons / CTAs (cosmetic, non-functional-safe) */
a.cta,.cta a{transition:transform .12s,box-shadow .15s}
a.cta:hover,.cta a:hover{transform:translateY(-2px);box-shadow:var(--lf-shadow)}

/* inputs focus polish */
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--lf-teal) !important;box-shadow:0 0 0 4px rgba(31,138,143,.22) !important}
input,select,textarea{border-radius:10px !important;transition:border-color .15s,box-shadow .15s}

/* footer */
footer.site{background:linear-gradient(180deg,#0f2338,#0b1a2e) !important}

@keyframes lfrise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.lf-hero .inner,.card,.tile{animation:lfrise .5s both}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* mobile */
@media (max-width:640px){
  header.site nav{width:100%;display:flex;flex-wrap:wrap;gap:6px 14px}
  header.site nav a{margin-left:0}
  .lf-hero .inner{padding:30px 22px}
  .lf-hero{min-height:230px}
}
@media print{.lf-hero{display:none!important}}