/* VALUEPLUS website brand polish */
:root {
  --brand-ink: #172033;
  --brand-blue: #1a5fd4;
  --brand-blue-2: #2d8cff;
  --brand-gold: #b8956a;
  --brand-surface: #ffffff;
  --brand-page: #f6f8fb;
  --brand-line: #dbe5f0;
}

body {
  background: linear-gradient(180deg, #ffffff 0, var(--brand-page) 360px), var(--brand-page);
}

.site-header {
  border-bottom-color: rgba(219, 229, 240, 0.9);
}

.nav-links a {
  border-bottom: 2px solid transparent;
}

.nav-links a:hover,
.nav-links a.active {
  border-bottom-color: rgba(26, 95, 212, 0.5);
}

.hero {
  background: linear-gradient(135deg, rgba(248, 250, 252, 0.98), rgba(238, 245, 255, 0.94) 48%, rgba(251, 246, 237, 0.9)), #f8fafc;
}

.hero::after {
  display: none;
}

.hero-badge,
.eyebrow {
  letter-spacing: 0;
}

.hero h1,
.section-head h2 {
  color: var(--brand-ink);
}

.hero-metric {
  border-color: rgba(26, 95, 212, 0.2);
  background: linear-gradient(135deg, rgba(26, 95, 212, 0.08), rgba(184, 149, 106, 0.1));
}

.hero-img-wrap,
.card,
.tool-embed-wrap,
.salary-promo-text {
  border-color: rgba(219, 229, 240, 0.95) !important;
  box-shadow: 0 8px 28px rgba(23, 32, 51, 0.08) !important;
}

.btn {
  min-height: 40px;
  white-space: normal;
}

.btn-primary {
  background: linear-gradient(135deg, var(--brand-blue), var(--brand-blue-2));
}

.btn-gold {
  background: linear-gradient(135deg, #c9a962, var(--brand-gold));
}

.stats-row {
  background: var(--brand-surface);
  border: 1px solid var(--brand-line);
  border-radius: 12px;
  box-shadow: 0 6px 22px rgba(23, 32, 51, 0.06);
  padding: 1rem;
}

.stats-row .num {
  color: var(--brand-blue);
}

.service-card,
.case-card,
.industry-card {
  position: relative;
}

.service-card::before,
.case-card::before,
.industry-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  border-radius: 12px 0 0 12px;
  background: linear-gradient(180deg, var(--brand-blue), var(--brand-gold));
  opacity: 0;
  transition: opacity 0.2s ease;
}

.service-card:hover::before,
.case-card:hover::before,
.industry-card:hover::before {
  opacity: 1;
}

.salary-promo {
  align-items: stretch;
}

.salary-promo-text {
  background: linear-gradient(180deg, rgba(238, 245, 255, 0.85), #ffffff 44%), #ffffff;
}

.benefit-list li::before {
  color: var(--brand-blue);
}

.trust-bar span,
.salary-mobile-tags span,
.tag,
.about-badges span {
  border: 1px solid rgba(26, 95, 212, 0.12);
  background: rgba(255, 255, 255, 0.72);
  border-radius: 999px;
  padding: 0.2rem 0.55rem;
}

@media (max-width: 768px) {
  .hero {
    padding-top: 2rem;
  }

  .hero-cta .btn {
    width: 100%;
  }

  .stats-row {
    border-radius: 10px;
  }
}