/* ===========================================================
   New Vision Financial Services — Design System
   Concept: "The Ledger" — a financial house's working paper.
   Built around the brand mark: bright blue + deep indigo,
   with the logo's own grey as a quiet third tone, on a cool
   paper background with rule-lines borrowed from loan
   documents and surveyor's blueprints. Numbered steps are
   used only where content is genuinely sequential (the loan
   process).
   Palette sourced directly from the New Vision Financial
   Services logo: bright blue #2E8BFC, deep indigo #0C16A9,
   logo grey #8DA5B2.
   =========================================================== */

/* Google Fonts are now preconnected + loaded via <link> in each page's
   <head> (see html files) rather than @import, which blocks the CSS
   parser and delays first paint. */

:root{
  --ink: #0D1B4C;
  --ink-70: rgba(13,27,76,.7);
  --ink-45: rgba(13,27,76,.45);
  --paper: #F4F6FA;
  --paper-dim: #E9EDF3;
  --brass: #2E8BFC;
  --brass-deep: #1668D6;
  --forest: #0C16A9;
  --forest-deep: #080F73;
  --line: #DAE1EA;
  --line-strong: #BFCBDA;
  --logo-grey: #8DA5B2;
  --white: #FFFFFF;
  --max: 1180px;
  --serif: "Source Serif 4", Georgia, serif;
  --sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --radius: 3px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;}
h1,h2,h3,h4{
  font-family:var(--serif);
  font-weight:600;
  line-height:1.12;
  margin:0 0 .5em;
  letter-spacing:-.01em;
}
p{margin:0 0 1em;max-width:62ch;}
.max{max-width:var(--max);margin:0 auto;padding:0 28px;}
.small-max{max-width:760px;}

a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{
  outline:2px solid var(--brass);
  outline-offset:3px;
}

/* ---------- Ledger rule utility ---------- */
.rule{border:none;border-top:1px solid var(--line);margin:0;}
.rule-strong{border-top:1px solid var(--line-strong);}

/* ---------- Header / Nav ---------- */
header.site-header{
  position:sticky;top:0;z-index:50;
  background:rgba(244,246,250,.92);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);
}
.nav-row{
  display:flex;align-items:center;justify-content:space-between;
  height:76px;
}
.brand{
  font-family:var(--serif);font-weight:600;font-size:1.28rem;
  color:var(--ink);text-decoration:none;letter-spacing:-.01em;
  display:flex;align-items:center;line-height:1.1;
}
.brand img{height:38px;width:auto;display:block;}
.brand span{font-family:var(--sans);font-weight:500;font-size:.62rem;color:var(--brass-deep);letter-spacing:.06em;margin-top:3px;}
.footer-brand img{height:34px;width:auto;display:block;margin-bottom:14px;}
nav.primary{display:flex;align-items:center;gap:34px;}
nav.primary a{
  text-decoration:none;color:var(--ink-70);font-size:.95rem;font-weight:500;
  position:relative;padding:4px 0;
}
nav.primary a:hover{color:var(--ink);}
nav.primary a.active{color:var(--ink);}
nav.primary a.active::after{
  content:"";position:absolute;left:0;right:0;bottom:-3px;height:2px;background:var(--brass);
}
.nav-cta{
  background:var(--ink);color:var(--paper);
  padding:11px 20px;border-radius:var(--radius);text-decoration:none;
  font-weight:600;font-size:.92rem;white-space:nowrap;
  border:1px solid var(--ink);
}
nav.primary a.nav-cta{color:var(--paper);}
.nav-cta:hover{background:var(--forest);border-color:var(--forest);}
nav.primary a.nav-cta:hover{color:var(--paper);}
.nav-phone{font-weight:600;font-size:.92rem;text-decoration:none;color:var(--ink);white-space:nowrap;}
nav.primary a.nav-phone{color:var(--ink);}
nav.primary a.nav-phone:hover{color:var(--brass-deep);}
.mobile-toggle{display:none;background:none;border:1px solid var(--line-strong);border-radius:var(--radius);padding:8px 10px;cursor:pointer;}
.mobile-toggle span{display:block;width:20px;height:2px;background:var(--ink);margin:4px 0;}

@media (max-width:900px){
  nav.primary{
    position:absolute;top:76px;left:0;right:0;background:var(--paper);
    flex-direction:column;align-items:flex-start;gap:0;
    border-bottom:1px solid var(--line);
    max-height:0;overflow:hidden;transition:max-height .25s ease;
  }
  nav.primary.open{max-height:520px;}
  nav.primary a{width:100%;padding:16px 28px;border-bottom:1px solid var(--line);}
  nav.primary .nav-cta{margin:16px 28px;}
  .mobile-toggle{display:block;}
  .nav-phone{display:none;}
}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:14px 26px;border-radius:var(--radius);
  font-weight:600;font-size:.97rem;text-decoration:none;
  border:1px solid transparent;cursor:pointer;
}
.btn-primary{background:var(--brass-deep);color:var(--white);border-color:var(--brass-deep);}
.btn-primary:hover{background:var(--brass);border-color:var(--brass);}
.btn-dark{background:var(--ink);color:var(--paper);border-color:var(--ink);}
.btn-dark:hover{background:var(--forest);border-color:var(--forest);}
.btn-outline{background:transparent;color:var(--ink);border-color:var(--ink-45);}
.btn-outline:hover{border-color:var(--ink);}
.btn-outline-light{background:transparent;color:var(--paper);border-color:rgba(244,246,250,.4);}
.btn-outline-light:hover{border-color:var(--paper);}

/* ---------- Hero ---------- */
.hero{padding:76px 0 64px;}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:end;}
.eyebrow-line{display:flex;align-items:center;gap:12px;margin-bottom:22px;color:var(--brass-deep);font-weight:600;font-size:.85rem;}
.eyebrow-line::before{content:"";width:26px;height:1px;background:var(--brass);}
.hero h1{font-size:clamp(2.3rem,4.4vw,3.6rem);max-width:14ch;}
.hero .lede{font-size:1.15rem;color:var(--ink-70);max-width:46ch;margin-bottom:30px;}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:30px;}
.hero-stats{display:grid;grid-template-columns:repeat(3,auto);gap:28px;border-top:1px solid var(--line-strong);padding-top:20px;max-width:520px;}
.hero-stats .num{font-family:var(--serif);font-size:1.7rem;color:var(--ink);}
.hero-stats .lbl{font-size:.8rem;color:var(--ink-70);max-width:16ch;}
.hero-panel{
  background:var(--ink);color:var(--paper);border-radius:var(--radius);
  padding:34px;position:relative;overflow:hidden;
}
.hero-panel::before{
  content:"";position:absolute;inset:10px;border:1px solid rgba(244,246,250,.18);pointer-events:none;
}
.hero-panel h3{color:var(--paper);font-size:1.2rem;margin-bottom:6px;}
.hero-panel p{color:rgba(244,246,250,.72);font-size:.94rem;}
.hero-panel-list{list-style:none;margin:22px 0;padding:0;display:flex;flex-direction:column;gap:14px;}
.hero-panel-list li{display:flex;gap:12px;font-size:.92rem;color:rgba(244,246,250,.88);align-items:flex-start;}
.hero-panel-list li::before{content:"";width:6px;height:6px;background:var(--brass);margin-top:7px;flex-shrink:0;border-radius:1px;}

@media (max-width:860px){
  .hero-grid{grid-template-columns:1fr;}
  .hero-stats{grid-template-columns:1fr 1fr;}
}

/* ---------- Section scaffolding ---------- */
section{padding:78px 0;}
section.tight{padding:56px 0;}
.section-head{max-width:640px;margin-bottom:44px;}
.section-head .eyebrow-line{margin-bottom:16px;}
.section-head h2{font-size:clamp(1.7rem,3vw,2.3rem);}
.section-head p{color:var(--ink-70);font-size:1.05rem;}
.on-dark{background:var(--ink);color:var(--paper);}
.on-dark h2,.on-dark h3,.on-dark h4{color:var(--paper);}
.on-dark p{color:rgba(244,246,250,.72);}
.on-dark .rule{border-top-color:rgba(244,246,250,.18);}
.on-forest{background:var(--forest);color:var(--paper);}
.on-forest h2,.on-forest h3{color:var(--paper);}
.on-forest p{color:rgba(244,246,250,.78);}

/* ---------- Service ledger rows ---------- */
.ledger{border-top:1px solid var(--line-strong);}
.ledger-row{
  display:grid;grid-template-columns:64px 1.4fr 1.7fr auto;gap:28px;
  padding:30px 0;border-bottom:1px solid var(--line);align-items:start;
}
.ledger-row .idx{font-family:var(--serif);color:var(--brass);font-size:1.4rem;}
.ledger-row h3{font-size:1.2rem;margin-bottom:6px;}
.ledger-row p{color:var(--ink-70);font-size:.95rem;margin:0;}
.ledger-row a.tag{
  align-self:center;justify-self:end;text-decoration:none;color:var(--ink);
  font-size:.85rem;font-weight:600;white-space:nowrap;border:1px solid var(--line-strong);
  padding:9px 16px;border-radius:var(--radius);
}
.ledger-row a.tag:hover{border-color:var(--ink);}
@media (max-width:760px){
  .ledger-row{grid-template-columns:36px 1fr;}
  .ledger-row .idx{grid-column:1;}
  .ledger-row h3{grid-column:2;}
  .ledger-row p{grid-column:2;}
  .ledger-row a.tag{grid-column:2;justify-self:start;margin-top:8px;}
}

/* ---------- Cards ---------- */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:26px;}
@media (max-width:860px){.grid-3,.grid-2{grid-template-columns:1fr;}}
.card{background:var(--white);border:1px solid var(--line);padding:30px;border-radius:var(--radius);}
.card h3{font-size:1.1rem;}
.card p{font-size:.94rem;color:var(--ink-70);margin-bottom:0;}
.card .mark{width:34px;height:34px;border:1px solid var(--brass);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--brass-deep);font-family:var(--serif);font-weight:600;margin-bottom:18px;}

/* ---------- Process steps (genuinely sequential) ---------- */
.steps{counter-reset:step;border-top:1px solid rgba(244,246,250,.18);}
.step{
  display:grid;grid-template-columns:80px 1fr;gap:24px;
  padding:28px 0;border-bottom:1px solid rgba(244,246,250,.18);
}
.step .num-icon{display:flex;flex-direction:column;align-items:flex-start;gap:10px;}
.step .num-icon svg{width:28px;height:28px;color:var(--brass);flex-shrink:0;}
.step .num-icon svg circle,.step .num-icon svg path,.step .num-icon svg rect,.step .num-icon svg polyline,.step .num-icon svg line{vector-effect:non-scaling-stroke;}
.step .num{font-family:var(--serif);font-size:1.5rem;color:rgba(244,246,250,.4);}
.step h4{margin-bottom:6px;font-size:1.08rem;color:var(--paper);}
.step p{color:rgba(244,246,250,.72);font-size:.94rem;margin:0;}

/* ---------- Testimonial / quote strip ---------- */
.quote-strip{border-left:3px solid var(--brass);padding-left:26px;}
.quote-strip p{font-family:var(--serif);font-size:1.25rem;color:var(--ink);line-height:1.5;}
.quote-strip cite{font-style:normal;font-size:.85rem;color:var(--ink-70);}

/* ---------- CTA band ---------- */
.cta-band{
  background:var(--forest);color:var(--paper);border-radius:var(--radius);
  padding:52px 44px;display:flex;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap;
}
.cta-band h2{color:var(--paper);font-size:1.7rem;margin-bottom:8px;max-width:20ch;}
.cta-band p{color:rgba(244,246,250,.78);margin:0;}
.cta-actions{display:flex;gap:14px;flex-wrap:wrap;}

/* ---------- Forms ---------- */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.form-grid .full{grid-column:1/-1;}
@media (max-width:700px){.form-grid{grid-template-columns:1fr;}}
label{display:block;font-size:.85rem;font-weight:600;margin-bottom:7px;color:var(--ink);}
input,select,textarea{
  width:100%;padding:12px 14px;border:1px solid var(--line-strong);border-radius:var(--radius);
  font-family:var(--sans);font-size:.95rem;background:var(--white);color:var(--ink);
}
textarea{resize:vertical;min-height:110px;}
.consent{display:flex;gap:10px;align-items:flex-start;font-size:.82rem;color:var(--ink-70);}
.consent input{width:auto;margin-top:3px;}
.form-note{font-size:.8rem;color:var(--ink-45);margin-top:14px;}

/* ---------- Blog ---------- */
.post-card{border-top:1px solid var(--line-strong);padding:28px 0;display:grid;grid-template-columns:140px 1fr;gap:26px;}
.post-card:last-child{border-bottom:1px solid var(--line-strong);}
.post-date{font-size:.8rem;color:var(--ink-45);padding-top:4px;}
.post-card h3{font-size:1.2rem;margin-bottom:8px;}
.post-card h3 a{text-decoration:none;color:var(--ink);}
.post-card h3 a:hover{color:var(--brass-deep);}
.post-card p{color:var(--ink-70);font-size:.94rem;}
.post-tag{display:inline-block;font-size:.75rem;font-weight:600;color:var(--brass-deep);margin-bottom:8px;}
.on-dark .post-card h3 a{color:var(--paper);}
.on-dark .post-card h3 a:hover{color:var(--brass);}
.on-dark .post-tag{color:var(--brass);}
.on-dark .eyebrow-line{color:var(--brass);}
@media (max-width:640px){.post-card{grid-template-columns:1fr;}.post-date{padding-top:0;}}

.article-hero{padding:56px 0 20px;}
.article-body{max-width:70ch;}
.article-body h2{font-size:1.5rem;margin-top:1.6em;}
.article-body h3{font-size:1.2rem;margin-top:1.4em;}
.article-body p,.article-body li{font-size:1.03rem;color:var(--ink-70);}
.article-body ul,.article-body ol{padding-left:22px;}
.article-meta{display:flex;gap:18px;flex-wrap:wrap;color:var(--ink-45);font-size:.85rem;margin-bottom:18px;}
.article-disclaimer{
  background:var(--paper-dim);border:1px solid var(--line-strong);padding:20px 24px;
  border-radius:var(--radius);font-size:.88rem;color:var(--ink-70);margin:36px 0;
}
.faq-item{border-top:1px solid var(--line);padding:20px 0;}
.faq-item h4{font-size:1.02rem;margin-bottom:8px;}
.faq-item p{font-size:.94rem;color:var(--ink-70);margin:0;}
.on-dark .faq-item{border-top-color:rgba(244,246,250,.18);}
.on-dark .faq-item p{color:rgba(244,246,250,.72);}

/* ---------- Footer ---------- */
footer.site-footer{background:var(--ink);color:rgba(244,246,250,.85);padding:64px 0 0;}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px;padding-bottom:48px;}
.footer-grid h4{color:var(--paper);font-size:.85rem;letter-spacing:.03em;margin-bottom:16px;font-family:var(--sans);font-weight:600;}
.footer-grid ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;}
.footer-grid a{text-decoration:none;color:rgba(244,246,250,.68);font-size:.9rem;}
.footer-grid a:hover{color:var(--paper);}
.footer-brand{font-family:var(--serif);font-size:1.3rem;color:var(--paper);margin-bottom:14px;}
.footer-grid .about-copy{font-size:.9rem;color:rgba(244,246,250,.6);max-width:34ch;}
.footer-legal{
  border-top:1px solid rgba(244,246,250,.15);padding:28px 0;
  font-size:.78rem;color:rgba(244,246,250,.55);line-height:1.7;
}
.footer-legal p{max-width:none;color:rgba(244,246,250,.55);}
.footer-bottom{
  border-top:1px solid rgba(244,246,250,.15);padding:20px 0 26px;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;
  font-size:.8rem;color:rgba(244,246,250,.5);
}
.footer-bottom a{color:rgba(244,246,250,.6);text-decoration:none;}
.footer-bottom a:hover{color:var(--paper);}
@media (max-width:860px){.footer-grid{grid-template-columns:1fr 1fr;}}

/* ---------- Legal pages ---------- */
.legal-page .article-body h2{font-size:1.35rem;}
.legal-page .article-body{max-width:76ch;}
.legal-toc{border:1px solid var(--line-strong);border-radius:var(--radius);padding:22px 26px;margin-bottom:40px;}
.legal-toc h4{margin-bottom:10px;font-size:.9rem;}
.legal-toc ol{margin:0;padding-left:20px;font-size:.9rem;}
.legal-toc li{margin-bottom:6px;}
.legal-toc a{text-decoration:none;color:var(--ink-70);}
.legal-toc a:hover{color:var(--brass-deep);}
.review-flag{
  background:#FBF2E3;border:1px solid var(--brass);color:var(--brass-deep);
  padding:16px 20px;border-radius:var(--radius);font-size:.85rem;margin-bottom:30px;
}

/* ---------- Breadcrumb ---------- */
.crumb{font-size:.82rem;color:var(--ink-45);margin-bottom:18px;}
.crumb a{text-decoration:none;color:var(--ink-45);}
.crumb a:hover{color:var(--ink);}

/* ---------- Content bullet lists (checkmark icons) ---------- */
/* Scoped to <main> so the footer nav lists and hero-panel-list
   (which already has its own dot-bullet treatment) are unaffected. */
main ul li{
  list-style:none;position:relative;padding-left:28px;margin-bottom:9px;
}
main ul li::before{
  content:"";position:absolute;left:0;top:0.35em;width:16px;height:16px;
  background-repeat:no-repeat;background-position:center;background-size:16px 16px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232E8BFC' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5l5 5L20 6'/%3E%3C/svg%3E");
}

/* ---------- Blog tag filter ---------- */
.filter-btn{cursor:pointer;font-size:.85rem;}
.filter-btn.active{background:var(--ink);color:var(--paper);border-color:var(--ink);}