/* Quickcash Loans shared redesign layer */
:root {
  --navy: #0b1018;
  --navy-light: #111827;
  --navy2: #111827;
  --navy3: #162033;
  --gold: #0f8fc5;
  --gold-light: #28a9dc;
  --gold2: #087aa8;
  --gold3: #54c4e8;
  --gold-dark: #087aa8;
  --cream: #f7fbfd;
  --cream2: #edf7fb;
  --cream-dark: #e6f2f7;
  --bg: #f7fbfd;
  --bd: #d7e7ee;
  --tx: #182230;
  --tl: #66778a;
  --text-muted: #6b7b8f;
  --white: #ffffff;
  --transition: 0.25s ease;
}

html {
  scroll-padding-top: 86px;
}

body {
  color: #182230;
  background:
    radial-gradient(circle at 10% 0%, rgba(15, 143, 197, 0.08), transparent 34rem),
    linear-gradient(180deg, #ffffff 0%, #f7fbfd 45%, #eef7fb 100%);
}

a {
  transition: color 0.2s ease, background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

#navbar,
.navbar,
.nav {
  background: rgba(255, 255, 255, 0.96) !important;
  border-bottom: 1px solid rgba(15, 143, 197, 0.18) !important;
  box-shadow: 0 12px 38px rgba(11, 16, 24, 0.08);
}

.nav-inner {
  min-height: 74px;
}

.nav-logo,
.logo {
  display: inline-flex;
  align-items: center;
  padding: 8px 12px;
  border-radius: 8px;
  background: #ffffff;
}

.nav-logo img,
.logo-img,
.logo img,
.footer-brand img {
  max-height: 48px;
  width: auto;
  object-fit: contain;
}

.nav-links a,
.nav-right,
.nav-right a {
  color: #172033 !important;
}

.nav-links a:hover,
.nav-right a:hover {
  color: #0f8fc5 !important;
}

.hamburger span {
  background: #0f8fc5 !important;
}

.mobile-menu,
.nav-links.open {
  background: rgba(255, 255, 255, 0.98) !important;
  border-color: rgba(15, 143, 197, 0.24) !important;
}

.mobile-menu a,
.nav-links.open a {
  color: #172033 !important;
}

#hero,
.hero,
.page-hero {
  background:
    linear-gradient(135deg, rgba(11, 16, 24, 0.88), rgba(15, 143, 197, 0.65)),
    url("https://images.unsplash.com/photo-1554224155-8d04cb21cd6c?w=1600&h=1000&fit=crop") center/cover no-repeat !important;
}

.hero-overlay {
  background: linear-gradient(135deg, rgba(11, 16, 24, 0.9), rgba(7, 122, 168, 0.68)) !important;
}

.hero-badge,
.section-label {
  color: #0f8fc5 !important;
}

.hero-badge {
  background: rgba(255, 255, 255, 0.92) !important;
  border: 1px solid rgba(15, 143, 197, 0.28) !important;
  box-shadow: 0 14px 38px rgba(11, 16, 24, 0.18);
}

.hero-title,
.page-hero h1,
.hero h1 {
  letter-spacing: 0 !important;
}

.hero-title span,
.hero h1 span {
  color: #54c4e8 !important;
}

.hero-sub,
.page-hero p,
.hero p {
  color: rgba(255, 255, 255, 0.82) !important;
}

.btn,
.btn-primary,
.btn-nav,
.nav-cta,
.btn-white,
.product-link,
button[type="submit"] {
  border-radius: 8px !important;
}

.btn-primary,
.btn-nav,
.nav-cta,
.btn,
.success a,
.cta-card,
.phone-box {
  background: linear-gradient(135deg, #0f8fc5, #087aa8) !important;
  border-color: #0f8fc5 !important;
  color: #ffffff !important;
  box-shadow: 0 12px 28px rgba(15, 143, 197, 0.28) !important;
}

.btn-primary:hover,
.btn-nav:hover,
.nav-cta:hover,
.btn:hover,
.success a:hover {
  background: linear-gradient(135deg, #28a9dc, #0f8fc5) !important;
  color: #ffffff !important;
  transform: translateY(-2px);
}

.btn-outline {
  border-color: #0f8fc5 !important;
  color: #0f8fc5 !important;
  background: transparent !important;
}

.btn-outline:hover {
  background: #0f8fc5 !important;
  color: #ffffff !important;
}

#products,
#testimonials,
#faq,
.main,
.form-section {
  background: #f7fbfd !important;
}

#how,
#stats,
#cta-banner,
#footer,
.footer,
.ft {
  background: #0b1018 !important;
}

.product-card,
.testimonial-card,
.contact-card,
.accordion-item,
.form-wrapper,
.form-card,
.content,
.card,
.panel,
.info-box,
.side-card {
  border-radius: 8px !important;
  border-color: rgba(15, 143, 197, 0.18) !important;
  box-shadow: 0 18px 48px rgba(24, 34, 48, 0.1) !important;
}

.product-card,
.testimonial-card,
.contact-card,
.accordion-item,
.form-wrapper,
.form-card,
.content,
.card,
.panel {
  background: #ffffff !important;
}

.product-card:hover,
.testimonial-card:hover,
.contact-card:hover,
.info-box:hover,
.side-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 24px 60px rgba(15, 143, 197, 0.16) !important;
}

.product-card::before {
  background: rgba(15, 143, 197, 0.08) !important;
}

.product-card h3,
.contact-card h3,
.accordion-btn,
.section-title,
.step-title,
.form-card h2,
.content h1,
.content h2,
.card h2,
.panel h2 {
  color: #0b1018 !important;
}

.product-range,
.trust-icon,
.contact-icon,
.step-icon-wrap,
.quote-mark,
.stars,
.success-icon,
.success .icon,
.nav-right i,
.secure i,
.info-box h4,
.side-card h4,
.info-box h4 i,
.side-card h4 i,
.info-box li i,
.side-card li i {
  color: #0f8fc5 !important;
}

.product-features li::before {
  content: "\2713" !important;
  color: #0f8fc5 !important;
}

.form-group input,
.form-group select,
.form-group textarea,
input,
select,
textarea {
  border-color: #d7e7ee !important;
  border-radius: 8px !important;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus,
input:focus,
select:focus,
textarea:focus {
  border-color: #0f8fc5 !important;
  box-shadow: 0 0 0 4px rgba(15, 143, 197, 0.12) !important;
}

.info-box,
.side-card {
  background: #111827 !important;
}

.info-box p,
.info-box li,
.side-card p,
.side-card li {
  color: rgba(255, 255, 255, 0.74) !important;
}

.footer-social .social-btn,
.social-btn {
  background: rgba(15, 143, 197, 0.12) !important;
  color: #54c4e8 !important;
  border: 1px solid rgba(84, 196, 232, 0.24);
}

.footer-social .social-btn:hover,
.social-btn:hover {
  background: #0f8fc5 !important;
  color: #ffffff !important;
}

#back-top {
  background: #0f8fc5 !important;
  color: #ffffff !important;
  border-radius: 8px !important;
}

@media (max-width: 768px) {
  .nav-logo img,
  .logo-img,
  .logo img {
    max-height: 40px;
  }

  .nav-logo,
  .logo {
    padding: 6px 8px;
  }
}