/* ============================================================
   LoanGuy Fintech — shared design system
   Palette: deep forest green (near-black) + brass/gold accent,
   warm cream ground
   Type: Source Serif 4 (display) + Inter (body/UI)
   ============================================================ */

:root{
  --navy-900:#1F4D3E;
  --navy-800:#28604D;
  --green-ticker:#1B4438;
  --blue-600:#2C6B54;
  --blue-500:#3D8468;
  --blue-100:#E7F0EA;
  --blue-50:#F6F8F5;
  --brass-500:#B58D44;
  --brass-100:#F3ECDC;
  --ink:#16241F;
  --ink-2:#444B4D;
  --ink-3:#8892A3;
  --line:rgba(16,22,35,0.10);
  --line-2:rgba(16,22,35,0.18);
  --white:#FFFFFF;
  --off:#FBFAF8;
  --radius:10px;
  --shadow:0 10px 30px rgba(16,47,40,0.10);
  color-scheme: only light;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%;}
#eligibility-form,#faqs,#consult{scroll-margin-top:88px;}
body{
  font-family:'Inter',sans-serif;
  color:var(--ink);
  background:var(--white);
  font-size:15px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{font-family:'Source Serif 4',serif;font-weight:600;color:var(--ink);letter-spacing:-0.01em;}
a{color:inherit;}
img{max-width:100%;display:block;}
.container{max-width:1120px;margin:0 auto;padding:0 24px;}
.hero-highlight-badge{
  display:inline-flex;align-items:center;gap:9px;
  background:linear-gradient(135deg,var(--brass-500),#1F4A3B);
  color:#fff;
  font-family:'Inter',sans-serif;font-size:13px;font-weight:700;
  letter-spacing:0.01em;
  padding:10px 18px;border-radius:99px;
  text-decoration:none;
  margin-bottom:18px;
  box-shadow:0 4px 18px rgba(201,153,64,0.35);
  transition:transform 0.15s, box-shadow 0.15s;
}
.hero-highlight-badge:hover{transform:translateY(-1px);box-shadow:0 6px 22px rgba(201,153,64,0.45);}
.hero-highlight-badge .bolt{font-size:15px;}

.eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-family:'Inter',sans-serif;font-size:11.5px;font-weight:600;
  letter-spacing:0.12em;text-transform:uppercase;color:var(--blue-600);
}
.eyebrow::before{content:'';width:16px;height:1.5px;background:var(--brass-500);display:inline-block;}

/* ===== NAV ===== */
header.site-nav{
  position:sticky;top:0;z-index:100;background:rgba(255,255,255,0.92);
  backdrop-filter:blur(8px);border-bottom:1px solid var(--line);
}

/* ============================================================
   Loan-category tabs — a slim, horizontally-scrollable row that
   pins directly under the header once you scroll past it, so the
   loan types stay reachable without opening the mobile menu. On
   index.html + the 4 loan product pages only.
   ============================================================ */
.loan-tabs-bar{
  position:sticky;top:69px;z-index:98;background:#fff;
  border-bottom:1px solid var(--line);
}
.loan-tabs-scroll{
  display:flex;gap:8px;overflow-x:auto;-webkit-overflow-scrolling:touch;
  max-width:1120px;margin:0 auto;padding:10px 24px;scrollbar-width:none;
}
.loan-tabs-scroll::-webkit-scrollbar{display:none;}
.loan-tab{
  flex-shrink:0;padding:8px 16px;border-radius:999px;font-size:12.5px;font-weight:600;
  color:var(--ink-2);background:var(--off);text-decoration:none;border:1px solid var(--line-2);
  transition:background .15s,color .15s;white-space:nowrap;
}
.loan-tab:hover{background:var(--blue-50);color:var(--navy-900);}
.loan-tab.active{background:var(--navy-900);color:#fff;border-color:var(--navy-900);}
.nav-inner{display:flex;align-items:center;justify-content:space-between;padding:11px 24px;max-width:1120px;margin:0 auto;position:relative;}
.brand{font-family:'Source Serif 4',serif;font-size:28px;font-weight:700;color:var(--navy-900);text-decoration:none;line-height:1.1;}
.brand small{display:block;font-family:'Inter',sans-serif;font-size:11px;letter-spacing:0.16em;color:var(--ink-3);font-weight:600;text-transform:uppercase;margin-top:3px;}
.brand em{color:var(--blue-600);font-style:normal;}
nav.links{display:flex;gap:26px;list-style:none;align-items:center;}
nav.links a{font-size:15px;font-weight:500;color:var(--ink-2);text-decoration:none;transition:color .15s;}
nav.links a:hover{color:var(--navy-900);}
nav.links a.nav-cta{color:#fff;}
nav.links a.nav-cta:hover{color:#fff;}
.nav-cta{background:var(--navy-900);color:#fff;padding:12px 24px;border-radius:8px;font-size:14px;font-weight:600;text-decoration:none;display:inline-block;transition:background .2s;}
.nav-cta:hover{background:var(--blue-600);}
.nav-toggle{display:none;background:none;border:none;font-size:22px;cursor:pointer;color:var(--navy-900);width:44px;height:44px;}

.nav-drop{position:relative;}
.nav-drop>a::after{content:'\25BE';font-size:10px;margin-left:5px;color:var(--ink-3);}
.nav-drop-panel{
  position:absolute;top:100%;left:0;margin-top:14px;background:#fff;border:1px solid var(--line);
  border-radius:10px;box-shadow:var(--shadow);min-width:220px;padding:8px;
  opacity:0;visibility:hidden;transform:translateY(4px);transition:opacity .15s,transform .15s,visibility .15s;
  z-index:50;
}
.nav-drop:hover .nav-drop-panel,.nav-drop.open .nav-drop-panel{opacity:1;visibility:visible;transform:translateY(0);}
.nav-drop-panel a{display:block;padding:9px 12px;border-radius:6px;font-size:13.5px;color:var(--ink-2);}
.nav-drop-panel a:hover{background:var(--blue-50);color:var(--navy-900);}

@media (max-width:860px){
  nav.links{position:absolute;top:100%;left:0;right:0;background:#fff;flex-direction:column;align-items:flex-start;
    padding:16px 24px;gap:14px;border-bottom:1px solid var(--line);display:none;box-shadow:var(--shadow);max-height:80vh;overflow-y:auto;}
  nav.links.open{display:flex;}
  .nav-toggle{display:block;}
  .nav-drop{width:100%;}
  .nav-drop-panel{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:none;
    display:none;margin-top:6px;padding:0 0 0 12px;width:100%;}
  .nav-drop.open .nav-drop-panel{display:block;}
}

/* ===== HERO ===== */
.hero{padding:64px 24px 56px;background:linear-gradient(180deg,var(--blue-50) 0%, var(--white) 78%);border-bottom:1px solid var(--line);}
.hero-grid{max-width:1120px;margin:0 auto;display:grid;grid-template-columns:1.15fr 0.85fr;gap:48px;align-items:center;}
.hero h1{
  font-size:42px;line-height:1.15;margin:14px 0 18px;
  animation:hero-h1-in .8s ease-out both;
}
.hero h1 em{
  font-style:italic;
  background:linear-gradient(90deg,var(--blue-600) 0%,var(--brass-500) 45%,var(--blue-600) 90%);
  background-size:220% auto;background-position:200% 0;
  -webkit-background-clip:text;background-clip:text;color:transparent;
  animation:hero-em-shine 1.8s ease-out .5s both;
}
@keyframes hero-h1-in{
  from{opacity:0;transform:translateY(14px);}
  to{opacity:1;transform:translateY(0);}
}
@keyframes hero-em-shine{
  from{background-position:200% 0;}
  to{background-position:0% 0;}
}
@media (prefers-reduced-motion: reduce){
  .hero h1{animation:none;}
  .hero h1 em{animation:none;background-position:0% 0;}
}
.hero p.lead{color:var(--ink-2);font-size:16px;max-width:52ch;margin-bottom:26px;}
.hero-btns{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:28px;}
.btn{font-family:inherit;font-weight:600;font-size:13.5px;padding:13px 24px;border-radius:8px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:8px;border:1px solid transparent;transition:all .2s;}
.btn-primary{background:var(--navy-900);color:#fff;}
.btn-primary:hover{background:var(--blue-600);}
.btn-outline{background:transparent;border-color:var(--line-2);color:var(--navy-900);}
.btn-outline:hover{background:var(--blue-100);}
.trust-row{display:flex;flex-wrap:wrap;gap:18px 26px;}
.trust-row span{font-size:12.5px;color:var(--ink-2);display:flex;align-items:center;gap:6px;font-weight:500;}
.trust-row span::before{content:'✓';color:var(--brass-500);font-weight:700;}

.hero-card{background:var(--white);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);padding:26px;}
.hero-card h3{font-size:15px;margin-bottom:14px;}
.hero-stat{display:flex;justify-content:space-between;align-items:baseline;padding:12px 0;border-bottom:1px solid var(--line);}
.hero-stat:last-child{border-bottom:none;}
.hero-stat b{font-family:'Source Serif 4',serif;font-size:24px;color:var(--ink);}
.hero-stat span{font-size:11.5px;color:var(--ink-3);text-transform:uppercase;letter-spacing:0.08em;}

/* ===== SECTIONS ===== */
section{padding:64px 24px;}
section.tight{padding:48px 24px;}
.section-head{max-width:640px;margin:0 auto 40px;text-align:center;}
.section-head h2{font-size:30px;margin:12px 0 10px;}
.section-head p{color:var(--ink-2);font-size:14.5px;}
.section-head.left{text-align:left;margin:0 0 36px;}

.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;max-width:1120px;margin:0 auto;}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;max-width:1120px;margin:0 auto;}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:22px;max-width:1120px;margin:0 auto;}
@media (max-width:860px){.grid-3,.grid-2{grid-template-columns:1fr;}.hero-grid{grid-template-columns:1fr;}}
@media (max-width:860px) and (min-width:561px){.grid-4{grid-template-columns:1fr 1fr;}}
@media (max-width:560px){.grid-4{grid-template-columns:1fr;}}

.card{background:var(--off);border:1px solid var(--line);border-radius:var(--radius);padding:28px;}
.card p a{display:inline-block;padding:6px 0;}

/* ============================================================
   Calculator preview tabs — EMI Calculator (inline, functional)
   sits side by side with a plain link to the full Eligibility
   Calculator, embedded near the top of each loan product page.
   ============================================================ */
.calc-preview-wrap{padding:12px 24px 44px;}
.calc-tab-bar{display:flex;gap:8px;max-width:820px;margin:0 auto;}
.calc-tab{
  flex:1;text-align:center;padding:13px 16px;font-size:13.5px;font-weight:700;
  border:1.5px solid var(--line-2);border-bottom:none;border-radius:12px 12px 0 0;
  background:var(--off);color:var(--ink-2);text-decoration:none;cursor:pointer;
  font-family:inherit;transition:background .15s,color .15s;
}
.calc-tab.active{background:#fff;color:var(--navy-900);position:relative;z-index:1;cursor:default;}
.calc-tab:not(.active):hover{background:var(--blue-50);color:var(--navy-900);}
.calc-preview-card{
  max-width:820px;margin:-1.5px auto 0;
  background:#fff;border:1.5px solid var(--line-2);border-radius:0 12px 12px 12px;
  padding:26px 24px;
}
.calc-preview-card .form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.calc-preview-more{
  display:block;text-align:center;margin-top:16px;font-size:12.5px;font-weight:600;
  color:var(--blue-600);text-decoration:none;
}
.calc-preview-more:hover{text-decoration:underline;}
@media (max-width:640px){
  .calc-tab{font-size:12.5px;padding:12px 10px;}
  .calc-preview-card .form-row{grid-template-columns:1fr;}
}
.card .icon{width:42px;height:42px;border-radius:10px;background:var(--blue-100);color:var(--blue-600);display:flex;align-items:center;justify-content:center;font-size:19px;margin-bottom:16px;}
.card h3{font-size:16px;margin-bottom:8px;}
.card p{font-size:13.5px;color:var(--ink-2);}

.step-row{display:flex;gap:16px;max-width:1120px;margin:0 auto;}
.step{flex:1;position:relative;padding:24px 20px 20px;border:1px solid var(--line);border-radius:var(--radius);background:#fff;}
.step .num{font-family:'Source Serif 4',serif;font-size:26px;color:var(--brass-500);margin-bottom:10px;}
.step h4{font-size:14.5px;margin-bottom:6px;}
.step p{font-size:13px;color:var(--ink-2);}
@media (max-width:860px){.step-row{flex-direction:column;}}

.process-grid-6{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:1120px;margin:0 auto;}
.process-grid-6 .step{padding:26px 22px 22px;}
.process-grid-6 .step p{line-height:1.55;}
@media (max-width:860px){.process-grid-6{grid-template-columns:1fr 1fr;}}
@media (max-width:600px){.process-grid-6{grid-template-columns:1fr;}}

.stat-band{background:var(--navy-900);color:#fff;padding:44px 24px;}
.stat-grid{max-width:1120px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;text-align:center;}
.stat-grid b{font-family:'Source Serif 4',serif;font-size:32px;display:block;}
.stat-grid span{font-size:12px;color:#C7DAD0;text-transform:uppercase;letter-spacing:0.07em;}
@media (max-width:860px){.stat-grid{grid-template-columns:repeat(2,1fr);}}

.faq-item{border-bottom:1px solid var(--line);padding:18px 0;max-width:820px;margin:0 auto;}
.faq-q{display:flex;justify-content:space-between;align-items:center;cursor:pointer;font-weight:600;font-size:14.5px;color:var(--ink);}
.faq-q::after{content:'+';font-size:20px;color:var(--brass-500);}
.faq-item.open .faq-q::after{content:'−';}
.faq-a{max-height:0;overflow:hidden;font-size:13.5px;color:var(--ink-2);transition:max-height .25s ease;}
.faq-item.open .faq-a{max-height:400px;padding-top:10px;}

.review-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px;}
.review-card .stars{color:var(--brass-500);font-size:14px;margin-bottom:8px;}
.review-card p{font-size:13.5px;color:var(--ink-2);margin-bottom:12px;}
.review-card b{font-size:13px;}
.review-card small{color:var(--ink-3);}

/* ===== CALC ===== */
.calc-wrap{max-width:760px;margin:0 auto;background:var(--off);border:1px solid var(--line);border-radius:14px;padding:32px;}
.field{margin-bottom:20px;}
.field label{display:flex;justify-content:space-between;font-size:13px;font-weight:600;color:var(--ink);margin-bottom:8px;}
.field label span{color:var(--blue-600);font-weight:700;}
.field input[type=range]{width:100%;accent-color:var(--blue-600);}
.range-combo{display:flex;align-items:center;gap:12px;}
.range-combo input[type=range]{flex:1;}
.range-combo input[type=number]{width:78px;flex:0 0 78px;text-align:center;padding:8px 6px;}
.field input[type=number],.field input[type=text],.field input[type=email],.field select{
  width:100%;padding:12px 13px;border:1px solid var(--line-2);border-radius:8px;font-family:inherit;font-size:13.5px;background:#fff;min-height:44px;
}
.calc-results{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:22px;}
.calc-results.cols-4{grid-template-columns:repeat(4,1fr);}
.calc-results .rc{background:#fff;border:1px solid var(--line);border-radius:10px;padding:16px;text-align:center;}
.calc-results .rc b{font-family:'Source Serif 4',serif;font-size:20px;color:var(--ink);display:block;}
.calc-results .rc span{font-size:11px;color:var(--ink-3);text-transform:uppercase;letter-spacing:0.06em;}
@media (max-width:640px){.calc-results{grid-template-columns:1fr;}.calc-results.cols-4{grid-template-columns:1fr 1fr;}}
.calc-charges-link{
  display:flex;align-items:center;justify-content:center;gap:6px;
  margin-top:14px;padding:11px 16px;background:var(--blue-100);border-radius:8px;
  font-size:12.5px;font-weight:600;color:var(--navy-900);text-decoration:none;text-align:center;
  border:none;width:100%;cursor:pointer;font-family:inherit;
}
.calc-charges-link:hover{background:var(--brass-100);}
.charges-toggle-arrow{display:inline-block;transition:transform .2s ease;}
.calc-charges-link.open .charges-toggle-arrow{transform:rotate(180deg);}

.charges-widget{margin-top:12px;padding:16px 18px;background:var(--off);border:1px solid var(--line);border-radius:10px;}
.charges-widget-placeholder{font-size:12.5px;color:var(--ink-3);text-align:center;padding:6px 0;}
.cw-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:7px 0;border-bottom:1px solid var(--line);font-size:13px;color:var(--ink);}
.cw-row:last-child{border-bottom:none;}
.cw-row span small{display:block;color:var(--ink-3);font-size:11px;font-weight:400;margin-top:1px;}
.cw-row b{font-weight:700;white-space:nowrap;}
.cw-row.cw-total{padding-top:10px;margin-top:4px;border-top:1.5px solid var(--line-2);border-bottom:none;font-weight:700;}
.cw-row.cw-total b{color:var(--blue-600);font-size:14.5px;}
.calc-disclaimer{font-size:11.5px;color:var(--ink-3);margin-top:14px;line-height:1.6;}

/* ===== FORMS ===== */
.form-card{max-width:820px;margin:0 auto;background:var(--off);border:1px solid var(--line);border-radius:14px;padding:24px;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px;}
.form-row.single{grid-template-columns:1fr;}
.form-row label,.form-card label{display:block;font-size:12.5px;font-weight:600;color:var(--ink);margin-bottom:6px;}
@media (max-width:640px){.form-row{grid-template-columns:1fr;}}

/* ===== TABLE ===== */
table.charges{width:100%;border-collapse:collapse;margin:20px 0;font-size:13.5px;}
table.charges th{background:var(--navy-900);color:#fff;text-align:left;padding:12px 14px;font-weight:600;}
table.charges td{padding:12px 14px;border-bottom:1px solid var(--line);color:var(--ink-2);}
table.charges tr:nth-child(even){background:var(--off);}

.article-body{max-width:720px;margin:0 auto;font-size:15px;color:var(--ink-2);}
.article-body h2{font-size:22px;color:var(--ink);margin:34px 0 12px;}
.article-body h3{font-size:17px;color:var(--ink);margin:24px 0 8px;}
.article-body p{margin-bottom:14px;}
.article-body ul{margin:0 0 14px 20px;}
.article-body li{margin-bottom:6px;}

.blog-card{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:#fff;}
.blog-card .blog-cat{font-size:11px;text-transform:uppercase;letter-spacing:0.07em;color:var(--blue-600);font-weight:700;padding:20px 20px 0;}
.blog-card h3{font-size:16px;padding:8px 20px 0;}
.blog-card p{font-size:13px;color:var(--ink-2);padding:8px 20px 20px;}
.blog-card a.read{padding:0 20px 20px;display:block;font-size:12.5px;font-weight:600;color:var(--navy-900);text-decoration:none;}

.crumb{font-size:12.5px;color:var(--ink-3);margin-bottom:18px;}
.crumb a{color:var(--blue-600);text-decoration:none;}

.cta-band{background:var(--blue-100);border-radius:16px;padding:40px;text-align:center;max-width:1120px;margin:0 auto;}
.cta-band h2{font-size:24px;margin-bottom:10px;}
.cta-band p{color:var(--ink-2);font-size:14px;margin-bottom:22px;}

footer.site-footer{background:var(--navy-900);color:#C7DAD0;padding:56px 24px 24px;}
.footer-grid{max-width:1120px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:32px;}
.footer-grid h4{color:#fff;font-family:'Inter',sans-serif;font-size:12.5px;text-transform:uppercase;letter-spacing:0.08em;margin-bottom:14px;}
.footer-grid a{display:block;font-size:13px;color:#C7DAD0;text-decoration:none;margin-bottom:9px;}
.footer-grid a:hover{color:#fff;}
.footer-bottom{max-width:1120px;margin:36px auto 0;padding-top:20px;border-top:1px solid rgba(255,255,255,0.12);font-size:12px;color:#7C8AA5;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;}
@media (max-width:860px){.footer-grid{grid-template-columns:1fr 1fr;}}

.whatsapp-fab{position:fixed;bottom:22px;right:22px;background:#25D366;color:#fff;width:56px;height:56px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-size:26px;text-decoration:none;box-shadow:0 8px 22px rgba(0,0,0,0.22);z-index:90;}

@media (max-width:600px){.hero h1{font-size:31px;}.stat-grid{grid-template-columns:1fr 1fr;}.hero-highlight-badge{white-space:normal;text-align:center;font-size:12px;padding:9px 14px;border-radius:14px;line-height:1.4;}}

/* ===== CALCULATOR EXTRAS (selects, badges, locked state, words, tabs) ===== */
.field select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%234B5567'%3E%3Cpath d='M5.5 7.5l4.5 4.5 4.5-4.5' stroke='%234B5567' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:34px;}
.field input:disabled{background:var(--blue-50);color:var(--ink-3);cursor:not-allowed;}
.badge-auto{display:inline-block;font-size:9.5px;font-weight:700;letter-spacing:0.05em;text-transform:uppercase;color:var(--blue-600);background:var(--blue-100);padding:2px 7px;border-radius:5px;margin-left:6px;}
.amt-words{font-size:11.5px;font-style:italic;color:var(--ink-3);margin-top:6px;}
.calc-tabs{display:flex;gap:8px;max-width:760px;margin:0 auto 20px;flex-wrap:wrap;}
.calc-tab{border:1px solid var(--line-2);background:#fff;color:var(--ink-2);font-family:inherit;font-weight:600;font-size:12.5px;padding:9px 16px;border-radius:8px;cursor:pointer;transition:all .15s;}
.calc-tab.active{background:var(--navy-900);color:#fff;border-color:var(--navy-900);}
.unit-toggle{display:inline-flex;border:1px solid var(--line-2);border-radius:7px;overflow:hidden;margin-left:8px;}
.unit-toggle button{border:none;background:transparent;color:var(--ink-2);font-family:inherit;font-size:10.5px;font-weight:700;padding:4px 10px;cursor:pointer;}
.unit-toggle button.active{background:var(--blue-600);color:#fff;}
.compare-table{width:100%;border-collapse:collapse;font-size:13px;margin-top:14px;}
.compare-table th{text-align:left;padding:9px 10px;color:var(--ink-3);font-size:11px;text-transform:uppercase;letter-spacing:0.05em;border-bottom:1.5px solid var(--navy-900);}
.compare-table td{padding:10px 10px;border-bottom:1px solid var(--line);}
.compare-table td:not(:first-child){text-align:right;}
.hidden{display:none !important;}
.calc-note{font-size:11.5px;color:var(--ink-3);margin-top:14px;line-height:1.6;}
.disclaimer-box{background:var(--blue-50);border:1px solid var(--line);border-radius:12px;padding:20px 24px;font-size:13px;color:var(--ink-2);max-width:900px;margin:32px auto 0;line-height:1.7;}
.doc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;max-width:900px;margin:0 auto;}
@media (max-width:640px){.doc-grid{grid-template-columns:1fr;}}
.doc-grid h4{font-size:14px;margin-bottom:8px;color:var(--ink);}
.doc-grid ul{font-size:13px;color:var(--ink-2);margin-left:18px;line-height:1.7;}
table.charges tr.total td{font-weight:700;color:var(--ink);border-top:2px solid var(--ink);border-bottom:none;font-size:15px;}

/* ============================================================
   Consultation modal — used by every "Contact Us" / "Apply Now" /
   "Talk to a Loan Expert" trigger site-wide
   ============================================================ */
body.modal-open{overflow:hidden;}
.consult-modal-overlay{
  position:fixed;inset:0;background:rgba(11,27,54,0.6);
  display:flex;align-items:center;justify-content:center;
  z-index:999;padding:20px;
  opacity:0;visibility:hidden;transition:opacity .22s ease;
}
.consult-modal-overlay.open{opacity:1;visibility:visible;}
.consult-modal{
  background:#fff;border-radius:16px;max-width:480px;width:100%;
  padding:32px 28px 26px;position:relative;
  box-shadow:0 30px 70px rgba(11,27,54,0.35);
  transform:translateY(14px);transition:transform .22s ease,max-width .25s ease;
  max-height:92vh;overflow-y:auto;
}
.consult-modal-overlay.open .consult-modal{transform:translateY(0);}
.consult-modal-close{
  position:absolute;top:8px;right:8px;background:none;border:none;
  font-size:22px;line-height:1;color:var(--ink-3);cursor:pointer;
  width:44px;height:44px;display:flex;align-items:center;justify-content:center;
}
.consult-modal-close:hover{color:var(--navy-900);}

/* ---- Consultation form ("Book your spam-free consultation") — shared
   markup used by the popup modal, the homepage hero card, and the
   Contact Us page, styled once here so all three stay in sync. ---- */
.consult-modal h3,
.hero-consult-card h3,
.consult-form-card h3{font-size:20px;margin:0 0 14px;}

.badge-checklist{
  display:inline-block;background:var(--blue-100);color:var(--navy-900);
  font-size:12.5px;font-weight:600;line-height:1.75;
  padding:9px 16px;border-radius:999px;margin-bottom:18px;
}
.badge-checklist b{color:var(--brass-500);font-weight:800;margin-right:1px;}

form.lead-form .form-row{margin-bottom:14px;}
form.lead-form .field{margin-bottom:14px;}
form.lead-form input,
form.lead-form select{
  width:100%;padding:12px 14px;border:1.5px solid var(--line-2);border-radius:10px;
  font-size:14px;font-family:'Inter',sans-serif;color:var(--ink);background:#fff;
}
form.lead-form select{
  appearance:none;cursor:pointer;color:var(--ink);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M5.5 7.5l4.5 4.5 4.5-4.5' stroke='%234B5567' stroke-width='1.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;padding-right:36px;
}
form.lead-form input::placeholder{color:var(--ink-3);}
form.lead-form input:focus,
form.lead-form select:focus{outline:none;border-color:var(--blue-600);}
form.lead-form input.invalid{border-color:#A32D2D;}
form.lead-form input.invalid:focus{border-color:#A32D2D;}
form.lead-form .field-error{font-size:11.5px;color:#A32D2D;margin-top:5px;}
form.lead-form .form-msg{font-size:12.5px;text-align:center;margin-top:10px;min-height:1.4em;}
form.lead-form .form-note{font-size:11.5px;color:var(--ink-3);text-align:center;margin:10px 0 0;}

/* ============================================================
   Cal.id popup — opens on top of everything right after someone
   submits the lead form, so they can pick a real date and time.
   Deliberately a standalone popup, not embedded inline in the card.
   ============================================================ */
.calid-popup-overlay{
  position:fixed;inset:0;background:rgba(11,27,54,0.65);
  display:flex;align-items:center;justify-content:center;
  z-index:1100;padding:20px;
  opacity:0;visibility:hidden;transition:opacity .22s ease;
}
.calid-popup-overlay.open{opacity:1;visibility:visible;}
.calid-popup{
  background:#fff;border-radius:16px;max-width:640px;width:100%;
  position:relative;box-shadow:0 30px 70px rgba(11,27,54,0.4);
  padding:44px 16px 16px;
}
.calid-popup-close{
  position:absolute;top:6px;right:6px;background:none;border:none;
  font-size:24px;line-height:1;color:var(--ink-3);cursor:pointer;z-index:2;
  width:44px;height:44px;display:flex;align-items:center;justify-content:center;
}
.calid-popup-close:hover{color:var(--navy-900);}
.calid-inline-wrap{
  position:relative;width:100%;height:640px;min-width:280px;
  border-radius:10px;overflow:hidden;background:var(--off);
  border:1px solid var(--line);
}
.calid-inline-wrap iframe{width:100%;height:100%;border:none;display:block;position:relative;z-index:1;}
.calid-loading{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  text-align:center;padding:24px;font-size:13.5px;color:var(--ink-3);z-index:0;
}
.calid-fallback{
  position:absolute;left:0;right:0;bottom:12px;text-align:center;
  font-size:12.5px;color:var(--ink-3);z-index:2;margin:0;padding:0 16px;
}
.calid-fallback a{color:var(--blue-600);font-weight:600;text-decoration:none;}

@media (max-width:640px){
  .calid-popup-overlay{padding:0;}
  .calid-popup{
    max-width:100%;width:100%;height:100%;max-height:100vh;
    border-radius:0;padding:44px 6px 10px;
  }
  .calid-inline-wrap{height:calc(100vh - 60px);border-radius:8px;}
}

.btn-book{
  display:flex;align-items:center;justify-content:center;gap:8px;width:100%;
  background:var(--navy-900);color:#fff;border:none;border-radius:10px;
  padding:14px 18px;font-size:15px;font-weight:700;font-family:'Inter',sans-serif;
  cursor:pointer;transition:background .15s;
}
.btn-book:hover{background:var(--blue-600);}
.btn-book:disabled{opacity:.65;cursor:default;}

/* Once someone submits their details, the form is swapped for a simple,
   private confirmation right here in the same card — no external
   calendar or company schedule is ever shown to the customer. */
.consult-thankyou{text-align:center;padding:36px 20px 8px;}
.consult-thankyou-icon{
  width:48px;height:48px;margin:0 auto 16px;border-radius:50%;
  background:var(--blue-100);color:var(--navy-900);
  display:flex;align-items:center;justify-content:center;
  font-size:22px;font-weight:800;
}
.consult-thankyou h4{font-size:19px;margin:0 0 10px;}
.consult-thankyou p{font-size:14px;color:var(--ink-2);line-height:1.6;margin:0 0 8px;max-width:380px;margin-left:auto;margin-right:auto;}
.consult-thankyou p b{color:var(--navy-900);}
.calid-reset-link{
  display:block;width:100%;text-align:center;background:none;border:none;
  font-size:12.5px;color:var(--ink-2);font-weight:600;cursor:pointer;
  padding:10px 0 0;text-decoration:underline;text-underline-offset:2px;
}
.calid-reset-link:hover{color:var(--navy-900);}

/* Card chrome for each placement */
.hero-consult-card{
  background:#fff;border-radius:16px;padding:28px 26px 24px;
  box-shadow:0 20px 50px rgba(11,27,54,0.18);
}
.consult-form-card{padding:28px 26px 24px;}

/* ============================================================
   Top process ticker — static strip above the header, on every
   page, spelling out how the LoanGuy Fintech process works.
   (No longer animated — the duplicated aria-hidden set that used
   to enable a seamless scroll loop is simply hidden now.)
   ============================================================ */
.process-ticker{
  background:var(--green-ticker);color:#fff;
  overflow:hidden;white-space:nowrap;position:relative;
  padding:9px 0;
}
.ticker-track{
  display:inline-flex;width:max-content;
  animation:ticker-scroll 34s linear infinite;
}
.process-ticker:hover .ticker-track{animation-play-state:paused;}
.ticker-set{display:inline-flex;align-items:center;}
.ticker-set span{
  display:inline-flex;align-items:center;
  padding:0 22px;font-size:12.5px;font-weight:600;letter-spacing:0.01em;color:#fff;
}
.ticker-set span::after{content:'\2022';margin-left:22px;color:rgba(255,255,255,0.55);font-weight:700;}
@keyframes ticker-scroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@media (prefers-reduced-motion: reduce){.ticker-track{animation:none;}}

@media (max-width:640px){
  /* The ticker scrolls at a fixed pixel speed, so on a narrow phone
     screen the same speed that reads comfortably on desktop crosses
     the whole viewport in a few seconds — too fast to actually read.
     Slowing it down (and tightening spacing slightly) gives each
     phrase enough time on screen to be legible. */
  .process-ticker{padding:8px 0;}
  .ticker-track{animation-duration:85s;}
  .ticker-set span{padding:0 16px;font-size:12px;line-height:1.4;}
  .ticker-set span::after{margin-left:16px;}
}

/* ============================================================
   Instant eligibility strip — persistent CTA band under the
   header, on every page.
   ============================================================ */
.eligibility-strip{
  background:linear-gradient(100deg,var(--green-ticker) 0%,var(--blue-600) 45%,var(--navy-800) 75%,var(--green-ticker) 100%);
  background-size:220% 100%;
  color:#fff;position:relative;overflow:hidden;
  animation:elig-strip-drift 10s ease-in-out infinite alternate;
}
.eligibility-strip::after{
  content:'';position:absolute;top:0;left:-35%;width:22%;height:100%;
  background:linear-gradient(115deg,transparent,rgba(255,255,255,0.16),transparent);
  animation:elig-strip-sheen 7s ease-in-out infinite;
  pointer-events:none;
}
@keyframes elig-strip-drift{
  from{background-position:0% 50%;}
  to{background-position:100% 50%;}
}
@keyframes elig-strip-sheen{
  0%{left:-35%;}
  55%{left:115%;}
  100%{left:115%;}
}
@media (prefers-reduced-motion: reduce){
  .eligibility-strip{animation:none;}
  .eligibility-strip::after{display:none;}
}
.elig-strip-inner{
  max-width:1120px;margin:0 auto;padding:10px 24px;
  display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;
  position:relative;z-index:1;
}
.elig-strip-left{display:flex;align-items:center;gap:14px;flex-wrap:wrap;row-gap:6px;}
.elig-badge{
  display:inline-flex;align-items:center;gap:3px;background:rgba(0,0,0,0.32);border:1px solid rgba(255,255,255,0.18);
  color:#fff;font-size:10.5px;font-weight:700;padding:4px 9px;border-radius:999px;
  white-space:nowrap;
}
.elig-strip-text{font-size:13.5px;color:#fff;}
.elig-strip-text strong{font-weight:700;}
.elig-strip-sub{color:rgba(255,255,255,0.72);font-weight:500;margin-left:6px;}
.elig-strip-btn{
  background:#fff;color:var(--navy-900);font-weight:700;font-size:13.5px;
  padding:11px 20px;border-radius:8px;text-decoration:none;white-space:nowrap;
  display:inline-flex;align-items:center;gap:6px;transition:background .15s;
  position:relative;overflow:hidden;
}
.elig-strip-btn:hover{background:var(--brass-100);}
@media (max-width:760px){
  .elig-strip-inner{justify-content:center;text-align:center;}
  .elig-strip-sub{display:block;margin-left:0;}
}

/* Small reassurance line under primary CTAs, site-wide */
.spamfree-note{
  display:flex;align-items:center;gap:6px;font-size:12px;color:var(--ink-3);margin-top:10px;
}
.spamfree-note::before{content:'✓';color:var(--brass-500);font-weight:700;}

/* ============================================================
   Shine sweep — a soft light sheen that periodically passes across
   the "Check Eligibility" button on the instant-eligibility strip
   only, matching that strip's own animated background. Purely
   decorative and disabled for reduced-motion users.
   ============================================================ */
.elig-strip-btn{position:relative;overflow:hidden;}
.elig-strip-btn::after{
  content:'';position:absolute;top:0;left:-60%;width:35%;height:100%;
  pointer-events:none;
  background:linear-gradient(115deg,transparent,rgba(46,99,80,0.16),transparent);
  animation:btn-sheen 4.2s ease-in-out infinite;
}
@keyframes btn-sheen{
  0%{left:-60%;}
  35%{left:130%;}
  100%{left:130%;}
}
@media (prefers-reduced-motion: reduce){
  .elig-strip-btn::after{display:none;}
}

/* ============================================================
   PILOT — scroll storytelling. Sections and cards fade/rise into
   view as they're scrolled to, with cards inside a group cascading
   in one after another. Inspired by rothfinder.com's scroll feel,
   but built with plain CSS transitions + IntersectionObserver only
   (no animation library) so it's cheap to run and easy to strip out
   entirely if it doesn't earn its keep — every rule affected is
   scoped under this one block and the .reveal/.reveal-group classes
   in the markup.
   ============================================================ */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .6s ease,transform .6s ease;}
.reveal.in{opacity:1;transform:translateY(0);}
.reveal-group .reveal:nth-child(1){transition-delay:0s;}
.reveal-group .reveal:nth-child(2){transition-delay:.08s;}
.reveal-group .reveal:nth-child(3){transition-delay:.16s;}
.reveal-group .reveal:nth-child(4){transition-delay:.24s;}
.reveal-group .reveal:nth-child(5){transition-delay:.32s;}
.reveal-group .reveal:nth-child(6){transition-delay:.40s;}
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1;transform:none;transition:none;}
}

/* ============================================================
   Document checklist page — applicant-type toggle + numbered
   checklist sections, echoing the site's card/navy language.
   ============================================================ */
.doc-toggle-wrap{
  display:flex;align-items:center;justify-content:center;gap:12px;
  margin:0 0 32px;flex-wrap:wrap;
}
.doc-toggle-wrap label{font-size:14px;font-weight:600;color:var(--navy-900);}
.doc-toggle-wrap select{
  padding:12px 38px 12px 18px;border:1.5px solid var(--line-2);border-radius:999px;
  font-size:14px;font-weight:700;color:var(--navy-900);background:#fff;cursor:pointer;
  appearance:none;min-height:44px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M5.5 7.5l4.5 4.5 4.5-4.5' stroke='%234B5567' stroke-width='1.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;
}
.doc-toggle-wrap select:focus{outline:none;border-color:var(--blue-600);}

.doc-section{border:1px solid var(--line);border-radius:14px;overflow:hidden;margin-bottom:22px;background:#fff;}
.doc-section-bar{
  background:var(--navy-900);color:#fff;font-weight:700;font-size:14.5px;
  padding:13px 20px;display:flex;align-items:center;gap:10px;
}
.doc-num{
  display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;
  width:22px;height:22px;border-radius:50%;background:rgba(255,255,255,0.18);font-size:12px;
}
.doc-section-body{display:flex;gap:28px;padding:22px 24px;flex-wrap:wrap;}
.doc-list-col{flex:1 1 260px;min-width:220px;}
.doc-list{list-style:none;margin:0;padding:0;}
.doc-list li{position:relative;padding-left:26px;margin-bottom:12px;font-size:13.5px;color:var(--ink);line-height:1.5;}
.doc-list li::before{
  content:'\2713';position:absolute;left:0;top:1px;color:#fff;background:var(--blue-600);
  width:16px;height:16px;border-radius:50%;font-size:9.5px;font-weight:700;
  display:flex;align-items:center;justify-content:center;
}
.doc-list li small{display:block;color:var(--ink-3);font-size:12px;margin-top:3px;font-weight:400;line-height:1.5;}
.doc-callout{flex:0 1 280px;background:var(--blue-50);border-radius:10px;padding:16px 18px;font-size:12.5px;color:var(--ink-2);}
.doc-callout-title{font-weight:700;color:var(--navy-900);margin-bottom:8px;font-size:13px;}
.doc-callout ul{margin:0;padding-left:18px;}
.doc-callout ul li{margin-bottom:4px;}
.doc-callout.doc-note{background:var(--brass-100);}
.doc-callout.doc-note .doc-callout-title{color:var(--brass-500);}

.doc-property-grid{display:grid;grid-template-columns:1fr auto 1fr;gap:24px;align-items:start;padding:22px 24px;}
.doc-property-col h5{font-size:13.5px;margin:0 0 12px;color:var(--navy-900);}
.doc-or{
  display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;
  background:var(--navy-900);color:#fff;font-size:11px;font-weight:700;align-self:center;margin-top:8px;
}

.doc-important{
  background:var(--off);border:1px solid var(--line);border-radius:14px;padding:22px 24px;
  font-size:12.5px;color:var(--ink-2);line-height:1.65;margin-top:8px;
}
.doc-important b{color:var(--navy-900);}
.doc-important p{margin:0 0 8px;}
.doc-important p:last-child{margin-bottom:0;}

@media (max-width:760px){
  .doc-property-grid{grid-template-columns:1fr;padding:20px;}
  .doc-or{margin:2px auto;}
  .doc-section-body{padding:20px;}
}

/* ============================================================
   PILOT — PWA install banner (assets/pwa.js). Entirely
   self-contained: safe to delete this whole block if the PWA
   pilot doesn't work out, alongside pwa.js, manifest.json,
   service-worker.js and assets/icons/.
   ============================================================ */
.pwa-install-banner{
  position:fixed;left:12px;right:12px;bottom:-100px;z-index:1200;
  max-width:420px;margin:0 auto;background:#fff;border:1px solid var(--line-2);
  border-radius:14px;box-shadow:0 12px 32px rgba(11,27,54,0.22);
  padding:14px 16px;display:flex;align-items:center;gap:12px;
  transition:bottom .35s ease;
}
.pwa-install-banner.show{bottom:16px;}
.pwa-install-icon{flex-shrink:0;}
.pwa-install-icon img{border-radius:9px;display:block;}
.pwa-install-text{flex:1;display:flex;flex-direction:column;gap:6px;min-width:0;}
.pwa-install-text b{font-size:13.5px;color:var(--navy-900);}
.pwa-install-text span{font-size:12px;color:var(--ink-2);line-height:1.4;}
.pwa-install-btn{
  align-self:flex-start;background:var(--navy-900);color:#fff;border:none;
  border-radius:7px;padding:10px 18px;min-height:38px;font-size:12.5px;font-weight:700;
  font-family:inherit;cursor:pointer;transition:background .15s;
}
.pwa-install-btn:hover{background:var(--blue-600);}
.pwa-install-close{
  flex-shrink:0;background:none;border:none;color:var(--ink-3);font-size:20px;
  line-height:1;cursor:pointer;align-self:flex-start;margin:-8px -8px 0 0;
  width:44px;height:44px;display:flex;align-items:center;justify-content:center;
}
.pwa-install-close:hover{color:var(--navy-900);}
@media (max-width:480px){
  .pwa-install-banner{left:8px;right:8px;padding:12px 14px;}
}
