:root {
  --brand-yellow: #ff0000;
  --hero-bg-1: #0f1115;
  --hero-bg-2: #1b2028;
}

body {
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  color: #151515;
}
.text-red {
    --bs-text-opacity: 1;
    color: #ff0000;
}
.py-lg-6 {
  padding-top: 5rem;
  padding-bottom: 5rem;
}

.skip-link {
  position: absolute;
  top: .5rem;
  left: .5rem;
  z-index: 1050;
  background: #fff;
  padding: .5rem .75rem;
  border-radius: .5rem;
}

.brand-mark {
  width: 2rem;
  height: 2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: var(--brand-yellow);
  color: #111;
  font-weight: 800;
  font-size: .8rem;
}

.hero-section {
  background:
    radial-gradient(circle at 85% 20%, rgba(255, 7, 7, 0.15), transparent 40%),
    linear-gradient(180deg, var(--hero-bg-2), var(--hero-bg-1));
}

.eyebrow {
  text-transform: uppercase;
  letter-spacing: .1em;
  font-size: .85rem;
  font-weight: 700;
}

.hero-card {
  background: rgba(255,255,255,.95);
  border: 1px solid rgba(255,255,255,.1);
}

.hero-media {
  min-height: 260px;
  background: linear-gradient(135deg, #f2f2f2, #dddddd);
}

.placeholder-bike {
  font-size: 2.5rem;
}

.stat-box {
  border: 1px solid #e7e7e7;
  border-radius: .9rem;
  padding: .9rem;
  background: #fff;
}

.stat-value {
  font-weight: 800;
}

.stat-label {
  color: #6c757d;
  font-size: .9rem;
}

.pain-point {
  background: #fff;
  border: 1px solid #ececec;
  border-left: 4px solid var(--brand-yellow);
  border-radius: .75rem;
  padding: .9rem 1rem;
  font-weight: 600;
  height: 100%;
}

.feature-card {
  background: #fff;
  border: 1px solid #eee;
  border-radius: 1rem;
  padding: 1.1rem;
  box-shadow: 0 .35rem 1rem rgba(0,0,0,.04);
}

.feature-icon {
  font-size: 1.5rem;
  margin-bottom: .5rem;
}

.faq-accordion .accordion-item {
  background: transparent;
  border-color: rgba(255,255,255,.14);
}

.faq-accordion .accordion-button,
.faq-accordion .accordion-body {
  background: transparent;
  color: #fff;
}

.faq-accordion .accordion-button:not(.collapsed) {
  box-shadow: none;
  color: #111;
  background: var(--brand-yellow);
}

.faq-accordion .accordion-button::after {
  filter: invert(1);
}

.faq-accordion .accordion-button:not(.collapsed)::after {
  filter: none;
}

.cta-panel {
  background: linear-gradient(180deg, #fff, #f4f4f4);
  border: 1px solid #ebebeb;
}

pre {
  white-space: pre-wrap;
}