/* =========================================================
   PREMIUM FINTECH OVERLAY v2 — emerald + gold + glass
   Loaded LAST so it overrides every previous file.
   ========================================================= */

:root {
  --emerald-900: #052e1a;
  --emerald-800: #0a4022;
  --emerald-700: #0e5024;
  --emerald-600: #157a3e;
  --emerald-500: #1f9d52;
  --emerald-300: #6dd896;
  --emerald-50:  #e9f9ef;
  --gold-500:    #d4a437;
  --gold-400:    #e6c065;
  --gold-300:    #f3d98a;
  --ink-950:     #060d09;
  --ink-900:     #0c1a12;
  --ink-700:     #1f2e25;
  --ink-500:     #5a6b62;
  --line-soft:   rgba(15,80,36,.08);
  --grad-emerald: linear-gradient(135deg, #157a3e 0%, #0a4022 50%, #052e1a 100%);
  --grad-gold:    linear-gradient(135deg, #f3d98a 0%, #d4a437 100%);
  --grad-mesh:
    radial-gradient(at 12% 18%, rgba(21,122,62,.18), transparent 45%),
    radial-gradient(at 86% 22%, rgba(212,164,55,.12), transparent 50%),
    radial-gradient(at 60% 90%, rgba(21,122,62,.10), transparent 55%);
  --shadow-xl: 0 30px 80px -20px rgba(5,46,26,.35);
  --shadow-lg: 0 18px 50px -12px rgba(5,46,26,.25);
  --shadow-md: 0 10px 28px -8px rgba(5,46,26,.18);
  --shadow-glow: 0 0 0 4px rgba(21,157,82,.12), 0 18px 38px -10px rgba(21,157,82,.45);
}

html { scroll-behavior: smooth; }
body {
  background: #fafdfb;
  color: var(--ink-900);
  font-family: 'Plus Jakarta Sans','Inter',system-ui,sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
::selection { background: var(--emerald-500); color: #fff; }

/* Floating blurred gradient orbs in background */
body::before, body::after {
  content: ""; position: fixed; pointer-events: none; z-index: 0;
  filter: blur(80px); opacity: .55;
  border-radius: 50%;
}
body::before {
  width: 480px; height: 480px;
  background: radial-gradient(circle, rgba(21,157,82,.35), transparent 70%);
  top: -100px; left: -120px;
  animation: orb 22s ease-in-out infinite alternate;
}
body::after {
  width: 520px; height: 520px;
  background: radial-gradient(circle, rgba(212,164,55,.22), transparent 70%);
  top: 40%; right: -160px;
  animation: orb 28s ease-in-out infinite alternate-reverse;
}
@keyframes orb {
  0%   { transform: translate(0,0) scale(1); }
  100% { transform: translate(80px,60px) scale(1.15); }
}
nav, section, footer, .modal { position: relative; z-index: 1; }

/* =================== Navbar dropdown =================== */
.navbar .dropdown-menu {
  background: rgba(255,255,255,.92);
  backdrop-filter: saturate(200%) blur(20px);
  -webkit-backdrop-filter: saturate(200%) blur(20px);
  border: 1px solid rgba(255,255,255,.7);
  border-radius: 16px;
  box-shadow: 0 20px 60px -12px rgba(5,46,26,.22), 0 0 0 1px rgba(21,157,82,.06);
  padding: 8px;
  min-width: 210px;
  margin-top: 10px !important;
  animation: ddFadeIn .18s cubic-bezier(.2,.8,.2,1) forwards;
}
@keyframes ddFadeIn {
  from { opacity: 0; transform: translateY(-6px) scale(.98); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
.navbar .dropdown-item {
  border-radius: 10px;
  padding: 9px 14px;
  font-weight: 600;
  font-size: .9rem;
  color: var(--ink-700);
  transition: background .2s, color .2s, transform .2s;
  display: flex;
  align-items: center;
}
.navbar .dropdown-item i {
  width: 28px; height: 28px;
  background: linear-gradient(135deg, var(--emerald-50), #fff);
  border: 1px solid rgba(21,157,82,.15);
  border-radius: 8px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: .85rem;
  flex-shrink: 0;
  transition: all .25s;
}
.navbar .dropdown-item:first-child {
  border-bottom: 1px solid rgba(21,157,82,.1);
  margin-bottom: 4px;
  padding-bottom: 12px;
  border-radius: 10px 10px 0 0;
}
.navbar .dropdown-item:hover {
  background: linear-gradient(135deg, rgba(21,157,82,.08), rgba(212,164,55,.05));
  color: var(--emerald-700);
  transform: translateX(3px);
}
.navbar .dropdown-item:hover i {
  background: var(--grad-emerald);
  color: #fff;
  border-color: transparent;
  box-shadow: 0 6px 14px rgba(21,122,62,.35);
}

/* =================== Navbar =================== */
.navbar.sticky-top {
  background: rgba(255,255,255,.72) !important;
  backdrop-filter: saturate(180%) blur(18px);
  -webkit-backdrop-filter: saturate(180%) blur(18px);
  border-bottom: 1px solid rgba(255,255,255,.6);
  box-shadow: 0 2px 24px rgba(5,46,26,.05);
  padding: .55rem 0 !important;
}
.navbar.scrolled { box-shadow: 0 10px 40px rgba(5,46,26,.08); }
.brand-name { background: linear-gradient(90deg, var(--ink-900), var(--emerald-700)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.brand-sub  { color: var(--gold-500) !important; }
.nav-link { font-weight:600; font-size:.95rem; color: var(--ink-700) !important; transition: color .25s; padding: .5rem .85rem !important; }
.nav-link:hover, .nav-link.active { color: var(--emerald-600) !important; }
.nav-link.active::after, .nav-link:hover::after {
  content:""; position:absolute; left:20%; right:20%; bottom:2px; height:2px;
  background: var(--grad-gold); border-radius:2px;
}
.helpline-icon {
  background: var(--grad-emerald) !important;
  box-shadow: 0 8px 20px rgba(21,122,62,.35), inset 0 0 0 1px rgba(255,255,255,.15);
}

/* =================== Hero =================== */
.hero-section {
  background: #fafdfb !important;
  background-image: var(--grad-mesh) !important;
  padding: 40px 0 80px;
  overflow: hidden;
}
.hero-section h1.display-3 {
  font-family: 'Fraunces', Georgia, serif !important;
  font-weight: 700; letter-spacing: -.025em;
  background: linear-gradient(180deg, #0c1a12 10%, #1c382a 90%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.hero-section h1.display-3 .text-success {
  background: linear-gradient(135deg, var(--emerald-500), var(--emerald-700));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent !important;
}
.charge-box {
  background: rgba(255,255,255,.7) !important;
  backdrop-filter: blur(14px);
  border: 1px solid rgba(212,164,55,.35) !important;
  border-radius: 18px !important;
  box-shadow: 0 12px 32px rgba(5,46,26,.08), inset 0 0 0 1px rgba(255,255,255,.6);
}
.charge-box h2 {
  background: var(--grad-emerald);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.hero-section .col-lg-7::after {
  filter: drop-shadow(0 30px 40px rgba(5,46,26,.25));
  animation: floaty 6s ease-in-out infinite;
}
@keyframes floaty {
  0%,100% { transform: translateY(0) rotate(0); }
  50%     { transform: translateY(-16px) rotate(-1.5deg); }
}

/* =================== Buttons =================== */
.btn { border-radius: 12px !important; font-weight: 700; letter-spacing: .02em; transition: all .3s cubic-bezier(.2,.8,.2,1); position: relative; overflow: hidden; }
.btn-success {
  background: var(--grad-emerald) !important;
  border: none !important; color: #fff !important;
  box-shadow: 0 10px 24px -6px rgba(21,122,62,.45);
}
.btn-success:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-glow);
}
.btn-warning {
  background: var(--grad-gold) !important;
  border: none !important; color: #2a1a00 !important;
  box-shadow: 0 10px 24px -6px rgba(212,164,55,.5);
}
.btn-warning:hover { transform: translateY(-3px); box-shadow: 0 0 0 4px rgba(212,164,55,.15), 0 18px 36px -8px rgba(212,164,55,.55); }
.btn-light { background: rgba(255,255,255,.95) !important; border: 1px solid rgba(255,255,255,.4) !important; }
/* sheen */
.btn-success::after, .btn-warning::after {
  content: ""; position: absolute; top:0; left:-80%; width:60%; height:100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.45), transparent);
  transform: skewX(-22deg); transition: left .7s ease;
}
.btn-success:hover::after, .btn-warning:hover::after { left: 130%; }
.btn-apply {
  border-radius: 10px !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.12);
}
.btn-apply:hover { transform: translateY(-2px); filter: brightness(1.08) saturate(1.1); }

/* =================== Apply card / forms =================== */
.apply-card {
  border-radius: 24px !important;
  background: rgba(255,255,255,.96) !important;
  border: 1px solid rgba(255,255,255,.6) !important;
  box-shadow: 0 40px 80px -30px rgba(5,46,26,.35), inset 0 0 0 1px rgba(255,255,255,.5);
}
.apply-header {
  background: var(--grad-emerald) !important;
  position: relative; overflow: hidden;
}
.apply-header::before {
  content:""; position:absolute; inset:0;
  background: radial-gradient(circle at 80% 20%, rgba(212,164,55,.25), transparent 60%);
}
.form-control, .form-select {
  border-radius: 12px !important; height: 48px;
  border-color: var(--line-soft) !important;
  transition: all .25s;
}
.form-control:focus, .form-select:focus {
  border-color: var(--emerald-600) !important;
  box-shadow: 0 0 0 4px rgba(21,157,82,.12) !important;
}
.input-group-text { border-radius: 12px 0 0 12px !important; background: #fff !important; border-color: var(--line-soft) !important; }

/* =================== Trust strip =================== */
.trust-strip {
  background: rgba(255,255,255,.85) !important;
  backdrop-filter: blur(10px);
}
.trust-ico {
  width: 56px; height: 56px; border-radius: 16px;
  background: linear-gradient(135deg, var(--emerald-50), #fff) !important;
  color: var(--emerald-600) !important;
  display: inline-flex; align-items:center; justify-content:center;
  font-size: 1.5rem !important;
  box-shadow: inset 0 0 0 1px rgba(21,157,82,.15), 0 6px 14px rgba(5,46,26,.06);
  transition: all .3s cubic-bezier(.2,.8,.2,1);
}
.trust-strip .col-6:hover .trust-ico {
  background: var(--grad-emerald) !important;
  color: #fff !important;
  transform: translateY(-3px) rotate(-6deg);
}

/* =================== Section title =================== */
.section-title {
  font-weight: 800; letter-spacing: .14em;
  font-size: clamp(1.2rem, 2.2vw, 1.6rem) !important;
}
.section-title::before, .section-title::after {
  height: 2px; background: linear-gradient(90deg, transparent, var(--gold-500)) !important;
  flex-basis: 70px;
}
.section-title::after { background: linear-gradient(90deg, var(--gold-500), transparent) !important; }

/* =================== Loan cards =================== */
.loan-card {
  border-radius: 22px !important;
  background: rgba(255,255,255,.85) !important;
  border: 1px solid rgba(255,255,255,.6) !important;
  backdrop-filter: blur(12px);
  box-shadow: 0 12px 32px -10px rgba(5,46,26,.12);
  padding: 32px 22px 26px !important;
  transition: all .4s cubic-bezier(.2,.8,.2,1);
  position: relative; overflow: hidden;
}
.loan-card::before {
  content:""; position:absolute; inset:0;
  background: radial-gradient(circle at 50% 0%, rgba(21,157,82,.1), transparent 55%);
  opacity:0; transition: opacity .4s;
}
.loan-card:hover { transform: translateY(-10px); box-shadow: var(--shadow-xl); border-color: rgba(21,157,82,.18) !important; }
.loan-card:hover::before { opacity: 1; }
.loan-ico {
  width: 84px !important; height: 84px !important;
  box-shadow: 0 16px 28px -8px rgba(0,0,0,.22), inset 0 0 0 1px rgba(255,255,255,.18);
  position: relative;
}
.loan-ico::after {
  content:""; position:absolute; inset:-6px;
  border: 2px dashed currentColor; border-radius:50%;
  opacity:0; transition: opacity .35s, transform .8s;
}
.loan-card:hover .loan-ico { transform: rotate(-10deg) scale(1.1); }
.loan-card:hover .loan-ico::after { opacity:.35; transform: rotate(40deg); }

/* =================== Panels (process, EMI) =================== */
.panel-card {
  background: rgba(255,255,255,.9) !important;
  backdrop-filter: blur(14px);
  border: 1px solid rgba(255,255,255,.7) !important;
  border-radius: 24px !important;
  box-shadow: var(--shadow-lg);
}
.step-circle {
  background: linear-gradient(135deg, #fff, var(--emerald-50)) !important;
  border: 1px solid rgba(21,157,82,.18) !important;
  box-shadow: 0 12px 24px -8px rgba(5,46,26,.15), inset 0 0 0 1px rgba(255,255,255,.7);
}
.step-num { background: var(--grad-emerald) !important; box-shadow: 0 6px 14px rgba(21,122,62,.4); }
.emi-result { border-radius: 18px !important; background: rgba(255,255,255,.9); }
.emi-result-head {
  background: linear-gradient(90deg, var(--emerald-50), #fff, var(--emerald-50)) !important;
  letter-spacing: .14em;
}
.emi-result h2 {
  background: var(--grad-emerald);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}

/* =================== Testimonials =================== */
.testi-card {
  background: rgba(255,255,255,.9) !important;
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,.7) !important;
  border-radius: 18px !important;
  padding: 22px !important;
  box-shadow: 0 8px 24px rgba(5,46,26,.06);
  transition: all .35s;
  position: relative;
}
.testi-card::before {
  content:"\201C"; position:absolute; top:-10px; left:14px;
  font-family: 'Fraunces', serif;
  font-size: 4rem; line-height: 1;
  color: var(--gold-400); opacity:.5;
}
.testi-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-lg); }
.avatar { box-shadow: 0 6px 14px rgba(0,0,0,.2), inset 0 0 0 2px rgba(255,255,255,.4); }
.stars { color: var(--gold-500) !important; letter-spacing: 3px; }

/* =================== FAQ =================== */
.faq-accordion .accordion-item {
  background: rgba(255,255,255,.85) !important;
  border: 1px solid rgba(255,255,255,.6) !important;
  border-radius: 14px !important;
  margin-bottom: 12px;
  box-shadow: 0 4px 14px rgba(5,46,26,.04);
  overflow: hidden;
  transition: all .3s;
}
.faq-accordion .accordion-item:hover { box-shadow: 0 12px 30px rgba(5,46,26,.1); transform: translateY(-2px); }
.faq-accordion .accordion-button {
  background: transparent !important;
  font-weight: 600; padding: 18px 20px;
  color: var(--ink-900);
}
.faq-accordion .accordion-button:not(.collapsed) {
  background: rgba(21,157,82,.05) !important;
  color: var(--emerald-700);
}

/* =================== CTA banner =================== */
.cta-banner {
  background: var(--grad-emerald) !important;
  position: relative; overflow: hidden;
}
.cta-banner::before {
  content:""; position:absolute; top:-50%; right:-10%;
  width:480px; height:480px; border-radius:50%;
  background: radial-gradient(circle, rgba(212,164,55,.2), transparent 60%);
  filter: blur(20px);
  animation: floaty 14s ease-in-out infinite;
}
.cta-banner h3 { color: #fff; letter-spacing: -.01em; font-weight: 800; }

/* =================== Footer =================== */
.footer {
  background: linear-gradient(180deg, var(--ink-900) 0%, var(--ink-950) 100%) !important;
  position: relative;
}
.footer::before {
  content:""; position:absolute; top:0; left:0; right:0; height:1px;
  background: linear-gradient(90deg, transparent, var(--gold-500), transparent);
  opacity:.5;
}
.footer-h { color:#fff; letter-spacing:.16em; }
.footer-list a { transition: color .2s, padding-left .25s; }
.footer-list a:hover { color: var(--gold-400) !important; padding-left: 4px; }
.social-icons a {
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.08);
  transition: all .3s;
}
.social-icons a:hover {
  background: var(--grad-emerald) !important;
  transform: translateY(-3px);
  box-shadow: 0 10px 20px rgba(21,157,82,.4);
}

/* =================== Page hero (inner) =================== */
.page-hero {
  background:
    linear-gradient(135deg, var(--emerald-800) 0%, var(--emerald-900) 60%, var(--ink-950) 100%) !important;
  padding: 90px 0 !important;
  overflow: hidden;
}
.page-hero::before, .page-hero::after {
  content: ""; position: absolute; border-radius: 50%;
  filter: blur(40px); pointer-events: none;
}
.page-hero::before {
  width: 380px; height: 380px;
  background: radial-gradient(circle, rgba(21,157,82,.4), transparent 70%);
  top: -120px; left: -100px; animation: orb 20s ease-in-out infinite alternate;
}
.page-hero::after {
  width: 320px; height: 320px;
  background: radial-gradient(circle, rgba(212,164,55,.25), transparent 70%);
  bottom: -100px; right: -80px; animation: orb 26s ease-in-out infinite alternate-reverse;
}
.page-hero h1 {
  font-family: 'Fraunces', Georgia, serif !important;
  font-weight: 700; letter-spacing: -.02em;
  background: linear-gradient(180deg, #fff 0%, var(--gold-300) 130%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
  font-size: clamp(2rem, 5vw, 3.5rem) !important;
}
.page-bread { color: rgba(255,255,255,.75); }
.page-bread a { color: var(--gold-400) !important; }

/* =================== Loan detail hero =================== */
.loan-hero {
  background:
    radial-gradient(circle at 80% 30%, rgba(21,157,82,.12), transparent 50%),
    linear-gradient(135deg, var(--emerald-50) 0%, #fafdfb 70%) !important;
  position: relative; overflow: hidden;
}
.loan-hero h1 { font-family: 'Fraunces', serif !important; letter-spacing: -.02em; }
.loan-hero .badge-tag {
  background: linear-gradient(135deg, rgba(21,157,82,.15), rgba(212,164,55,.1));
  border: 1px solid rgba(21,157,82,.2);
  color: var(--emerald-700) !important;
}
.loan-hero .icon-circle {
  position: relative;
  box-shadow: 0 30px 60px -15px rgba(0,0,0,.3), inset 0 0 0 6px rgba(255,255,255,.15);
  animation: floaty 6s ease-in-out infinite;
}
.loan-hero .icon-circle::after {
  content:""; position:absolute; inset:-14px;
  border: 2px dashed rgba(21,157,82,.3);
  border-radius:50%; animation: spin 22s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* =================== Feature tiles =================== */
.feature-tile {
  background: rgba(255,255,255,.9) !important;
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,.7) !important;
  border-radius: 18px !important;
  transition: all .4s cubic-bezier(.2,.8,.2,1);
  position: relative; overflow: hidden;
}
.feature-tile::before {
  content:""; position:absolute; left:0; top:0; bottom:0; width:3px;
  background: var(--grad-gold); transform: scaleY(0); transform-origin: top;
  transition: transform .4s;
}
.feature-tile:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); border-color: rgba(21,157,82,.2) !important; }
.feature-tile:hover::before { transform: scaleY(1); }
.feature-tile .ico {
  background: linear-gradient(135deg, var(--emerald-50), #fff) !important;
  border: 1px solid rgba(21,157,82,.15);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.5);
  border-radius: 14px;
  transition: all .4s;
}
.feature-tile:hover .ico {
  background: var(--grad-emerald) !important; color: #fff !important;
  transform: rotate(-8deg) scale(1.1);
  box-shadow: 0 14px 28px -6px rgba(21,122,62,.4);
}

/* =================== Stat cards =================== */
.stat-card {
  background: var(--grad-emerald) !important;
  border-radius: 20px !important;
  position: relative; overflow: hidden;
  box-shadow: var(--shadow-md);
  transition: transform .35s;
}
.stat-card:hover { transform: translateY(-4px) scale(1.02); box-shadow: var(--shadow-xl); }
.stat-card::before {
  content:""; position:absolute; top:-50px; right:-50px;
  width:160px; height:160px; border-radius:50%;
  background: radial-gradient(circle, rgba(212,164,55,.3), transparent 60%);
  filter: blur(8px);
}
.stat-card .num {
  font-family: 'Fraunces', serif !important;
  background: linear-gradient(180deg, #fff, var(--gold-300));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}

/* =================== Contact cards =================== */
.contact-card {
  background: rgba(255,255,255,.9) !important;
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,.7) !important;
  border-radius: 20px !important;
  transition: all .4s cubic-bezier(.2,.8,.2,1);
}
.contact-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-xl); border-color: rgba(21,157,82,.2) !important; }
.contact-card .ico-big {
  background: linear-gradient(135deg, var(--emerald-50), #fff) !important;
  border: 1px solid rgba(21,157,82,.15);
  transition: all .4s;
}
.contact-card:hover .ico-big {
  background: var(--grad-emerald) !important; color:#fff !important;
  transform: rotate(-8deg) scale(1.08);
}

/* =================== Content card =================== */
.content-card {
  background: rgba(255,255,255,.9) !important;
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,.7) !important;
  border-radius: 22px !important;
  box-shadow: var(--shadow-md);
}
.bullet-list li { transition: padding-left .25s; }
.bullet-list li:hover { padding-left: 8px; }
.docs-list li {
  background: rgba(233,249,239,.5) !important;
  border: 1px solid rgba(21,157,82,.1);
  border-radius: 12px !important;
  transition: all .25s;
}
.docs-list li:hover {
  background: var(--emerald-50) !important;
  transform: translateX(4px);
  border-color: rgba(21,157,82,.25);
}

/* =================== Legal pages =================== */
.legal-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px; height: 30px;
  background: var(--grad-emerald);
  color: #fff;
  border-radius: 8px;
  font-size: .8rem;
  font-weight: 800;
  margin-right: 8px;
  flex-shrink: 0;
  vertical-align: middle;
}
.content-card h4 { color: var(--ink-900); display: flex; align-items: center; }
.content-card ul li { padding: 2px 0; }
.content-card a.text-success:hover { text-decoration: underline !important; }

/* Footer legal links */
.footer-legal a {
  color: rgba(255,255,255,.5);
  text-decoration: none;
  font-size: .8rem;
  transition: color .2s;
  white-space: nowrap;
}
.footer-legal a:hover { color: var(--gold-400) !important; }

/* =================== Float WA — premium glow =================== */
.float-wa {
  background: linear-gradient(135deg, #25d366, #128c7e) !important;
  box-shadow: 0 14px 36px rgba(37,211,102,.55), inset 0 0 0 2px rgba(255,255,255,.15) !important;
}
.float-wa::before {
  content:""; position:absolute; inset:-6px;
  border-radius:50%; border: 2px solid rgba(37,211,102,.4);
  animation: pulseRing 2s ease-out infinite;
}
@keyframes pulseRing {
  0% { transform: scale(.95); opacity: 1; }
  100% { transform: scale(1.4); opacity: 0; }
}

/* =================== Sticky mobile CTA =================== */
.mobile-cta {
  position: fixed; left: 12px; right: 12px; bottom: 14px;
  z-index: 998; display: none;
  gap: 10px;
}
.mobile-cta a {
  flex: 1; padding: 14px 8px;
  border-radius: 14px; text-align: center;
  font-weight: 800; font-size: .85rem;
  text-decoration: none; color: #fff;
  display: flex; align-items: center; justify-content: center; gap: 6px;
  box-shadow: 0 14px 30px rgba(5,46,26,.25);
  backdrop-filter: blur(12px);
}
.mobile-cta .cta-call  { background: var(--grad-emerald); }
.mobile-cta .cta-apply { background: var(--grad-gold); color: #2a1a00; }
.mobile-cta .cta-wa    { background: linear-gradient(135deg, #25d366, #128c7e); }

@media (max-width: 767px) {
  .mobile-cta { display: flex; }
  body { padding-bottom: 76px; }
  .float-wa { display: none; }
}

/* =================== Scroll-reveal motion =================== */
[data-aos] { opacity:0; transform: translateY(28px); transition: opacity .9s cubic-bezier(.2,.8,.2,1), transform .9s cubic-bezier(.2,.8,.2,1); }
[data-aos].aos-animate { opacity:1; transform: translateY(0); }
[data-aos="fade-right"]  { transform: translateX(-30px); }
[data-aos="fade-left"]   { transform: translateX(30px); }
[data-aos="fade-right"].aos-animate, [data-aos="fade-left"].aos-animate { transform: translateX(0); }
[data-aos="zoom-in"]     { transform: scale(.9); opacity:0; }
[data-aos="zoom-in"].aos-animate { transform: scale(1); opacity:1; }

/* Subtle parallax on hero illustration via JS sets --py */
.hero-section .col-lg-7::after { transform: translateY(calc(var(--py, 0) * 1px)); }

/* Mobile fine-tune */
@media (max-width: 767px) {
  .page-hero { padding: 56px 0 !important; }
  .charge-box { padding: 14px 16px; }
  .loan-card { padding: 24px 16px 20px !important; }
}