body.theme-running {
  --run-navy: #142036;
  --run-green: #244534;
  --run-coral: #d66f4d;
  --run-cream: #f5f4ef;
  background:
    linear-gradient(115deg, rgba(214, 111, 77, 0.08) 0 12%, transparent 12% 100%),
    var(--run-cream);
  font-family: "Arial", "Helvetica Neue", system-ui, sans-serif;
}

.theme-running h1,
.theme-running h2,
.theme-running h3,
.theme-running .brand strong {
  font-family: "Arial", "Helvetica Neue", system-ui, sans-serif;
  letter-spacing: -0.04em;
  text-transform: uppercase;
}

.theme-running .hero {
  background:
    linear-gradient(115deg, rgba(214, 111, 77, 0.22), transparent 34%),
    linear-gradient(135deg, var(--run-navy) 0%, var(--run-green) 58%, #d66f4d 145%);
  color: #ffffff;
}

.theme-running h1 {
  max-width: 12ch;
  font-size: clamp(3rem, 7vw, 5.8rem);
}

.theme-running .service-card,
.theme-running .area-panel,
.theme-running .faq-card {
  border-radius: 0;
  border-top: 0.45rem solid var(--run-coral);
  background: #ffffff;
  box-shadow: none;
}

.theme-running .section-soft {
  background: var(--run-navy);
  color: #ffffff;
}

.theme-running .section-soft p,
.theme-running .section-soft li {
  color: rgba(255, 255, 255, 0.76);
}

.theme-running .steps-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.theme-running .button {
  border-radius: 0;
  text-transform: uppercase;
}

.theme-running .button-primary {
  background: var(--run-coral);
}