:root{--grad-warm:linear-gradient(155deg,#26426A 0%,#3C4460 32%,#5C4A4E 58%,#79493F 80%,#8B4A34 100%);--grad-cool:linear-gradient(150deg,#2C5A93 0%,#1E3E6B 55%,#132A4B 100%);
  
    --ink:#3B3A37; --ink-soft:#4C4A46; --cream:#F3F0EC; --cream-dim:#EAE5DD;
    --accent:#1D3E6B; --accent-dark:#142B4C; --accent-soft:#CBD9EC; --slate:#5B5954; --line:#E6E0D6;
    --success:#3E7A5B; --success-bg:#E7F0EE; --accent-bg:#E7EDF6;
    --fannie:#4C5AA8; --fannie-bg:#EAEDF7; --nav:#16294D;
  }

*{box-sizing:border-box;margin:0;padding:0}

html{scroll-behavior:smooth}

body{font-family:"Inter",system-ui,sans-serif;color:var(--ink);background:var(--cream);line-height:1.6;-webkit-font-smoothing:antialiased}

.serif{font-family:"Playfair Display",Georgia,serif}

.wrap{max-width:1120px;margin:0 auto;padding:0 32px}

a{color:inherit;text-decoration:none}

.eyebrow{font-size:12px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--accent-dark)}

.btn{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:15px;padding:13px 22px;border-radius:10px;border:1.5px solid transparent;cursor:pointer;transition:.15s}

.btn-accent{background:var(--grad-warm);color:#fff}

.btn-accent:hover{filter:brightness(1.07)}

.btn-outline{background:transparent;border-color:var(--line);color:var(--ink)}

.btn-outline:hover{border-color:var(--accent);color:var(--accent-dark)}

nav{background:var(--grad-cool);color:#fff;position:sticky;top:0;z-index:50}

.nav-in{display:flex;align-items:center;justify-content:space-between;gap:32px;height:104px}

.brand{display:flex;align-items:center;gap:11px}

.nav-logo{height:58px;width:58px;color:#fff;flex:none}

.brand b{font-family:"Cinzel","Playfair Display",serif;font-size:19px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}

.nav-links{display:flex;align-items:center;gap:28px;padding-right:28px}

.nav-links a.link{font-size:14.5px;color:#D9D3CA;font-weight:500;text-align:center}

.nav-links a.link:hover{color:#fff}

.nav-links a.link.active{color:#fff}

.nav-cta{display:flex;gap:10px;margin-left:auto}

.nav-cta .btn{padding:9px 16px;font-size:13.5px;justify-content:center;text-align:center}

.nav-cta .btn-outline{border-color:#6E7C97;color:#EDE7DE}

.nav-cta .btn-outline:hover{border-color:var(--accent);color:#fff}

.hero .eyebrow{margin-bottom:20px}

.hero h1{font-size:56px;line-height:1.08;font-weight:800;letter-spacing:-1px;max-width:14ch;margin:0 auto}

.hero p{font-size:19px;color:var(--slate);max-width:60ch;margin:22px auto 0}

.hero-cta{display:flex;gap:14px;justify-content:center;margin-top:34px;flex-wrap:wrap}

.hero-cta .btn{padding:15px 26px;font-size:16px}

.hero .tiny{margin-top:18px;font-size:14px;color:var(--slate)}

.hero .tiny a{color:var(--accent-dark);font-weight:600}

section{padding:78px 0}

.sec-head{text-align:center;max-width:60ch;margin:0 auto 46px}

.sec-head h2{font-size:38px;font-weight:700;letter-spacing:-.5px;margin-top:12px}

.sec-head p{font-size:17px;color:var(--slate);margin-top:14px}

.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}

.card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:28px;box-shadow:0 12px 32px rgba(28,31,38,.05)}

.card .ic{width:46px;height:46px;border-radius:11px;background:var(--accent-bg);display:flex;align-items:center;justify-content:center;font-size:22px;margin-bottom:16px}

.card h3{font-size:18.5px;font-weight:700;margin-bottom:8px}

.card p{font-size:14.5px;color:var(--slate)}

.portals{background:var(--grad-warm);color:#fff}

.portals .sec-head h2{color:#fff}

.portals .sec-head p{color:#C6BEB2}

.lender-band{display:grid;grid-template-columns:auto 1fr;gap:28px;align-items:center;background:var(--grad-warm);color:#fff;border-radius:20px;padding:40px 44px;box-shadow:0 18px 44px rgba(28,31,38,.18)}

.lender-band .lb-ic{width:68px;height:68px;border-radius:16px;background:var(--accent);display:flex;align-items:center;justify-content:center;font-size:32px;flex:none}

.lender-band .lb-eye{font-size:12px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:var(--accent-soft)}

.lender-band h3{font-family:"Playfair Display",Georgia,serif;font-size:27px;font-weight:700;color:#fff;margin:8px 0 11px;line-height:1.2}

.lender-band p{color:#D9D3CA;font-size:15.5px;line-height:1.65;max-width:74ch}

.lender-band p b{color:#fff}

.grid2{display:grid;grid-template-columns:1fr 1fr;gap:24px}

.pcard .tag{font-size:11.5px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--accent)}

.pcard ul{list-style:none;display:flex;flex-direction:column;gap:12px;margin-bottom:26px}

.pcard li::before{content:"✓";color:var(--accent);font-weight:800;flex:none}

.pcard .btn{margin-top:auto;justify-content:center}

.docs .grid2{gap:20px}

.dcard{background:#fff;border:1px solid var(--line);border-radius:14px;padding:24px 26px;display:flex;gap:18px;align-items:flex-start}

.dcard .ic{width:44px;height:44px;border-radius:11px;background:var(--fannie-bg);display:flex;align-items:center;justify-content:center;font-size:21px;flex:none}

.dcard h3{font-size:17px;font-weight:700;margin-bottom:5px}

.dcard p{font-size:13.8px;color:var(--slate);margin-bottom:12px}

.samplebtn{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:600;color:var(--accent-dark);border:1.5px solid var(--line);border-radius:8px;padding:7px 13px;background:var(--cream)}

.samplebtn:hover{border-color:var(--accent);background:var(--accent-bg)}

.docs-note{text-align:center;font-size:14px;color:var(--slate);margin-top:28px;max-width:66ch;margin-left:auto;margin-right:auto}

.about{background:var(--cream-dim)}

.about-in{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:center}

.about h2{font-size:34px;font-weight:700;letter-spacing:-.5px;margin:12px 0 16px}

.about p{font-size:16px;color:var(--slate);margin-bottom:14px}

.metric{background:#fff;border:1px solid var(--line);border-radius:14px;padding:26px 18px;text-align:center}

.metric .n{font-family:"Playfair Display",serif;font-size:38px;font-weight:800;color:var(--accent-dark);line-height:1}

.metric .l{font-size:12.5px;color:var(--slate);margin-top:10px;font-weight:500}

.cta{background:var(--accent);color:#fff;text-align:center}

.cta h2{font-size:34px;font-weight:700;letter-spacing:-.5px}

.cta p{font-size:17px;color:#E7EDF6;margin:14px auto 28px;max-width:58ch}

.cta .btn-accent{background:#fff;color:var(--accent-dark)}

.cta .btn-accent:hover{background:var(--cream)}

.cta .btn-outline{border-color:rgba(255,255,255,.6);color:#fff}

.cta .btn-outline:hover{background:rgba(255,255,255,.12);border-color:#fff;color:#fff}

.cta .hero-cta{margin-top:0}

footer{background:var(--grad-cool);color:#C6BEB2;padding:56px 0 30px}

.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px;padding-bottom:34px;border-bottom:1px solid #2F4E7C}

.foot-grid h4{color:#fff;font-size:13px;letter-spacing:1px;text-transform:uppercase;margin-bottom:14px}

.foot-grid .brand{display:flex;align-items:center;margin-bottom:14px}

.foot-logo{color:#fff;flex:none}

.foot-grid p,.foot-grid a{font-size:14px;color:#C6BEB2;display:block;margin-bottom:8px}

.foot-grid a:hover{color:#fff}

.disc{font-size:12.5px;color:#948C81;margin-top:22px;line-height:1.6;max-width:80ch}

.copyright{font-size:12.5px;color:#948C81;margin-top:16px}

.badge{display:inline-block;font-size:11px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--accent);background:rgba(29,62,107,.14);padding:4px 10px;border-radius:6px;margin-bottom:14px}

@media(max-width:860px){
    .grid3,.grid2,.about-in,.foot-grid,.metrics{grid-template-columns:1fr}
    .hero h1{font-size:40px}
    .nav-links .link{display:none}
    .sec-head h2{font-size:30px}
  }

.nav-cta .btn-accent{background:#fff;color:var(--nav);border-color:#fff}

.nav-cta .btn-accent:hover{background:var(--cream-dim)}

.nav-cta .btn-outline{border-color:rgba(255,255,255,.42);color:#fff}

.nav-cta .btn-outline:hover{border-color:#fff;color:#fff;background:rgba(255,255,255,.08)}

.lender-band .lb-ic{background:#fff}

.portals .btn-accent{background:var(--grad-cool);color:#fff;border-color:transparent}

.portals .btn-accent:hover{filter:brightness(1.1)}
