/* ---------- Page hero image ---------- */
.page-hero--help {
  background:
    linear-gradient(rgba(8, 47, 34, 0.82), rgba(11, 63, 45, 0.86)),
    url("../../assets/images/how-we-help-hero.jpg") 25% center / cover no-repeat,
    var(--color-green-700);
}

/* ---------- Intro + jump links ---------- */
.services-intro { text-align: center; }
.services-lead { font-family: var(--font-heading); font-size: var(--text-md); color: var(--color-primary); }

.service-jump { list-style: none; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-xs); margin-top: var(--space-xl); }
.service-jump a {
  display: inline-block; padding: 0.4rem 1rem; border: 1px solid var(--color-gold-400); border-radius: var(--radius-pill);
  font-size: var(--text-sm); text-decoration: none; color: var(--color-primary); background: var(--color-white);
  transition: background-color var(--transition);
}
.service-jump a:hover { background: var(--color-gold-100); color: var(--color-primary); }

/* ---------- Service detail blocks ---------- */
.service-detail { scroll-margin-top: 90px; }
.service-detail-inner { display: grid; gap: var(--space-xl); }

.service-number {
  display: block; font-family: var(--font-heading); font-size: clamp(2.5rem, 2rem + 2vw, 3.5rem);
  line-height: 1; color: var(--color-gold-500); margin-bottom: var(--space-sm);
}
.service-detail h2 { margin-bottom: var(--space-md); }
.service-summary { font-family: var(--font-heading); color: var(--color-primary); font-size: var(--text-md); }

/* Fee panel */
.fee-panel {
  margin-top: var(--space-lg); padding: var(--space-md) var(--space-lg);
  background: var(--color-gold-100); border-left: 4px solid var(--color-gold-500); border-radius: var(--radius-sm);
}
.fee-panel h3 { font-family: var(--font-body); font-size: var(--text-xs); font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-gold-600); margin-bottom: var(--space-xs); }
.fee-list { list-style: none; padding: 0; display: grid; gap: var(--space-2xs); }
.fee-list li { display: flex; justify-content: space-between; gap: var(--space-md); flex-wrap: wrap; }
.fee-list strong { font-family: var(--font-heading); font-weight: 400; color: var(--color-primary); white-space: nowrap; }
.fee-note { margin-top: var(--space-xs); font-size: var(--text-sm); color: var(--color-text-muted); }

/* Content column */
.service-body h3 { font-size: var(--text-md); margin-bottom: var(--space-sm); }
.service-body .chevron-list { margin-top: 0; }
.service-body > * + h3 { margin-top: var(--space-xl); }

/* "What we don't do" panel */
.limits-panel {
  margin-top: var(--space-xl); padding: var(--space-lg);
  background: var(--color-white); border: 1px solid var(--color-border); border-top: 4px solid var(--color-green-700);
  border-radius: var(--radius-sm);
}
.section--alt .limits-panel { background: var(--color-white); }
.limits-list { list-style: none; padding: 0; display: grid; gap: var(--space-xs); margin-block: var(--space-sm); }
.limits-list li { position: relative; padding-left: 1.6rem; }
.limits-list li::before {
  content: "\2715"; position: absolute; left: 0; top: 0.05em;
  color: var(--color-green-700); font-size: 0.85em; font-weight: 700;
}

@media (min-width: 768px) {
  .service-detail-inner { grid-template-columns: 5fr 7fr; gap: var(--space-3xl); align-items: start; }
}

/* ---------- Closing CTA ---------- */
.services-cta { text-align: center; }
.services-cta h2 { margin-bottom: var(--space-md); }
.services-cta .btn { margin-top: var(--space-lg); }
