:root {
  --blue: #ff5a1f;
  --blue2: #ffad66;
  --ink: #080706;
  --panel: #12100e;
  --panel2: #191512;
  --text: #fff8f2;
  --muted: #b5a79d;
  --line: rgba(255, 214, 184, .13);
  --display: 'Saira Condensed', sans-serif;
  --body: 'Manrope', sans-serif;
}

body {
  font-kerning: normal;
  text-rendering: optimizeLegibility;
}

.inspection-highlight { max-width: 590px; padding: 12px 16px; margin: 18px 0; border-left: 3px solid var(--blue); background: rgba(255,90,31,.09); color: #e5d4c6; font-size: 13px; line-height: 1.6; }
.inspection-highlight strong { color: var(--blue2); letter-spacing: 1px; font-size: 11px; }
.service-card.inspection { min-height: 410px; }
@media (max-width:650px) { .hero { min-height: 940px; } }

h1, h2 {
  font-weight: 900;
  letter-spacing: -1.5px;
}

.service-card h3,
.step strong,
.form h3 {
  letter-spacing: .15px;
}

.hero-media {
  filter: grayscale(.75) contrast(1.08) brightness(.88);
}

.hero-shade {
  background: linear-gradient(90deg, rgba(8, 7, 6, .99) 0%, rgba(8, 7, 6, .88) 40%, rgba(8, 7, 6, .27) 72%, rgba(8, 7, 6, .7) 100%), linear-gradient(0deg, #080706 0%, transparent 38%);
}

.service-card.featured {
  background: linear-gradient(145deg, #ed4b12, #a72b07);
}

.service-card.roadside {
  background: linear-gradient(145deg, #211812, #100d0b);
  box-shadow: inset 0 3px 0 var(--blue);
}

.service-card.roadside .icon {
  background: var(--blue);
  color: #fff;
  border-color: var(--blue);
}

.contact {
  background: radial-gradient(circle at 15% 60%, rgba(255, 90, 31, .15), transparent 32%), #080706;
}