/* WalkList brand overrides — loaded AFTER styles.css.
   Repoints the stock SB-UI-Kit blue to WalkList's safety-orange/charcoal palette.
   Primary accent: #F4622E (safety orange). Deep background: #1C2331 (charcoal slate).
   The vendored styles.css is left untouched. */

:root {
  --pp-orange: #F4622E;
  --pp-orange-dark: #D9501F;
  --pp-orange-light: #FEE9E1;
  --pp-charcoal: #1C2331;
  --pp-slate: #2E3A4E;
  --bs-primary: #F4622E;
  --bs-primary-rgb: 244, 98, 46;
  --bs-primary-soft: #FEE9E1;
  --bs-primary-soft-rgb: 254, 233, 225;
}

/* Navbar */
.navbar-marketing .navbar-brand {
  font-size: 1.25rem;
  letter-spacing: -0.01em;
  color: var(--pp-charcoal) !important;
}
.navbar-marketing .nav-link {
  font-weight: 500;
  color: #374151 !important;
}
.navbar-marketing .nav-link:hover {
  color: var(--pp-orange) !important;
}

/* Hero / pricing-pro / CTA gradient */
.bg-gradient-primary-to-secondary {
  background-color: var(--pp-charcoal) !important;
  background-image: linear-gradient(135deg, #1C2331 0%, #2E3A4E 60%, #3D4E68 100%) !important;
}

/* Solid primary buttons */
.btn-primary {
  --bs-btn-bg: #F4622E;
  --bs-btn-border-color: #F4622E;
  --bs-btn-color: #fff;
  --bs-btn-hover-bg: #D9501F;
  --bs-btn-hover-border-color: #D9501F;
  --bs-btn-hover-color: #fff;
  --bs-btn-focus-shadow-rgb: 244, 98, 46;
  --bs-btn-active-bg: #C04419;
  --bs-btn-active-border-color: #C04419;
  --bs-btn-disabled-bg: #F4622E;
  --bs-btn-disabled-border-color: #F4622E;
}

/* Outline primary buttons */
.btn-outline-primary {
  --bs-btn-color: #F4622E;
  --bs-btn-border-color: #F4622E;
  --bs-btn-hover-bg: #F4622E;
  --bs-btn-hover-border-color: #F4622E;
  --bs-btn-hover-color: #fff;
  --bs-btn-focus-shadow-rgb: 244, 98, 46;
  --bs-btn-active-bg: #F4622E;
  --bs-btn-active-border-color: #F4622E;
  --bs-btn-disabled-color: #F4622E;
  --bs-btn-disabled-border-color: #F4622E;
}

/* Text primary */
.text-primary {
  color: var(--pp-orange) !important;
}

/* Icon stacks (feature cards) */
.icon-stack.bg-gradient-primary-to-secondary {
  background-color: var(--pp-orange) !important;
  background-image: linear-gradient(135deg, #F4622E 0%, #D9501F 100%) !important;
}

/* How It Works step circles */
.bg-primary {
  background-color: var(--pp-orange) !important;
}

/* Pricing highlight card */
.bg-gradient-primary-to-secondary.text-white .btn-white {
  color: var(--pp-orange) !important;
}

/* Footer */
.footer.bg-dark {
  background-color: var(--pp-charcoal) !important;
}

/* Hero typography — stronger presence */
.page-header-ui-title {
  font-size: 3rem;
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -0.02em;
}
@media (min-width: 992px) {
  .page-header-ui-title {
    font-size: 3.75rem;
  }
}

/* Feather icon color in feature rows */
.text-primary[data-feather] {
  color: var(--pp-orange) !important;
}

/* Step number badge — bold orange circle */
.pp-step-circle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--pp-orange);
  color: #fff;
  font-weight: 800;
  font-size: 1.15rem;
  margin-bottom: 1rem;
}

/* App mock inner accent */
.pp-mock-header {
  background: linear-gradient(135deg, #1C2331 0%, #2E3A4E 100%);
  color: #fff;
  padding: 3.5rem 1.1rem 1.4rem;
}
.pp-mock-badge-open {
  background: #FEE9E1;
  color: #9A3412;
  font-size: .58rem;
}
.pp-mock-badge-done {
  background: #D1FAE5;
  color: #065F46;
  font-size: .58rem;
}
.pp-mock-badge-critical {
  background: #FEE2E2;
  color: #991B1B;
  font-size: .58rem;
}

/* Tagline sub-text in hero */
.pp-hero-note {
  font-size: .8rem;
  opacity: .75;
  margin-top: .75rem;
}

/* Pricing badge */
.pp-badge-popular {
  background: var(--pp-orange);
  color: #fff;
  font-size: .65rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: .25rem .65rem;
  border-radius: 999px;
  display: inline-block;
  margin-bottom: .75rem;
}