.driver {
  position: relative !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #05070a !important;
  color: #fff !important;
  scroll-margin-top: 72px !important;
}

body.taxi-home #driver .driver-inner {
  position: relative !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 790px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  overflow: hidden !important;
  isolation: isolate !important;
  background: #05070a !important;
}

.driver .driver-visual {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  border: 0 !important;
  border-radius: 0 !important;
  overflow: hidden !important;
  background: #05070a !important;
}

.driver .driver-visual #driverRouteMap {
  position: absolute !important;
  inset: -2px !important;
  z-index: 0 !important;
  width: calc(100% + 4px) !important;
  height: calc(100% + 4px) !important;
  min-height: 100% !important;
  background: #05070a !important;
  filter: saturate(.82) contrast(1.1) !important;
}

.driver .driver-visual::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 410 !important;
  display: block !important;
  pointer-events: none !important;
  background:
    linear-gradient(90deg, #05070a 0%, rgba(5, 7, 10, .99) 18%, rgba(5, 7, 10, .88) 32%, rgba(5, 7, 10, .40) 54%, rgba(5, 7, 10, .10) 74%, rgba(5, 7, 10, .26) 100%),
    linear-gradient(180deg, rgba(5, 7, 10, .30) 0%, transparent 28%, transparent 65%, rgba(5, 7, 10, .82) 100%) !important;
}

.driver .driver-visual::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 411 !important;
  display: block !important;
  pointer-events: none !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .05), inset 0 -1px rgba(255, 255, 255, .05) !important;
}

.driver .driver-text {
  position: relative !important;
  z-index: 500 !important;
  width: min(900px, 56vw) !important;
  padding: clamp(92px, 8vw, 140px) 0 210px clamp(32px, 7vw, 132px) !important;
}

.driver .driver-text .section-kicker {
  margin: 0 0 22px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #ffc400 !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: .18em !important;
}

.driver .driver-text h2 {
  max-width: 840px !important;
  margin: 0 0 24px !important;
  color: #fff !important;
  font-size: clamp(54px, 4.3vw, 76px) !important;
  font-weight: 900 !important;
  line-height: .96 !important;
  letter-spacing: -.055em !important;
  text-wrap: balance;
}

.driver .driver-text > p {
  max-width: 610px !important;
  margin: 0 0 36px !important;
  color: rgba(236, 239, 244, .72) !important;
  font-size: clamp(16px, 1.15vw, 20px) !important;
  font-weight: 500 !important;
  line-height: 1.55 !important;
}

.driver .driver-text .btn-yellow {
  width: max-content !important;
  min-height: 60px !important;
  margin: 0 !important;
  padding: 0 27px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 13px !important;
  border: 1px solid rgba(255, 255, 255, .18) !important;
  border-radius: 17px !important;
  background: #ffc400 !important;
  color: #08090b !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  box-shadow: 0 18px 42px rgba(255, 196, 0, .18) !important;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease !important;
}

.driver .driver-text .btn-yellow:hover {
  transform: translateY(-2px) !important;
  background: #ffd129 !important;
  box-shadow: 0 22px 48px rgba(255, 196, 0, .25) !important;
}

.driver .driver-text .btn-yellow img {
  width: 18px !important;
  height: 18px !important;
  filter: brightness(0) !important;
}

.driver .driver-list {
  position: absolute !important;
  right: clamp(24px, 4.5vw, 84px) !important;
  bottom: clamp(26px, 3.6vw, 58px) !important;
  left: clamp(24px, 7vw, 132px) !important;
  z-index: 520 !important;
  min-height: 118px !important;
  margin: 0 !important;
  padding: 14px 18px !important;
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 0 !important;
  list-style: none !important;
  border: 1px solid rgba(255, 255, 255, .12) !important;
  border-radius: 25px !important;
  background: rgba(10, 13, 18, .76) !important;
  box-shadow: 0 26px 70px rgba(0, 0, 0, .38), inset 0 1px rgba(255, 255, 255, .05) !important;
  backdrop-filter: blur(22px) saturate(1.1) !important;
  -webkit-backdrop-filter: blur(22px) saturate(1.1) !important;
}

.driver .driver-list li {
  min-width: 0 !important;
  padding: 12px clamp(14px, 2vw, 34px) !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 16px !important;
  border: 0 !important;
  border-right: 1px solid rgba(255, 255, 255, .10) !important;
  color: rgba(236, 239, 244, .68) !important;
  text-align: left !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1.35 !important;
}

.driver .driver-list li:last-child {
  border-right: 0 !important;
}

.driver .driver-list img {
  width: 54px !important;
  height: 54px !important;
  flex: 0 0 54px !important;
  padding: 15px !important;
  border: 1px solid rgba(255, 196, 0, .34) !important;
  border-radius: 18px !important;
  background: rgba(255, 196, 0, .12) !important;
  filter: brightness(0) saturate(100%) invert(78%) sepia(98%) saturate(1615%) hue-rotate(357deg) brightness(103%) contrast(103%) !important;
}

.driver .driver-list span,
.driver .driver-list strong {
  display: block !important;
}

.driver .driver-list strong {
  margin-bottom: 4px !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 850 !important;
}

.driver .driver-online {
  position: absolute !important;
  z-index: 520 !important;
  top: 46% !important;
  right: 26% !important;
  left: auto !important;
  bottom: auto !important;
  min-height: 42px !important;
  padding: 0 16px !important;
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  border: 1px solid rgba(255, 255, 255, .14) !important;
  border-radius: 14px !important;
  background: rgba(10, 13, 18, .78) !important;
  color: #fff !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  box-shadow: 0 16px 34px rgba(0, 0, 0, .35) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}

.driver .driver-online i {
  width: 8px !important;
  height: 8px !important;
  margin: 0 !important;
  border-radius: 50% !important;
  background: #35d07f !important;
  box-shadow: 0 0 0 5px rgba(53, 208, 127, .13), 0 0 18px rgba(53, 208, 127, .45) !important;
}

.driver .driver-route-car {
  width: 54px !important;
  height: 54px !important;
  border: 0 !important;
  background: transparent !important;
}

.driver .driver-route-car img {
  width: 54px !important;
  height: 54px !important;
  object-fit: contain !important;
  transform: rotate(var(--driver-heading, 0deg)) !important;
  transform-origin: 50% 50% !important;
  filter: saturate(1.04) brightness(1.02) drop-shadow(0 12px 11px rgba(0, 0, 0, .75)) !important;
}

.driver .driver-visual .leaflet-control-container {
  display: none !important;
}

@media (max-width: 900px) {
  body.taxi-home #driver .driver-inner {
    min-height: 820px !important;
  }

  .driver .driver-visual::before {
    background:
      linear-gradient(180deg, #05070a 0%, rgba(5, 7, 10, .98) 26%, rgba(5, 7, 10, .60) 51%, rgba(5, 7, 10, .30) 70%, rgba(5, 7, 10, .88) 100%),
      linear-gradient(90deg, rgba(5, 7, 10, .55), transparent 70%) !important;
  }

  .driver .driver-text {
    width: min(680px, 100%) !important;
    padding: 76px 28px 270px !important;
  }

  .driver .driver-text h2 {
    max-width: 560px !important;
    font-size: clamp(48px, 8.5vw, 72px) !important;
  }

  .driver .driver-list {
    right: 22px !important;
    bottom: 24px !important;
    left: 22px !important;
  }

  .driver .driver-list li {
    padding: 11px 14px !important;
  }

  .driver .driver-online {
    top: 54% !important;
    right: 15% !important;
  }
}

@media (max-width: 620px) {
  body.taxi-home #driver .driver-inner {
    min-height: 860px !important;
  }

  .driver .driver-text {
    padding: 62px 18px 350px !important;
  }

  .driver .driver-text .section-kicker {
    margin-bottom: 17px !important;
    font-size: 10px !important;
  }

  .driver .driver-text h2 {
    margin-bottom: 18px !important;
    font-size: clamp(44px, 14vw, 62px) !important;
    line-height: .98 !important;
  }

  .driver .driver-text > p {
    max-width: 430px !important;
    margin-bottom: 28px !important;
    font-size: 15px !important;
  }

  .driver .driver-text .btn-yellow {
    width: 100% !important;
    justify-content: center !important;
  }

  .driver .driver-list {
    right: 14px !important;
    bottom: 14px !important;
    left: 14px !important;
    min-height: 0 !important;
    padding: 8px 14px !important;
    grid-template-columns: 1fr !important;
    border-radius: 22px !important;
  }

  .driver .driver-list li {
    min-height: 76px !important;
    padding: 10px 4px !important;
    border-right: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, .10) !important;
  }

  .driver .driver-list li:last-child {
    border-bottom: 0 !important;
  }

  .driver .driver-list img {
    width: 48px !important;
    height: 48px !important;
    flex-basis: 48px !important;
    padding: 13px !important;
    border-radius: 16px !important;
  }

  .driver .driver-online {
    top: 58% !important;
    right: 18px !important;
  }
}
