/* Middlesbrough additions to the shared vehicle delivery design. */
.car-delivary-hero::before {
  background-image: linear-gradient(90deg, rgba(8, 24, 42, .78), rgba(8, 24, 42, .23)), url('/v3/middlesbrough-car-transport/middlesbrough-transporter-bridge.webp');
}
.car-delivary-hero .how-info-description p { color: #fff; opacity: 1; }
.covarage-list span { display: inline-block; padding: 12px 15px; border: 1px solid #ffffff99; border-radius: 8px; color: #fff; font-weight: 500; font-size: 14px; }
.profile-wrap .leicester-transporter-portrait { width: 45px; height: 45px; flex: 0 0 45px; border-radius: 50%; object-fit: cover; object-position: center 20%; }
.benefit-right img { width: 100%; height: auto; border-radius: 8px; }
.hero-thum-two > img { object-fit: contain; }
@media (max-width: 767px) {
  .car-delivary-hero::before { background-image: linear-gradient(180deg, rgba(8, 24, 42, .8), rgba(8, 24, 42, .3)), url('/v3/middlesbrough-car-transport/middlesbrough-transporter-bridge-mobile.webp'); }
  .how-info-content h1 { font-size: 36px; overflow-wrap: anywhere; }
}

/* Local booking examples use the recovery page's existing card treatment. */
.how-works-area.middlesbrough-bookings {
  padding-top: 24px;
}
.middlesbrough-bookings .expertise-card {
  height: 100%;
}
.middlesbrough-bookings .row {
  margin-bottom: 24px;
}
.middlesbrough-bookings .card__1 h3 {
  color: #ee7f1e;
}
.middlesbrough-bookings p.small {
  color: #5f6e83;
}
.middlesbrough-booking-action {
  margin-top: 32px;
}

/* Homepage heading and transporter-count ring. */
.how-works-area .how-works-heading h2 {
  color: #005aba;
  font-size: 36px;
  line-height: 1.25;
  letter-spacing: 0;
  margin-bottom: 12px;
}
.how-works-area .how-works-heading h2 .text-accent {
  display: inline;
  color: #ff7800;
}
.how-works-area .how-works-heading h2::after {
  content: "";
  display: block;
  width: 50px;
  height: 2px;
  background: linear-gradient(to right, #ff7800 0, #ff7800 47%, transparent 47%, transparent 57%, #ff7800 57%, #ff7800 100%);
  margin: 24px auto 0;
}
.how-works-area .how-works-heading p {
  color: #092440;
  font-size: 18px;
  line-height: 1.6;
  margin: 0 auto;
  max-width: 1000px;
}
.how-works-heading .transporter-count-ring {
  display: inline-block;
  padding: 1px 8px;
  border: 2px solid #ee7f1e;
  border-radius: 50%;
  white-space: nowrap;
}
@media (min-width: 992px) and (max-width: 1199px) {
  .how-works-area .how-works-heading h2 { font-size: 32px; }
}
@media (max-width: 767px) {
  .how-works-area .how-works-heading h2 { font-size: 28px; }
  .how-works-area .how-works-heading p { font-size: 16px; }
}