/* ============================================================
   AsFin — Kustomisasi tema landing (override Softland)
   Palet brand: biru #3a5a8a / #4a6fa5 / #7aa0cf, aksen #ffc107
   ============================================================ */

:root {
  --asfin-dark:   #2b3a52;
  --asfin-blue:   #3a5a8a;
  --asfin-mid:    #4a6fa5;
  --asfin-light:  #7aa0cf;
  --asfin-accent: #ffc107;
  --asfin-bg:     #f4f7fb;
  --asfin-muted:  #6b7a90;
}

/* ---------- Warna dasar & tipografi ---------- */
body { color: var(--asfin-dark); }
h1, h2, h3, h4, h5, h6 { color: var(--asfin-dark); }
.text-primary { color: var(--asfin-blue) !important; }
.text-muted { color: var(--asfin-muted) !important; }
.text-success { color: #1e9e6a !important; }
.bg-primary { background-color: var(--asfin-blue) !important; }
.bg-light { background-color: var(--asfin-bg) !important; }

/* ---------- Tombol ---------- */
.btn { border-radius: 30px; letter-spacing: .4px; }
.btn-primary {
  background: linear-gradient(135deg, var(--asfin-mid), var(--asfin-blue)) !important;
  border-color: var(--asfin-blue) !important;
  box-shadow: 0 8px 20px -6px rgba(58, 90, 138, .55);
}
.btn-primary:hover, .btn-primary:focus {
  background: linear-gradient(135deg, var(--asfin-blue), #2c4670) !important;
  border-color: #2c4670 !important;
  box-shadow: 0 10px 24px -6px rgba(58, 90, 138, .7);
  transform: translateY(-3px);
}
.btn-outline-primary {
  color: var(--asfin-blue) !important;
  border-color: var(--asfin-blue) !important;
  background: transparent !important;
}
.btn-outline-primary:hover, .btn-outline-primary:focus {
  background: var(--asfin-blue) !important;
  color: #fff !important;
  box-shadow: 0 8px 18px -6px rgba(58, 90, 138, .5);
  transform: translateY(-3px);
}
/* CTA utama pakai aksen kuning (hero & pricing PRO) */
.btn-accent {
  background: linear-gradient(135deg, #ffc107, #f0a500) !important;
  border-color: #f0a500 !important;
  color: #2b3a52 !important;
  font-weight: 600;
  box-shadow: 0 8px 20px -6px rgba(240, 165, 0, .55);
}
.btn-accent:hover, .btn-accent:focus {
  background: linear-gradient(135deg, #f0a500, #d99400) !important;
  border-color: #d99400 !important;
  color: #2b3a52 !important;
  transform: translateY(-3px);
  box-shadow: 0 10px 24px -6px rgba(240, 165, 0, .7);
}

/* ---------- Navbar ---------- */
.navbar-custom { padding: 14px 0; }
.navbar-custom.navbar-white .navbar-nav li a { color: var(--asfin-dark) !important; font-weight: 500; }
.navbar-custom.navbar-white .navbar-nav li.active a,
.navbar-custom.navbar-white .navbar-nav li a:hover,
.navbar-custom.navbar-white .navbar-nav li a:focus,
.navbar-custom.navbar-white .navbar-nav li a:active { color: var(--asfin-blue) !important; }
/* Latar navbar translusen agar tetap terbaca di atas hero gelap */
.navbar-custom.navbar-white { background: rgba(255, 255, 255, .94) !important; backdrop-filter: blur(8px); }
.is-sticky.navbar-custom { background: #ffffff !important; box-shadow: 0 3px 12px rgba(58, 90, 138, .12); }
/* Tombol di navbar tidak ikut aturan link biasa */
.navbar-custom .btn,
.navbar-custom .btn a { color: inherit !important; }
.navbar-custom .btn-outline-primary {
  color: var(--asfin-blue) !important;
  border-color: var(--asfin-blue) !important;
  background: transparent !important;
}
.navbar-custom .btn-outline-primary:hover {
  background: var(--asfin-blue) !important;
  color: #fff !important;
  box-shadow: 0 8px 18px -6px rgba(58, 90, 138, .5);
  transform: translateY(-2px);
}
.navbar-custom .btn-accent { color: #2b3a52 !important; }
/* Tombol navbar ghost: tanpa border & tanpa background */
.navbar-custom .btn-ghost {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--asfin-blue) !important;
  font-weight: 500;
  padding: 8px 14px;
}
.navbar-custom .btn-ghost:hover,
.navbar-custom .btn-ghost:focus {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--asfin-mid) !important;
  text-decoration: underline;
  transform: none;
}
.navbar-custom .btn-ghost-strong { font-weight: 700; color: var(--asfin-dark) !important; }
.navbar-custom .btn-ghost-strong:hover { color: var(--asfin-blue) !important; }

/* ---------- Hero ---------- */
.bg-home {
  background: linear-gradient(150deg, #2b3a52 0%, var(--asfin-blue) 55%, var(--asfin-mid) 100%);
}
.bg-overlay {
  background-image: radial-gradient(circle at 20% 30%, rgba(255, 255, 255, .08) 0, transparent 45%),
                    radial-gradient(circle at 80% 75%, rgba(255, 193, 7, .12) 0, transparent 40%);
  opacity: 1;
  animation: none;
}
.home-title h1 { color: #ffffff !important; }
.home-title p { color: rgba(255, 255, 255, .82) !important; }
.home-title .text-primary { color: var(--asfin-accent) !important; }
/* Kartu dashboard di hero */
.home-title .card,
.home-img .card { border: 0; border-radius: 16px; box-shadow: 0 14px 34px rgba(12, 24, 48, .25) !important; }
.home-img .display-3 { color: var(--asfin-mid) !important; }

/* ---------- Judul section & fitur ---------- */
.section .title { font-weight: 600; }
.features { transition: all .3s ease; }
.features:hover { transform: translateY(-6px); }
.features i {
  font-size: 2.2rem;
  color: var(--asfin-blue);
  display: inline-block;
  width: 70px; height: 70px; line-height: 70px;
  background: rgba(58, 90, 138, .10);
  border-radius: 16px;
}
.feature-primary i { color: var(--asfin-blue) !important; }
.features h6 { color: var(--asfin-dark); font-weight: 600; }

/* ---------- Pricing ---------- */
.price-item {
  border: 1px solid #e4ebf5 !important;
  border-radius: 18px;
  transition: all .3s ease;
  background: #ffffff;
}
.price-item:hover { transform: translateY(-6px); box-shadow: 0 16px 36px rgba(58, 90, 138, .14) !important; }
.price-item.active {
  border: 2px solid var(--asfin-blue) !important;
  box-shadow: 0 16px 40px rgba(58, 90, 138, .22) !important;
  background: linear-gradient(180deg, #ffffff, #f7faff);
}
.price-item.active .pricing-title,
.price-item .pricing-title { color: var(--asfin-dark); }
.price-item h5 { font-weight: 700; }
.price-item h2 { color: var(--asfin-blue); font-weight: 700; }
.price-item.active h5 { color: var(--asfin-blue); }

/* ---------- FAQ ---------- */
.faq-accordion .accordion-item { border: 1px solid #e4ebf5 !important; border-radius: 12px !important; margin-bottom: .75rem; overflow: hidden; }
.faq-accordion .accordion-button { color: var(--asfin-dark); font-weight: 600; background: #fff; }
.faq-accordion .accordion-button:not(.collapsed) { color: var(--asfin-blue); background: rgba(58, 90, 138, .06); box-shadow: none; }
.faq-accordion .accordion-button:focus { box-shadow: none; border-color: transparent; }
.faq-accordion .accordion-button::after { filter: hue-rotate(200deg) saturate(1.4); }
.faq-accordion .accordion-body { color: var(--asfin-muted); }

/* ---------- Form kontak ---------- */
.form-control {
  border-radius: 30px;
  border: 1px solid #dfe7f2;
  color: var(--asfin-dark);
}
.form-control:focus { border-color: var(--asfin-mid); box-shadow: 0 0 0 .2rem rgba(74, 111, 165, .15) !important; }

/* ---------- Footer ---------- */
.footer { background: #2b3a52; color: rgba(255,255,255,.75); padding: 22px 0; }
.footer p { color: rgba(255,255,255,.75); }
.footer .social-icon {
  display: inline-block; width: 36px; height: 36px; line-height: 36px;
  background: rgba(255,255,255,.08); color: #fff !important;
  border-radius: 50%; text-align: center; transition: all .3s;
}
.footer .social-icon:hover { background: var(--asfin-accent); color: #2b3a52 !important; transform: translateY(-3px); }