:root {
  --bg: #faf7f5;
  --dark: #18181b;
  --primary: #7c3aed;
  --secondary: #f97316;
  --accent: #f5e8ff;
  --white: #fff;
  --muted: #5b6472;
  --border: rgba(15, 23, 42, 0.08);
  --shadow: 0 18px 45px rgba(15,23,42,.10);
  --radius: 24px;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  margin:0; font-family: Inter, system-ui, sans-serif; background: var(--bg); color: var(--dark); line-height:1.65;
}
a { color: var(--primary); text-decoration:none; }
a:hover { color: var(--secondary); }
.topbar {
  background: rgba(17,24,39,.96); color:#e5eefb; font-size:.95rem;
}
.topbar a { color:#fff; font-weight:700; }
.site-nav {
  position: sticky; top:0; z-index:1030; backdrop-filter: blur(14px);
  background: rgba(255,255,255,.92); border-bottom:1px solid rgba(15,23,42,.06);
}
.navbar-brand { font-weight: 800; letter-spacing:-.03em; color: var(--dark)!important; }
.nav-link { color: #334155; font-weight:600; }
.nav-link:hover,.nav-link.active { color: var(--primary)!important; }
.hero {
  background: linear-gradient(135deg,#18181b 0%,#7c3aed 52%,#f97316 100%);
  color:#fff; padding: 6rem 0 4.5rem; position: relative; overflow:hidden;
}
.hero:before,.hero:after {
  content:""; position:absolute; border-radius:50%; filter: blur(30px); opacity:.18;
}
.hero:before { width:280px; height:280px; background:#fff; top:-60px; right:8%; }
.hero:after { width:220px; height:220px; background:#f97316; bottom:-60px; left:6%; }
.kicker {
  display:inline-flex; align-items:center; gap:.55rem; padding:.55rem .95rem;
  background: rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.18); border-radius:999px; font-size:.92rem; font-weight:700;
}
.display-hero { font-size: clamp(2.35rem, 5vw, 4.7rem); line-height:1.02; letter-spacing:-.04em; font-weight:900; }
.lead-soft { font-size:1.1rem; color: rgba(255,255,255,.88); max-width: 760px; }
.hero-card {
  background: rgba(255,255,255,.94); color: var(--dark); padding: 2rem; border-radius: 28px; box-shadow: var(--shadow);
}
.btn-brand {
  background: linear-gradient(135deg,var(--primary),var(--secondary)); color:#fff; border:none; border-radius:999px; padding:.95rem 1.5rem; font-weight:800;
}
.btn-brand:hover { color:#fff; transform: translateY(-1px); }
.btn-outline-brand {
  border:1px solid rgba(255,255,255,.35); color:#fff; border-radius:999px; padding:.95rem 1.45rem; font-weight:700; background: rgba(255,255,255,.06);
}
.section { padding: 4.5rem 0; }
.section-title { font-size: clamp(1.9rem, 3vw, 3rem); font-weight: 900; letter-spacing:-.04em; margin-bottom:.8rem; }
.section-subtitle { color: var(--muted); max-width: 760px; }
.metric-card,.loan-card,.content-card,.blog-card,.faq-card,.contact-card,.step-card {
  background:#fff; border:1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow);
}
.metric-card { padding: 1.35rem; height:100%; }
.metric-card strong { font-size:1.2rem; display:block; margin-bottom:.35rem; }
.loan-card,.blog-card,.step-card,.faq-card { padding:1.65rem; height:100%; }
.icon-pill {
  width: 3.2rem; height:3.2rem; border-radius:18px; display:grid; place-items:center; color:#fff;
  background: linear-gradient(135deg,var(--primary),var(--secondary)); box-shadow:0 12px 24px rgba(0,0,0,.12);
}
.split-panel {
  background:#fff; border-radius: 32px; overflow:hidden; border:1px solid var(--border); box-shadow: var(--shadow);
}
.split-panel .pane-a { padding:2rem; }
.split-panel .pane-b {
  background: linear-gradient(160deg, rgba(255,255,255,.08), rgba(255,255,255,.02)), linear-gradient(135deg,var(--primary),var(--dark));
  color:#fff; padding:2rem;
}
.badge-soft { display:inline-flex; gap:.45rem; align-items:center; padding:.5rem .85rem; background: var(--accent); color: var(--primary); border-radius:999px; font-weight:800; font-size:.9rem; }
.cta-band {
  border-radius: 34px; background: linear-gradient(135deg,var(--dark),var(--primary)); color:#fff; padding:2rem;
}
.list-clean { list-style:none; padding:0; margin:0; }
.list-clean li { margin-bottom:.9rem; padding-left:1.8rem; position:relative; }
.list-clean li:before { content:"\f058"; font-family:"Font Awesome 6 Free"; font-weight:900; position:absolute; left:0; color: var(--secondary); }
.muted { color: var(--muted); }
footer {
  background:#0f172a; color:#d8e4f2; padding: 4rem 0 2rem; margin-top: 3rem;
}
footer a { color:#fff; opacity:.88; }
footer a:hover { opacity:1; color:#fff; }
.footer-title { color:#fff; font-weight:800; margin-bottom:1rem; }
.page-hero {
  background: linear-gradient(180deg, rgba(255,255,255,.95), rgba(255,255,255,.78));
  border-bottom:1px solid var(--border); padding: 3.8rem 0 2.8rem;
}
.page-hero h1 { font-size: clamp(2rem, 4vw, 3.5rem); font-weight:900; letter-spacing:-.04em; }
.article-content p { margin-bottom:1.1rem; color:#334155; }
.article-content h2,.article-content h3 { margin-top:1.8rem; font-weight:900; letter-spacing:-.03em; }
.contact-box {
  background: linear-gradient(145deg, #fff, #f8fbff); padding:2rem; border-radius: 28px; border:1px solid var(--border); box-shadow: var(--shadow);
}
.phone-badge {
  display:inline-flex; align-items:center; gap:.6rem; padding:.8rem 1.1rem; border-radius:999px; background: var(--accent); color: var(--primary); font-weight:800;
}
.small-note { font-size:.95rem; color: var(--muted); }
@media (max-width: 991.98px) {
  .hero { padding-top: 4.75rem; }
}