:root{
  --blue:#004AAD;
  --blue-dark:#031C3D;
  --teal:#5DE0E6;
  --ink:#1a1a1a;
  --gray:#5b6b85;
  --line:#e3e3e3;
  --paper:#ffffff;
  --offwhite:#efefef;
}
*{box-sizing:border-box; margin:0; padding:0;}
body{
  font-family:'Montserrat', sans-serif;
  color:var(--ink);
  background:var(--paper);
  line-height:1.65;
}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
.wrap{max-width:1200px; margin:0 auto; padding:0 40px;}
h1,h2,h3{font-family:'Playfair Display', serif; font-weight:700;}

/* ---------- HEADER ---------- */
header{border-bottom:1px solid var(--line);}
.nav{
  max-width:1200px; margin:0 auto; padding:20px 40px;
  display:flex; align-items:center; justify-content:space-between;
}
.brand-logo-img{height:58px; width:auto;}
.nav-links{display:flex; gap:56px; font-size:14px; font-weight:600; letter-spacing:0.04em; text-transform:uppercase;}
.nav-links a{color:var(--ink); opacity:0.85;}
.nav-links a.active{color:var(--teal); opacity:1;}
.nav-links a:hover{opacity:1;}
.nav-cta{
  background:var(--blue); color:#fff !important; opacity:1 !important;
  padding:11px 22px; font-size:12.5px; font-weight:700; letter-spacing:0.06em;
  border-radius:2px; transition:background 0.2s;
}
.nav-cta:hover{background:var(--blue-dark);}

/* ---------- HERO (home) ---------- */
.hero{
  background:linear-gradient(100deg, var(--teal) 0%, var(--blue) 70%);
  overflow:hidden;
}
.hero-inner{
  max-width:1500px; margin:0 auto;
  display:grid; grid-template-columns:1.15fr 0.85fr; align-items:end;
  min-height:560px;
}
.hero-text{padding:80px 40px 90px clamp(24px,6vw,72px); color:#fff;}
.hero-text h1{font-size:clamp(34px,4.6vw,54px); line-height:1.15; margin-bottom:26px;}
.hero-text p{font-size:16.5px; max-width:460px; margin-bottom:34px; opacity:0.96;}
.hero-text p strong{font-weight:700;}
.btn{
  display:inline-block; background:var(--blue-dark); color:#fff;
  padding:16px 30px; font-size:13px; font-weight:700; letter-spacing:0.09em; text-transform:uppercase;
  transition:background 0.2s;
}
.btn:hover{background:#000;}
.hero-photo{align-self:end;}
.hero-photo img{width:100%; height:auto; display:block;}

/* ---------- SECTION GENERIC ---------- */
section{padding:80px 0;}
.section-tight{padding:70px 0 0;}

/* ---------- HOME: intro / services ---------- */
.intro{display:flex; gap:26px; align-items:flex-start; max-width:820px; margin:0 auto 60px;}
.intro .bar{width:2px; height:110px; background:var(--teal); flex-shrink:0; margin-top:10px;}
.intro h2{font-size:clamp(24px,3vw,32px); line-height:1.4;}
.services-strip{background:var(--offwhite);}
.services-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:30px;}
.service-card{background:var(--paper); border:1px solid var(--line); padding:30px 26px;}
.service-card h3{font-size:16px; color:var(--blue); margin-bottom:10px; font-family:'Montserrat',sans-serif; font-weight:700; text-transform:uppercase; letter-spacing:0.02em;}
.service-card p{font-size:14px; color:var(--gray);}

/* ---------- TESTIMONIAL ---------- */
.testimonial{text-align:center;}
.testimonial blockquote{
  font-family:'Playfair Display', serif; font-style:italic; font-weight:600;
  font-size:clamp(18px,2vw,23px); max-width:800px; margin:0 auto 18px; line-height:1.6; color:var(--blue-dark);
}
.testimonial cite{font-style:normal; font-size:13px; color:var(--gray); letter-spacing:0.03em;}

/* ---------- ABOUT PAGE ---------- */
.about-hero{padding:70px 0;}
.about-hero-inner{display:grid; grid-template-columns:0.9fr 1.1fr; gap:60px; align-items:center;}
.about-hero-inner h1{font-size:clamp(26px,3vw,36px); line-height:1.35; margin-bottom:24px;}
.about-hero-inner h1 .accent{color:var(--teal);}
.about-hero-inner p{font-size:14.5px; color:var(--gray); margin-bottom:16px; max-width:520px;}

.steps-heading{text-align:center; padding-top:0;}
.steps-heading h2{font-size:clamp(22px,2.6vw,30px); margin-bottom:10px;}
.steps-heading h2 .accent{color:var(--teal);}
.steps-heading .sub{font-family:'Playfair Display', serif; font-style:italic; font-size:17px; color:var(--gray); margin-bottom:48px;}

.steps-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:30px;}
.step-card{position:relative;}
.step-panel{
  height:150px; border-radius:4px;
  background:linear-gradient(135deg, var(--teal), var(--blue));
  position:relative;
}
.step-badge{
  position:absolute; left:20px; bottom:-24px;
  width:64px; height:64px; border-radius:50%;
  background:var(--blue-dark); color:var(--teal);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  font-family:'Montserrat',sans-serif; font-weight:800; font-size:10px; letter-spacing:0.04em;
  border:4px solid #fff;
}
.step-badge span{font-size:16px;}
.step-card h3{
  font-size:19px; text-transform:uppercase; letter-spacing:0.04em; color:var(--blue);
  margin:40px 0 10px; font-family:'Montserrat',sans-serif; font-weight:800;
}
.step-card p{font-size:14px; color:var(--gray);}

.loans-section h2{text-align:center; font-size:clamp(22px,2.6vw,28px); text-transform:uppercase; letter-spacing:0.02em; margin-bottom:48px;}
.loans-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.loan-card{border:1px solid var(--line); padding:26px;}
.loan-card h3{font-family:'Montserrat',sans-serif; font-size:14.5px; color:var(--blue); text-transform:uppercase; letter-spacing:0.02em; margin-bottom:6px; font-weight:700;}
.loan-card .rate{font-size:11px; font-weight:700; letter-spacing:0.05em; text-transform:uppercase; color:var(--gray); margin-bottom:10px; display:block;}
.loan-card p{font-size:13.5px; color:var(--gray); margin-bottom:8px;}
.loan-card p strong{color:var(--ink);}
.legal-disclaimer{font-size:11px; color:var(--gray); max-width:900px; margin:40px auto 0; line-height:1.7;}

.page-cta{text-align:center;}
.page-cta h2{font-size:clamp(22px,2.6vw,28px); margin-bottom:24px;}

/* ---------- CONTACT PAGE ---------- */
.contact-hero{padding:70px 0 0;}
.contact-hero h1{font-size:clamp(30px,4vw,44px); margin-bottom:20px;}
.contact-hero p{font-size:14.5px; font-weight:600; color:var(--ink); max-width:640px;}

.contact-panel{background:var(--offwhite); margin-top:50px;}
.contact-info-row{
  display:flex; gap:60px; padding-top:56px; padding-bottom:40px; flex-wrap:wrap;
}
.contact-info-row div h4{font-size:12px; text-transform:uppercase; letter-spacing:0.06em; margin-bottom:8px; font-weight:700;}
.contact-info-row div p, .contact-info-row div a{font-size:14.5px; color:var(--ink);}
.socials{display:flex; gap:12px; margin-top:6px;}
.socials a{
  width:30px; height:30px; border-radius:50%; background:var(--blue-dark);
  display:flex; align-items:center; justify-content:center; color:#fff; font-size:11px; font-weight:700;
}

.form-grid{padding-bottom:56px;}
.form-row{display:grid; grid-template-columns:1fr 1fr 1fr; gap:16px; margin-bottom:16px;}
.form-row label, .form-field label{display:block; font-size:12px; margin-bottom:6px; font-weight:600;}
.form-field{margin-bottom:16px;}
.form-row input, .form-field input, .form-field textarea{
  width:100%; padding:12px 14px; border:1px solid var(--line); background:#fff;
  font-family:inherit; font-size:14px;
}
.form-field textarea{min-height:120px; resize:vertical;}
.consent{display:flex; gap:10px; align-items:flex-start; font-size:11.5px; color:var(--gray); max-width:640px; margin-bottom:26px;}
.consent a{text-decoration:underline;}
.form-submit{text-align:right;}

/* ---------- OFFICE / HOURS (contact page) ---------- */
.office-grid{display:grid; grid-template-columns:1fr 1fr; gap:48px;}
.office-grid h3{font-size:13px; text-transform:uppercase; letter-spacing:0.06em; color:var(--blue); margin-bottom:14px; font-weight:700; font-family:'Montserrat',sans-serif;}
.office-grid p{font-size:14px; color:var(--gray); margin-bottom:6px;}

/* ---------- FOOTER ---------- */
footer{background:var(--blue-dark); color:rgba(255,255,255,0.85); padding:56px 0 28px;}
.foot-inner{display:flex; justify-content:space-between; flex-wrap:wrap; gap:26px; margin-bottom:36px;}
.foot-inner p, .foot-inner a{font-size:13px; margin-bottom:4px; display:block; opacity:0.85;}
.foot-bottom{border-top:1px solid rgba(255,255,255,0.15); padding-top:22px; font-size:11px; opacity:0.6; text-align:center;}

@media (max-width:900px){
  .nav{flex-direction:column; align-items:flex-start; gap:14px; padding:16px 20px;}
  .nav-links{gap:22px; font-size:12px;}
  .wrap{padding:0 20px;}
  .hero-inner{grid-template-columns:1fr; min-height:auto;}
  .hero-text{padding:44px 24px 56px;}
  .about-hero-inner, .steps-grid, .loans-grid, .services-grid, .office-grid{grid-template-columns:1fr;}
  .form-row{grid-template-columns:1fr;}
  .foot-inner{flex-direction:column;}
}

@media (max-width:480px){
  .contact-info-row{gap:28px;}
  .step-badge{width:56px; height:56px;}
}