/* Restores the first Paint Service landing layout shown in the reference. */

html {
  scroll-behavior: smooth;
}

body {
  background: #fff !important;
  color: #111827 !important;
}

body > .site-header {
  position: relative !important;
  z-index: 50 !important;
  width: 100% !important;
  min-height: 110px !important;
  height: 110px !important;
  background: #fff !important;
  border-bottom: 1px solid #dce4eb !important;
  box-shadow: none !important;
}

body > .site-header .desktop-header {
  display: grid !important;
  grid-template-columns: 246px minmax(570px, 1fr) auto !important;
  align-items: center !important;
  gap: 21px !important;
  width: 100% !important;
  height: 110px !important;
  min-height: 110px !important;
  padding: 0 43px 0 45px !important;
  margin: 0 !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body > .site-header .restore-mobile-menu-button {
  display: none !important;
}

body > .site-header .mobile-menu-inline {
  display: none !important;
}

body > .site-header .header-logo {
  display: flex !important;
  align-items: center !important;
  width: 238px !important;
  height: 92px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

body > .site-header .header-logo img {
  display: block !important;
  width: 236px !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: 88px !important;
  object-fit: contain !important;
}

body > .site-header .main-nav {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 35px !important;
  min-width: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  white-space: nowrap !important;
}

body > .site-header .main-nav a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 0 !important;
  color: #0d1320 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  text-decoration: none !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
}

body > .site-header .main-nav a:hover,
body > .site-header .main-nav a:focus-visible {
  color: #159ce5 !important;
}

body > .site-header .main-nav a::before,
body > .site-header .main-nav a::after {
  display: none !important;
  content: none !important;
}

body > .site-header .header-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 28px !important;
  min-width: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

body > .site-header .header-phone {
  display: grid !important;
  grid-template-columns: 24px max-content !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 170px !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  color: #080c14 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  text-decoration: none !important;
}

body > .site-header .header-phone .header-icon {
  width: 22px !important;
  height: 22px !important;
  color: #159ce5 !important;
}

body > .site-header .header-phone .icon-phone::before {
  inset: 3px 5px 3px 6px !important;
  width: auto !important;
  height: auto !important;
  border: 2px solid currentColor !important;
  border-top-color: transparent !important;
  border-right-color: transparent !important;
  border-radius: 5px 0 0 7px !important;
  transform: rotate(-45deg) !important;
}

body > .site-header .header-phone .icon-phone::after {
  display: none !important;
}

body > .site-header .header-phone span:last-child {
  display: grid !important;
  gap: 2px !important;
}

body > .site-header .header-phone strong {
  color: #080c14 !important;
  font-size: 16px !important;
  font-weight: 750 !important;
  line-height: 1.08 !important;
  white-space: nowrap !important;
}

body > .site-header .header-phone small {
  display: block !important;
  color: #647083 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.12 !important;
  white-space: nowrap !important;
}

body > .site-header .desktop-header > .header-actions > .photo-cta {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 264px !important;
  height: 50px !important;
  min-width: 264px !important;
  padding: 0 24px !important;
  color: #fff !important;
  background: linear-gradient(180deg, #28a9ee 0%, #1595d8 100%) !important;
  border: 0 !important;
  border-radius: 5px !important;
  box-shadow: 0 7px 18px rgba(21, 148, 217, .24) !important;
  text-decoration: none !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

body > .site-header .desktop-header > .header-actions > .photo-cta .header-icon,
body > .site-header .taxi-wrap,
body > .site-header .mobile-taxi-toggle,
body > .site-header .mobile-taxi-popover,
body > .site-header .mobile-taxi-card {
  display: none !important;
}

.hero {
  position: relative !important;
  isolation: isolate !important;
  z-index: 2 !important;
  min-height: 563px !important;
  height: 563px !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
  background: #f8fbfd !important;
  border-bottom: 0 !important;
}

.hero::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -2 !important;
  background-image: url("assets/paint-booth-hero-fast.jpg") !important;
  background-repeat: no-repeat !important;
  background-size: min(1400px, 94vw) auto !important;
  background-position: right 48px top !important;
  opacity: 1 !important;
}

.hero::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -1 !important;
  background:
    linear-gradient(90deg, rgba(255,255,255,.98) 0%, rgba(255,255,255,.94) 33%, rgba(255,255,255,.55) 45%, rgba(255,255,255,.05) 67%),
    linear-gradient(180deg, rgba(255,255,255,.46) 0%, rgba(255,255,255,0) 35%, rgba(241,247,252,.22) 100%) !important;
  pointer-events: none !important;
}

.hero-content {
  position: relative !important;
  z-index: 2 !important;
  width: 700px !important;
  max-width: calc(100% - 92px) !important;
  padding: 37px 0 0 50px !important;
  margin: 0 !important;
}

.hero .eyebrow,
.services .eyebrow {
  margin: 0 !important;
  color: #1397dc !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  letter-spacing: .17em !important;
  line-height: 1.25 !important;
}

.hero h1 {
  margin: 25px 0 0 !important;
  width: 700px !important;
  max-width: 100% !important;
  color: #030508 !important;
  font-size: 61px !important;
  font-weight: 850 !important;
  line-height: 1.07 !important;
  letter-spacing: 0 !important;
}

.hero-list {
  display: grid !important;
  gap: 12px !important;
  width: 590px !important;
  max-width: 100% !important;
  padding: 0 !important;
  margin: 22px 0 0 !important;
  list-style: none !important;
}

.hero-list li {
  position: relative !important;
  min-height: 14px !important;
  padding: 0 0 0 27px !important;
  color: #334155 !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 1.17 !important;
}

.hero-list li::before {
  content: "" !important;
  position: absolute !important;
  left: 3px !important;
  top: 4px !important;
  width: 9px !important;
  height: 5px !important;
  border-left: 2px solid #159ce5 !important;
  border-bottom: 2px solid #159ce5 !important;
  transform: rotate(-45deg) !important;
  background: transparent !important;
  border-radius: 0 !important;
}

.hero-actions {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  margin: 28px 0 0 !important;
}

.hero-actions .primary-action,
.hero-actions .secondary-action {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 14px !important;
  height: 55px !important;
  border-radius: 6px !important;
  font-size: 15px !important;
  font-weight: 750 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}

.hero-actions .primary-action {
  width: 304px !important;
  padding: 0 22px !important;
  color: #fff !important;
  background: linear-gradient(180deg, #28a9ee 0%, #1495d8 100%) !important;
  border: 0 !important;
  box-shadow: 0 8px 18px rgba(21, 148, 217, .25) !important;
}

.hero-actions .secondary-action {
  width: 240px !important;
  padding: 0 22px !important;
  color: #111827 !important;
  background: rgba(255,255,255,.95) !important;
  border: 1px solid #d5dde5 !important;
  box-shadow: 0 8px 24px rgba(18, 42, 61, .08) !important;
}

.hero-actions svg {
  width: 22px !important;
  height: 22px !important;
  flex: 0 0 22px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.9 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.process-strip.process-advisor {
  position: absolute !important;
  left: 49px !important;
  right: auto !important;
  bottom: -14px !important;
  z-index: 6 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: 796px !important;
  min-width: 0 !important;
  max-width: calc(100% - 99px) !important;
  height: 65px !important;
  min-height: 65px !important;
  padding: 0 17px !important;
  overflow: hidden !important;
  color: #111827 !important;
  background: rgba(255,255,255,.96) !important;
  border: 1px solid rgba(213, 224, 235, .98) !important;
  border-radius: 8px !important;
  box-shadow: 0 16px 40px rgba(15, 31, 50, .10) !important;
  backdrop-filter: blur(12px) !important;
}

.process-strip.process-advisor .process-steps {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 17px !important;
  width: 100% !important;
  min-width: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

.process-strip.process-advisor .process-step {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  min-width: 0 !important;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  color: #0f172a !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 650 !important;
  line-height: 1 !important;
  text-transform: none !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}

.process-strip.process-advisor .process-step.is-active {
  color: #159ce5 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.process-strip.process-advisor .process-step svg {
  width: 29px !important;
  height: 29px !important;
  flex: 0 0 29px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.process-strip.process-advisor .step-arrow {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 16px !important;
  color: #253144 !important;
  font-size: 22px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
}

.process-strip.process-advisor .process-detail {
  display: none !important;
}

.guarantee-card {
  position: absolute !important;
  top: 448px !important;
  right: 43px !important;
  bottom: auto !important;
  z-index: 5 !important;
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
  width: 228px !important;
  height: 70px !important;
  padding: 0 14px !important;
  color: #fff !important;
  background: #101925 !important;
  border: 1px solid rgba(255,255,255,.68) !important;
  border-radius: 8px !important;
  box-shadow: 0 18px 36px rgba(5, 16, 28, .22) !important;
  cursor: pointer !important;
}

.guarantee-card svg {
  width: 32px !important;
  height: 32px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.9 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.guarantee-card span {
  display: block !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.32 !important;
  text-align: left !important;
}

.guarantee-card strong {
  display: block !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
}

.services {
  position: relative !important;
  z-index: 1 !important;
  min-height: 352px !important;
  padding: 64px 49px 29px !important;
  margin: 0 !important;
  background: #fff !important;
  overflow: hidden !important;
}

.services .section-heading {
  width: 450px !important;
  margin: 0 !important;
}

.services .section-heading h2 {
  margin: 8px 0 0 !important;
  color: #0a0d14 !important;
  font-size: 25px !important;
  font-weight: 850 !important;
  line-height: 1.12 !important;
  letter-spacing: 0 !important;
}

.service-arrows {
  position: absolute !important;
  top: 88px !important;
  right: 63px !important;
  display: flex !important;
  gap: 16px !important;
  z-index: 2 !important;
}

.service-arrows button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 37px !important;
  height: 37px !important;
  padding: 0 !important;
  color: #253144 !important;
  background: #fff !important;
  border: 1px solid #dce6ee !important;
  border-radius: 50% !important;
  box-shadow: none !important;
  font-size: 20px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  cursor: pointer !important;
}

.service-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 14px !important;
  width: 100% !important;
  margin: 18px 0 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

.service-card {
  position: relative !important;
  display: block !important;
  min-width: 0 !important;
  height: 176px !important;
  overflow: hidden !important;
  background: #fff !important;
  border: 1px solid #d8e2eb !important;
  border-radius: 5px !important;
  box-shadow: none !important;
  transform: none !important;
}

.service-card:hover,
.service-card:focus-visible,
.service-card.is-highlighted {
  transform: translateY(-2px) !important;
  border-color: #159ce5 !important;
  box-shadow: 0 16px 30px rgba(12, 33, 52, .12) !important;
}

.service-card img {
  display: block !important;
  width: 100% !important;
  height: 124px !important;
  object-fit: cover !important;
  filter: saturate(.72) contrast(.97) !important;
}

.service-card:nth-child(1) img {
  object-position: center 42% !important;
}

.service-card:nth-child(2) img {
  object-position: center 55% !important;
}

.service-card:nth-child(3) img {
  object-position: 69% 56% !important;
}

.service-card:nth-child(4) img {
  object-position: center 45% !important;
}

.service-card a {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  height: 52px !important;
  padding: 0 22px 0 18px !important;
  color: #182235 !important;
  background: #fff !important;
  text-decoration: none !important;
  font-size: 18px !important;
  font-weight: 500 !important;
  line-height: 1.1 !important;
}

.service-card a span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #159ce5 !important;
  font-size: 32px !important;
  font-weight: 300 !important;
  line-height: 1 !important;
}

@media (max-width: 1280px) {
  body > .site-header .desktop-header {
    grid-template-columns: 220px minmax(450px, 1fr) auto !important;
    gap: 16px !important;
    padding-inline: 28px !important;
  }

  body > .site-header .header-logo,
  body > .site-header .header-logo img {
    width: 214px !important;
  }

  body > .site-header .main-nav {
    gap: 21px !important;
  }

  body > .site-header .desktop-header > .header-actions > .photo-cta {
    width: 235px !important;
    min-width: 235px !important;
  }

  .hero h1 {
    font-size: 57px !important;
  }

  .guarantee-card {
    right: 28px !important;
  }
}

@media (max-width: 1040px) {
  body > .site-header {
    height: auto !important;
    min-height: 90px !important;
  }

  body > .site-header .desktop-header {
    display: none !important;
  }

  body > .site-header .mobile-header {
    display: block !important;
    padding: 10px 16px 12px !important;
    background: #fff !important;
    border-bottom: 1px solid #dce4eb !important;
  }

  body > .site-header .mobile-header-top {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
  }

  body > .site-header .mobile-header-buttons {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 8px !important;
    min-width: 104px !important;
  }

  body > .site-header .mobile-call,
  body > .site-header .mobile-menu-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
    padding: 0 !important;
    color: #159ce5 !important;
    background: #fff !important;
    border: 1px solid #d8e4ee !important;
    border-radius: 8px !important;
    box-shadow: 0 8px 20px rgba(15, 31, 50, .08) !important;
  }

  body > .site-header .mobile-menu-button {
    flex-direction: column !important;
    gap: 5px !important;
    color: #111827 !important;
  }

  body > .site-header .mobile-menu-button span {
    display: block !important;
    width: 22px !important;
    height: 2px !important;
    border-radius: 999px !important;
    background: currentColor !important;
  }

  body > .site-header .mobile-menu[aria-hidden="true"] {
    display: none !important;
  }

  body > .site-header .mobile-header .header-logo {
    width: 182px !important;
    height: 66px !important;
  }

  body > .site-header .mobile-header .header-logo img {
    width: 180px !important;
    max-height: 66px !important;
  }

  body > .site-header .mobile-photo-cta {
    display: flex !important;
    margin-top: 9px !important;
    width: 100% !important;
    min-height: 48px !important;
    border-radius: 6px !important;
  }

  .hero {
    height: auto !important;
    min-height: 760px !important;
    padding-bottom: 115px !important;
    overflow: hidden !important;
  }

  .hero::before {
    background-size: 870px auto !important;
    background-position: 58% top !important;
  }

  .hero::after {
    background:
      linear-gradient(180deg, rgba(255,255,255,.12) 0%, rgba(255,255,255,.76) 255px, rgba(255,255,255,.98) 380px),
      linear-gradient(90deg, rgba(255,255,255,.84) 0%, rgba(255,255,255,.36) 100%) !important;
  }

  .hero-content {
    width: auto !important;
    max-width: none !important;
    padding: 318px 20px 0 !important;
  }

  .hero h1 {
    font-size: 42px !important;
    line-height: 1.08 !important;
    width: auto !important;
    max-width: 100% !important;
  }

  .hero-list {
    width: auto !important;
    max-width: 100% !important;
    gap: 11px !important;
  }

  .hero-list li {
    font-size: 15px !important;
    line-height: 1.35 !important;
    overflow-wrap: break-word !important;
  }

  .hero-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .hero-actions .primary-action,
  .hero-actions .secondary-action {
    width: 100% !important;
  }

  .process-strip.process-advisor {
    left: 14px !important;
    right: 14px !important;
    bottom: 20px !important;
    width: auto !important;
    max-width: none !important;
    height: 70px !important;
    overflow-x: auto !important;
    padding: 0 14px !important;
  }

  .process-strip.process-advisor .process-steps {
    width: max-content !important;
    gap: 14px !important;
  }

  .guarantee-card {
    right: 18px !important;
    bottom: 104px !important;
    width: 226px !important;
  }

  .services {
    padding: 42px 16px 28px !important;
    overflow: hidden !important;
  }

  .service-arrows {
    display: none !important;
  }

  .service-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  .service-card {
    height: 150px !important;
  }

  .service-card img {
    height: 100px !important;
  }

  .service-card a {
    height: 50px !important;
  }
}

/* Header refinement: clean desktop nav and premium mobile action buttons. */
body > .site-header .main-nav a span {
  display: inline-block !important;
  line-height: 1.05 !important;
  text-align: center !important;
}

@media (min-width: 1041px) {
  body > .site-header .desktop-header {
    grid-template-columns: 220px minmax(430px, 1fr) auto !important;
    gap: 22px !important;
  }

  body > .site-header .main-nav {
    gap: clamp(18px, 1.75vw, 34px) !important;
    padding-inline: 8px !important;
  }

  body > .site-header .main-nav a {
    min-width: 0 !important;
    padding: 0 4px !important;
    white-space: normal !important;
    text-align: center !important;
    line-height: 1.08 !important;
  }
}

@media (max-width: 1320px) and (min-width: 1041px) {
  body > .site-header .desktop-header {
    grid-template-columns: 192px minmax(360px, 1fr) auto !important;
    gap: 16px !important;
  }

  body > .site-header .main-nav {
    gap: 18px !important;
  }
}

@media (max-width: 1040px) {
  body > .site-header .mobile-header {
    overflow: visible !important;
  }

  body > .site-header .mobile-header-top {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 10px !important;
  }

  body > .site-header .mobile-menu-inline,
  body > .site-header .mobile-header-buttons,
  body > .site-header .mobile-menu-button,
  body > .site-header .premium-menu-toggle {
    display: none !important;
  }

  body > .site-header .premium-mobile-actions {
    display: grid !important;
    grid-template-columns: repeat(3, 42px) !important;
    width: 140px !important;
    gap: 7px !important;
    align-items: center !important;
    justify-content: end !important;
  }

  body > .site-header .premium-icon-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid #d7e5f0 !important;
    border-radius: 11px !important;
    background: rgba(255,255,255,.96) !important;
    color: #081426 !important;
    box-shadow: 0 12px 28px rgba(15,31,50,.12) !important;
    text-decoration: none !important;
    cursor: pointer !important;
    appearance: none !important;
  }

  body > .site-header .premium-icon-button .header-icon {
    width: 22px !important;
    height: 22px !important;
    color: currentColor !important;
  }

  body > .site-header .premium-taxi-button {
    border-color: #f0c547 !important;
    background: linear-gradient(180deg, #ffe98b, #ffc928) !important;
    color: #171000 !important;
    box-shadow: 0 14px 30px rgba(242,185,24,.26) !important;
  }

  body > .site-header .premium-call-button {
    border-color: rgba(21,156,229,.28) !important;
    color: #0789d0 !important;
  }

  body > .site-header .premium-menu-button {
    flex-direction: column !important;
    gap: 5px !important;
  }

  body > .site-header .premium-menu-button span {
    display: block !important;
    width: 22px !important;
    height: 2px !important;
    margin: 0 !important;
    border-radius: 999px !important;
    background: currentColor !important;
  }

  body > .site-header .mobile-taxi-popover {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    right: 14px !important;
    left: auto !important;
    width: min(300px, calc(100vw - 28px)) !important;
    z-index: 6000 !important;
    border: 1px solid rgba(240,197,71,.55) !important;
    border-radius: 14px !important;
    background: #101820 !important;
    color: #fff !important;
    box-shadow: 0 18px 46px rgba(15,31,50,.22) !important;
  }

  body > .site-header .mobile-header.is-taxi-open .mobile-taxi-popover,
  body > .site-header .mobile-taxi-popover.is-open {
    display: block !important;
  }
}

@media (max-width: 380px) {
  body > .site-header .mobile-header .header-logo,
  body > .site-header .mobile-header .header-logo img {
    width: 132px !important;
  }

  body > .site-header .premium-mobile-actions {
    grid-template-columns: repeat(3, 40px) !important;
    width: 130px !important;
    gap: 5px !important;
  }

  body > .site-header .premium-icon-button {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
  }
}

/* Final mobile first-screen fix: no empty billboard above the headline. */
@media (max-width: 1040px) {
  body .hero {
    height: auto !important;
    min-height: 0 !important;
    padding-bottom: 18px !important;
    margin-bottom: 0 !important;
    overflow: hidden !important;
  }

  body .hero::before {
    background-size: 620px auto !important;
    background-position: 58% -24px !important;
  }

  body .hero::after {
    background:
      linear-gradient(180deg, rgba(255,255,255,.08) 0%, rgba(255,255,255,.68) 140px, rgba(255,255,255,.98) 230px),
      linear-gradient(90deg, rgba(255,255,255,.86) 0%, rgba(255,255,255,.40) 100%) !important;
  }

  body .hero .hero-content {
    padding: 200px 20px 0 !important;
    width: auto !important;
    max-width: none !important;
  }

  body .hero .eyebrow {
    margin-bottom: 14px !important;
  }

  body .hero h1 {
    margin-top: 0 !important;
  }
}

@media (max-width: 380px) {
  body .hero .hero-content {
    padding-top: 190px !important;
  }
}

/* Rebuilt Paint Service header. */
body > .site-header.ps-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 5000 !important;
  width: 100% !important;
  min-height: 82px !important;
  height: auto !important;
  padding: 10px 24px !important;
  display: grid !important;
  grid-template-columns: 220px minmax(420px, 1fr) auto !important;
  align-items: center !important;
  gap: 24px !important;
  background: rgba(255,255,255,.98) !important;
  border-bottom: 1px solid #e4edf4 !important;
  box-shadow: 0 10px 28px rgba(15,34,55,.06) !important;
  backdrop-filter: blur(14px) !important;
  overflow: visible !important;
}

body > .site-header.ps-header .ps-logo {
  display: inline-flex !important;
  align-items: center !important;
  width: 210px !important;
  min-width: 0 !important;
  height: auto !important;
  text-decoration: none !important;
}

body > .site-header.ps-header .ps-logo img {
  display: block !important;
  width: 210px !important;
  height: auto !important;
  max-height: 62px !important;
  object-fit: contain !important;
}

body > .site-header.ps-header .ps-nav {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(22px, 2vw, 38px) !important;
  min-width: 0 !important;
}

body > .site-header.ps-header .ps-nav a {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 42px !important;
  color: #071322 !important;
  font-size: 15px !important;
  font-weight: 850 !important;
  line-height: 1.08 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  text-decoration: none !important;
  white-space: normal !important;
}

body > .site-header.ps-header .ps-nav a:hover,
body > .site-header.ps-header .ps-nav a:focus-visible {
  color: #098ede !important;
  outline: none !important;
}

body > .site-header.ps-header .ps-desktop-contact {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 16px !important;
}

body > .site-header.ps-header .ps-phone-text {
  display: grid !important;
  gap: 2px !important;
  color: #071322 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

body > .site-header.ps-header .ps-phone-text strong {
  font-size: 16px !important;
  line-height: 1 !important;
  font-weight: 900 !important;
}

body > .site-header.ps-header .ps-phone-text span {
  color: #586a7d !important;
  font-size: 13px !important;
}

body > .site-header.ps-header .ps-photo-link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 52px !important;
  padding: 0 22px !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, #28aaf0, #1294dc) !important;
  color: #fff !important;
  font-size: 15px !important;
  font-weight: 850 !important;
  text-decoration: none !important;
  box-shadow: 0 12px 30px rgba(18,148,220,.24) !important;
  white-space: nowrap !important;
}

body > .site-header.ps-header .ps-mobile-shell {
  display: none !important;
}

body > .site-header.ps-header .ps-btn {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
  padding: 0 !important;
  border: 1px solid #d8e6f2 !important;
  border-radius: 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #fff !important;
  color: #102033 !important;
  box-shadow: 0 4px 12px rgba(15,34,55,.06) !important;
  cursor: pointer !important;
  text-decoration: none !important;
  appearance: none !important;
}

body > .site-header.ps-header .ps-btn svg {
  width: 22px !important;
  height: 22px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

body > .site-header.ps-header .ps-btn-taxi {
  background: linear-gradient(180deg, #ffd95a 0%, #ffc928 100%) !important;
  border-color: #f0bd18 !important;
  color: #111 !important;
  box-shadow: 0 10px 24px rgba(255,201,40,.28) !important;
}

body > .site-header.ps-header .ps-btn-phone {
  color: #0d8de8 !important;
}

body > .site-header.ps-header .ps-menu {
  display: none !important;
}

@media (max-width: 1320px) and (min-width: 1041px) {
  body > .site-header.ps-header {
    grid-template-columns: 200px minmax(340px, 1fr) auto !important;
    gap: 18px !important;
    padding-inline: 18px !important;
  }

  body > .site-header.ps-header .ps-logo,
  body > .site-header.ps-header .ps-logo img {
    width: 195px !important;
  }

  body > .site-header.ps-header .ps-nav {
    gap: 22px !important;
  }

  body > .site-header.ps-header .ps-photo-link {
    min-height: 50px !important;
    padding-inline: 18px !important;
  }
}

@media (max-width: 1040px) {
  body > .site-header.ps-header {
    min-height: 64px !important;
    height: 64px !important;
    padding: 8px 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
  }

  body > .site-header.ps-header .ps-logo,
  body > .site-header.ps-header .ps-logo img {
    width: 132px !important;
    max-height: 44px !important;
  }

  body > .site-header.ps-header .ps-nav,
  body > .site-header.ps-header .ps-desktop-contact {
    display: none !important;
  }

  body > .site-header.ps-header .ps-mobile-shell {
    position: absolute !important;
    top: 12px !important;
    right: 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 6px !important;
    width: 132px !important;
    min-height: 42px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  body > .site-header.ps-header .mobile-taxi-popover {
    display: none !important;
    position: absolute !important;
    top: 58px !important;
    right: 14px !important;
    width: min(300px, calc(100vw - 28px)) !important;
    padding: 14px !important;
    border: 1px solid rgba(240,189,24,.42) !important;
    border-radius: 14px !important;
    background: #101820 !important;
    color: #fff !important;
    box-shadow: 0 18px 46px rgba(15,31,50,.22) !important;
  }

  body > .site-header.ps-header .ps-btn {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
  }

  body > .site-header.ps-header .ps-btn svg {
    width: 21px !important;
    height: 21px !important;
  }

  body > .site-header.ps-header .mobile-header.is-taxi-open .mobile-taxi-popover,
  body > .site-header.ps-header .mobile-taxi-popover.is-open {
    display: block !important;
  }

  body > .site-header.ps-header .mobile-taxi-popover p {
    margin: 0 0 5px !important;
    font-size: 14px !important;
    font-weight: 850 !important;
  }

  body > .site-header.ps-header .mobile-taxi-popover small {
    color: rgba(255,255,255,.76) !important;
  }

  body > .site-header.ps-header .ps-menu {
    position: fixed !important;
    inset: 0 !important;
    z-index: 9000 !important;
    display: block !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    background: rgba(8,17,30,.24) !important;
    transition: opacity .18s ease, visibility .18s ease !important;
  }

  body > .site-header.ps-header .ps-menu.is-open {
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  body > .site-header.ps-header .ps-menu-panel {
    margin: 10px !important;
    padding: 14px !important;
    max-height: calc(100dvh - 20px) !important;
    overflow-y: auto !important;
    border: 1px solid #d8e6f2 !important;
    border-radius: 18px !important;
    background: rgba(255,255,255,.98) !important;
    box-shadow: 0 28px 80px rgba(8,17,30,.22) !important;
  }

  body > .site-header.ps-header .ps-menu-head {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    margin-bottom: 14px !important;
  }

  body > .site-header.ps-header .ps-btn-close {
    color: #102033 !important;
  }

  body > .site-header.ps-header .ps-menu-card {
    display: grid !important;
    gap: 6px !important;
    padding: 16px !important;
    border: 1px solid #dbe8f2 !important;
    border-radius: 14px !important;
    background: linear-gradient(180deg, #f7fbff, #fff) !important;
  }

  body > .site-header.ps-header .ps-menu-card strong {
    color: #071322 !important;
    font-size: 18px !important;
  }

  body > .site-header.ps-header .ps-menu-card span {
    color: #5b6d7e !important;
    font-weight: 700 !important;
  }

  body > .site-header.ps-header .ps-menu-card a {
    color: #071322 !important;
    font-weight: 900 !important;
    text-decoration: none !important;
  }

  body > .site-header.ps-header .ps-menu-links {
    display: grid !important;
    margin-top: 12px !important;
    overflow: hidden !important;
    border: 1px solid #dbe8f2 !important;
    border-radius: 14px !important;
    background: #fff !important;
  }

  body > .site-header.ps-header .ps-menu-links a {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    min-height: 58px !important;
    padding: 0 16px !important;
    border-bottom: 1px solid #e6eef5 !important;
    color: #071322 !important;
    font-size: 17px !important;
    font-weight: 900 !important;
    text-decoration: none !important;
  }

  body > .site-header.ps-header .ps-menu-links a::after {
    content: ">" !important;
    color: #718397 !important;
    font-size: 22px !important;
    font-weight: 500 !important;
  }

  body > .site-header.ps-header .ps-menu-links a:last-child {
    border-bottom: 0 !important;
  }

  body > .site-header.ps-header .ps-menu-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
    margin-top: 12px !important;
  }

  body > .site-header.ps-header .ps-menu-actions a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 48px !important;
    border-radius: 12px !important;
    background: #1098df !important;
    color: #fff !important;
    font-weight: 900 !important;
    text-decoration: none !important;
  }
}

@media (max-width: 380px) {
  body > .site-header.ps-header .ps-logo,
  body > .site-header.ps-header .ps-logo img {
    width: 124px !important;
  }

  body > .site-header.ps-header .ps-mobile-shell {
    gap: 6px !important;
  }

  body > .site-header.ps-header .ps-btn {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
  }
}

/* Mobile hero compaction: remove the empty visual gap above the headline. */
@media (max-width: 1040px) {
  .hero {
    height: auto !important;
    min-height: 0 !important;
    padding-bottom: 22px !important;
    overflow: hidden !important;
  }

  .hero::before {
    background-size: 650px auto !important;
    background-position: 58% -18px !important;
  }

  .hero::after {
    background:
      linear-gradient(180deg, rgba(255,255,255,.10) 0%, rgba(255,255,255,.70) 150px, rgba(255,255,255,.98) 245px),
      linear-gradient(90deg, rgba(255,255,255,.82) 0%, rgba(255,255,255,.40) 100%) !important;
  }

  .hero-content {
    padding: 220px 20px 0 !important;
  }
}

@media (max-width: 380px) {
  .hero-content {
    padding-top: 208px !important;
  }
}

@media (max-width: 430px) {
  body > .site-header .mobile-header {
    padding-inline: 12px !important;
  }

  .hero {
    min-height: 788px !important;
  }

  .hero::before {
    background-size: 760px auto !important;
    background-position: 57% top !important;
  }

  .hero-content {
    padding-top: 292px !important;
  }

  .hero .eyebrow,
  .services .eyebrow {
    font-size: 11px !important;
  }

  .hero h1 {
    width: auto !important;
    max-width: calc(100vw - 40px) !important;
    font-size: 32px !important;
    line-height: 1.09 !important;
  }

  .guarantee-card {
    bottom: 100px !important;
    left: 20px !important;
    right: auto !important;
    width: 224px !important;
  }

  .process-strip.process-advisor .process-step {
    font-size: 13px !important;
  }

  .services .section-heading {
    width: auto !important;
  }

  .services .section-heading h2 {
    font-size: 25px !important;
  }
}

@media (max-width: 600px) {
  html,
  body {
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  body > .site-header .mobile-header {
    width: 100% !important;
    overflow: hidden !important;
  }

  body > .site-header .mobile-header-top {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    width: 100% !important;
    position: relative !important;
    min-height: 66px !important;
  }

  body > .site-header .mobile-header-buttons {
    position: static !important;
    transform: none !important;
    min-width: 48px !important;
    max-width: 48px !important;
  }

  body > .site-header .mobile-call {
    display: none !important;
  }

  body > .site-header .mobile-menu-button {
    display: none !important;
  }

  body > .site-header .restore-mobile-menu-button {
    position: fixed !important;
    top: 20px !important;
    left: min(326px, calc(100vw - 62px)) !important;
    right: auto !important;
    z-index: 1200 !important;
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: column !important;
    gap: 5px !important;
    width: 48px !important;
    height: 48px !important;
    padding: 0 !important;
    color: #111827 !important;
    background: #fff !important;
    border: 1px solid #d8e4ee !important;
    border-radius: 8px !important;
    box-shadow: 0 8px 20px rgba(15, 31, 50, .08) !important;
  }

  body > .site-header .restore-mobile-menu-button span {
    display: block !important;
    width: 22px !important;
    height: 2px !important;
    background: currentColor !important;
    border-radius: 999px !important;
  }

  .hero-content {
    width: auto !important;
    max-width: 100% !important;
    padding-right: 20px !important;
    overflow: hidden !important;
  }

  .hero h1 {
    width: auto !important;
    max-width: calc(100vw - 40px) !important;
    font-size: 32px !important;
    line-height: 1.09 !important;
    overflow-wrap: normal !important;
  }

  .hero-list {
    width: auto !important;
    max-width: calc(100vw - 40px) !important;
  }

  .guarantee-card {
    display: none !important;
  }
}

/* Premium header and useful process guide */
body > .site-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
  height: auto !important;
  min-height: 0 !important;
  background: rgba(255,255,255,.96) !important;
  border-bottom: 1px solid rgba(211,226,237,.92) !important;
  box-shadow: 0 12px 32px rgba(15,31,50,.06) !important;
  backdrop-filter: blur(16px) !important;
}

body > .site-header .desktop-header {
  grid-template-columns: 206px minmax(0, 1fr) auto !important;
  width: min(1460px, calc(100% - 48px)) !important;
  height: 88px !important;
  min-height: 88px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  gap: 24px !important;
}

body > .site-header .header-logo {
  width: 206px !important;
  height: 78px !important;
}

body > .site-header .header-logo img {
  width: 206px !important;
  max-height: 74px !important;
}

body > .site-header .main-nav {
  justify-content: center !important;
  gap: clamp(14px, 1.55vw, 26px) !important;
  padding: 0 10px !important;
}

body > .site-header .main-nav a {
  position: relative !important;
  min-height: 44px !important;
  color: #111827 !important;
  font-size: 15px !important;
  font-weight: 750 !important;
  letter-spacing: 0 !important;
}

body > .site-header .main-nav a::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 7px !important;
  height: 2px !important;
  background: #159ce5 !important;
  border-radius: 999px !important;
  transform: scaleX(0) !important;
  transform-origin: center !important;
  transition: transform .18s ease !important;
}

body > .site-header .main-nav a:hover::after,
body > .site-header .main-nav a:focus-visible::after {
  transform: scaleX(1) !important;
}

body > .site-header .header-actions {
  gap: 18px !important;
}

body > .site-header .header-phone {
  grid-template-columns: 21px max-content !important;
  gap: 9px !important;
  min-width: 172px !important;
  padding: 10px 0 !important;
}

body > .site-header .header-phone strong {
  font-size: 16px !important;
  font-weight: 850 !important;
}

body > .site-header .header-phone small {
  font-size: 12px !important;
}

body > .site-header .desktop-header > .header-actions > .photo-cta {
  width: auto !important;
  min-width: 236px !important;
  height: 54px !important;
  padding: 0 23px !important;
  border-radius: 8px !important;
  box-shadow: 0 14px 30px rgba(21,148,217,.22) !important;
}

.hero {
  height: auto !important;
  min-height: 0 !important;
  padding-bottom: 46px !important;
}

.process-strip.process-advisor {
  position: relative !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  width: auto !important;
  max-width: none !important;
  margin: 30px 50px 0 !important;
  height: auto !important;
  min-height: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 18px !important;
  padding: 18px !important;
  overflow: visible !important;
  background: rgba(255,255,255,.97) !important;
  border: 1px solid rgba(205,221,234,.95) !important;
  border-radius: 14px !important;
  box-shadow: 0 24px 70px rgba(16,35,54,.14) !important;
}

.process-strip.process-advisor .process-steps {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 10px !important;
  width: 100% !important;
}

.process-strip.process-advisor .step-arrow {
  display: none !important;
}

.process-strip.process-advisor .process-step {
  justify-content: flex-start !important;
  gap: 10px !important;
  min-height: 58px !important;
  padding: 10px 12px !important;
  color: #172033 !important;
  border: 1px solid #dce8f1 !important;
  border-radius: 10px !important;
  background: linear-gradient(180deg, #fff, #f8fbfe) !important;
  font-size: 14px !important;
  font-weight: 850 !important;
  box-shadow: none !important;
}

.process-strip.process-advisor .process-step svg {
  width: 26px !important;
  height: 26px !important;
  flex-basis: 26px !important;
}

.process-strip.process-advisor .process-step.is-active {
  color: #fff !important;
  border-color: #1498dd !important;
  background: linear-gradient(180deg, #22a9ee, #118fd5) !important;
  box-shadow: 0 14px 28px rgba(17,143,213,.22) !important;
}

.process-strip.process-advisor .process-detail {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 360px !important;
  gap: 20px !important;
  align-items: stretch !important;
  padding: 18px !important;
  background: linear-gradient(135deg, #f8fbff, #ffffff) !important;
  border: 1px solid #e0ebf3 !important;
  border-radius: 12px !important;
}

.process-detail-label {
  display: inline-flex !important;
  width: fit-content !important;
  margin-bottom: 8px !important;
  color: #128fd5 !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
}

.process-strip.process-advisor .process-detail strong {
  display: block !important;
  color: #0b1320 !important;
  font-size: 23px !important;
  font-weight: 900 !important;
  line-height: 1.16 !important;
}

.process-strip.process-advisor .process-detail p {
  margin: 10px 0 0 !important;
  color: #415066 !important;
  font-size: 16px !important;
  line-height: 1.5 !important;
}

.process-detail-list {
  display: grid !important;
  gap: 8px !important;
  margin: 14px 0 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.process-detail-list li {
  position: relative !important;
  padding-left: 22px !important;
  color: #1f2b3d !important;
  font-size: 14px !important;
  line-height: 1.35 !important;
}

.process-detail-list li::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 6px !important;
  width: 9px !important;
  height: 5px !important;
  border-left: 2px solid #159ce5 !important;
  border-bottom: 2px solid #159ce5 !important;
  transform: rotate(-45deg) !important;
}

.process-detail-actions {
  display: grid !important;
  align-content: start !important;
  gap: 12px !important;
  padding: 14px !important;
  border-radius: 12px !important;
  background: #0f1b2a !important;
  color: #fff !important;
}

.process-contact-title {
  color: rgba(255,255,255,.72) !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}

.process-contact-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

.contact-chip,
.quote-contact button,
.contact-methods button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  min-height: 44px !important;
  padding: 10px 12px !important;
  border-radius: 10px !important;
  border: 1px solid #d8e7f2 !important;
  background: #fff !important;
  color: #102033 !important;
  text-decoration: none !important;
  font-size: 14px !important;
  font-weight: 850 !important;
  line-height: 1.1 !important;
  white-space: nowrap !important;
}

.process-contact-grid .contact-chip {
  border-color: rgba(255,255,255,.16) !important;
  background: rgba(255,255,255,.08) !important;
  color: #fff !important;
}

.contact-chip span,
.channel-icon {
  width: 18px !important;
  height: 18px !important;
  flex: 0 0 18px !important;
  display: inline-block !important;
  background: currentColor !important;
  -webkit-mask: var(--channel-mask) center / contain no-repeat !important;
  mask: var(--channel-mask) center / contain no-repeat !important;
}

.contact-whatsapp,
.channel-whatsapp {
  color: #14a85f !important;
  --channel-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M12.04 2a9.84 9.84 0 0 0-8.36 15.04L2.6 21.4l4.47-1.04A9.85 9.85 0 1 0 12.04 2Zm0 1.9a7.95 7.95 0 0 1 0 15.9 7.86 7.86 0 0 1-4.03-1.1l-.34-.2-2.39.56.58-2.29-.22-.36A7.95 7.95 0 0 1 12.04 3.9Zm-3.1 3.8c-.18 0-.48.06-.73.34-.25.27-.96.94-.96 2.3s.98 2.66 1.12 2.84c.14.18 1.9 3.03 4.72 4.13 2.34.92 2.82.74 3.33.7.51-.05 1.65-.68 1.88-1.33.23-.65.23-1.2.16-1.33-.07-.12-.25-.2-.52-.34-.28-.14-1.65-.81-1.9-.9-.25-.1-.44-.14-.63.14-.18.27-.72.9-.88 1.08-.16.18-.32.2-.6.07-.28-.14-1.17-.43-2.22-1.37-.82-.73-1.38-1.64-1.54-1.92-.16-.27-.02-.42.12-.56.13-.13.28-.32.42-.48.14-.16.18-.27.28-.46.1-.18.05-.34-.02-.48-.07-.14-.62-1.5-.86-2.05-.22-.53-.45-.46-.62-.47h-.54Z'/%3E%3C/svg%3E");
}

.contact-viber,
.channel-viber {
  color: #7360f2 !important;
  --channel-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M12 2.2c5.1 0 8.4 2.6 8.4 7.45 0 3.14-1.16 5.15-3.35 6.22l.62 3.1c.08.42-.38.73-.73.48l-3.13-2.23c-.6.06-1.2.09-1.81.09-5.1 0-8.4-2.58-8.4-7.66S6.9 2.2 12 2.2Zm0 1.85c-4.05 0-6.55 1.88-6.55 5.6 0 3.73 2.5 5.81 6.55 5.81.68 0 1.35-.05 1.98-.16l.35-.06 1.2.86-.23-1.16.73-.34c1.74-.8 2.52-2.3 2.52-4.95 0-3.72-2.5-5.6-6.55-5.6Zm-2.84 2.5c.2-.02.38.07.5.24l.7 1.04c.17.25.15.58-.05.8l-.35.39c-.12.14-.14.34-.05.5.48.82 1.17 1.5 2.02 1.98.17.1.38.07.51-.07l.4-.42c.2-.22.54-.27.8-.1l1.08.68c.25.16.36.48.25.75-.26.66-.8 1.08-1.45 1.08-.76 0-2.4-.66-3.8-2.05-1.4-1.38-2.1-3-2.1-3.78 0-.6.43-1.13 1.08-1.42.14-.06.3-.1.46-.12Zm4.18.2c1.6.17 2.55 1.1 2.72 2.73.04.38-.24.72-.62.76-.38.04-.72-.24-.76-.62-.09-.83-.55-1.28-1.54-1.4a.68.68 0 0 1-.6-.75c.04-.38.41-.68.8-.72Zm.05-2.03c2.64.23 4.43 2.04 4.67 4.73.03.38-.25.72-.63.76a.69.69 0 0 1-.75-.63c-.19-2.03-1.42-3.27-3.41-3.45a.69.69 0 0 1-.62-.75c.04-.39.38-.69.74-.66Z'/%3E%3C/svg%3E");
}

.contact-telegram,
.channel-telegram {
  color: #229ed9 !important;
  --channel-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M20.9 4.35 17.9 19.1c-.22 1.04-.82 1.3-1.66.8l-4.58-3.37-2.21 2.13c-.24.24-.45.45-.92.45l.33-4.66 8.49-7.67c.37-.33-.08-.52-.57-.19L6.28 13.2l-4.52-1.41c-.98-.31-1-.98.2-1.45L19.62 3.5c.82-.3 1.54.2 1.28.85Z'/%3E%3C/svg%3E");
}

.contact-call,
.channel-call {
  color: #0f172a !important;
  --channel-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' d='M22 16.92v3a2 2 0 0 1-2.18 2 19.8 19.8 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.08 4.18 2 2 0 0 1 4.06 2h3a2 2 0 0 1 2 1.72c.12.9.32 1.78.58 2.63a2 2 0 0 1-.45 2.11L8.1 9.9a16 16 0 0 0 6 6l1.45-1.1a2 2 0 0 1 2.11-.45c.85.26 1.73.46 2.63.58A2 2 0 0 1 22 16.92Z'/%3E%3C/svg%3E");
}

.process-contact-grid .contact-chip span {
  color: currentColor !important;
}

.process-detail-actions .process-detail-cta {
  min-height: 46px !important;
  border-radius: 10px !important;
  border: 0 !important;
  background: linear-gradient(180deg, #27a9ed, #1195dd) !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  cursor: pointer !important;
}

.process-detail-actions a[data-stage-more] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 40px !important;
  color: rgba(255,255,255,.82) !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

.quote-contact,
.contact-methods {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

.quote-contact button,
.contact-methods button {
  min-width: 0 !important;
  width: 100% !important;
  cursor: pointer !important;
}

.quote-contact button.is-selected,
.contact-methods button.is-selected {
  border-color: #159ce5 !important;
  background: linear-gradient(180deg, #27a9ed, #1195dd) !important;
  color: #fff !important;
  box-shadow: 0 12px 24px rgba(21,148,217,.2) !important;
}

.quote-contact button.is-selected .channel-icon,
.contact-methods button.is-selected .channel-icon {
  color: #fff !important;
}

@media (max-width: 1320px) {
  body > .site-header .desktop-header {
    width: min(1240px, calc(100% - 32px)) !important;
    grid-template-columns: 190px minmax(0, 1fr) auto !important;
    gap: 18px !important;
  }

  body > .site-header .header-logo,
  body > .site-header .header-logo img {
    width: 190px !important;
  }

  body > .site-header .main-nav {
    gap: 15px !important;
  }

  body > .site-header .main-nav a {
    font-size: 14px !important;
  }

  body > .site-header .desktop-header > .header-actions > .photo-cta {
    min-width: 224px !important;
    padding-inline: 18px !important;
  }
}

@media (max-width: 1120px) and (min-width: 1041px) {
  body > .site-header .desktop-header {
    grid-template-columns: 172px minmax(0, 1fr) auto !important;
    gap: 12px !important;
  }

  body > .site-header .header-logo,
  body > .site-header .header-logo img {
    width: 172px !important;
  }

  body > .site-header .main-nav {
    gap: 10px !important;
  }

  body > .site-header .main-nav a {
    font-size: 13px !important;
  }

  body > .site-header .header-phone small {
    display: none !important;
  }

  body > .site-header .desktop-header > .header-actions > .photo-cta {
    min-width: 190px !important;
    font-size: 13px !important;
  }
}

@media (max-width: 1040px) {
  body > .site-header .mobile-header {
    padding: 14px 16px 12px !important;
    box-shadow: 0 10px 26px rgba(15,31,50,.06) !important;
  }

  body > .site-header .mobile-header .header-logo,
  body > .site-header .mobile-header .header-logo img {
    width: 156px !important;
    height: auto !important;
    max-height: 60px !important;
  }

  body > .site-header .restore-mobile-menu-button {
    top: 18px !important;
    left: min(326px, calc(100vw - 62px)) !important;
    right: auto !important;
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 46px !important;
    height: 46px !important;
    border-radius: 10px !important;
  }

  body > .site-header .mobile-photo-cta {
    margin-top: 10px !important;
    min-height: 48px !important;
    border-radius: 8px !important;
    font-size: 15px !important;
  }

  body > .site-header .mobile-menu {
    position: fixed !important;
    inset: 0 !important;
    background: rgba(9,20,34,.34) !important;
    backdrop-filter: blur(8px) !important;
  }

  body > .site-header .mobile-menu-panel {
    inset: 10px !important;
    width: auto !important;
    max-width: none !important;
    padding: 16px !important;
    border-radius: 18px !important;
    background: #fff !important;
    overflow-y: auto !important;
  }

  body > .site-header .mobile-menu-contact {
    padding: 16px !important;
    border-radius: 14px !important;
  }

  body > .site-header .mobile-menu-link {
    min-height: 58px !important;
    padding: 10px 14px !important;
  }

  body > .site-header .mobile-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .hero {
    min-height: 0 !important;
    height: auto !important;
    padding-bottom: 28px !important;
  }

  .process-strip.process-advisor {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    margin: 24px 16px 0 !important;
    padding: 14px !important;
  }

  .process-strip.process-advisor .process-steps {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  .process-strip.process-advisor .process-step {
    min-height: 52px !important;
    justify-content: center !important;
    text-align: center !important;
  }

  .process-strip.process-advisor .process-step:last-of-type {
    grid-column: 1 / -1 !important;
  }

  .process-strip.process-advisor .process-detail {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    padding: 14px !important;
  }

  .process-strip.process-advisor .process-detail strong {
    font-size: 20px !important;
  }

  .process-detail-actions {
    padding: 12px !important;
  }

  .process-contact-grid,
  .quote-contact,
  .contact-methods {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 520px) {
  body > .site-header .mobile-header {
    padding-inline: 10px !important;
  }

  body > .site-header .mobile-photo-cta {
    font-size: 14px !important;
  }

  .contact-chip,
  .quote-contact button,
  .contact-methods button {
    min-height: 42px !important;
    padding-inline: 9px !important;
    font-size: 13px !important;
  }
}

@media (max-width: 1040px) {
  body > .site-header .mobile-header-top {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 48px !important;
    align-items: center !important;
    gap: 12px !important;
  }

  body > .site-header .mobile-header-buttons,
  body > .site-header .mobile-menu-button,
  body > .site-header .restore-mobile-menu-button {
    display: none !important;
  }

  body > .site-header .restore-mobile-menu-button {
    position: fixed !important;
    top: 17px !important;
    right: 14px !important;
    z-index: 5000 !important;
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: column !important;
    gap: 5px !important;
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    min-height: 46px !important;
    padding: 0 !important;
    color: #111827 !important;
    background: #fff !important;
    border: 1px solid #d8e4ee !important;
    border-radius: 10px !important;
    box-shadow: 0 12px 28px rgba(15,31,50,.12) !important;
  }

  body > .site-header .restore-mobile-menu-button span {
    display: block !important;
    width: 22px !important;
    height: 2px !important;
    margin: 0 !important;
    background: currentColor !important;
    border-radius: 999px !important;
  }

  body > .site-header .mobile-menu-inline {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: column !important;
    gap: 5px !important;
    width: 46px !important;
    height: 46px !important;
    padding: 0 !important;
    color: #111827 !important;
    background: #fff !important;
    border: 1px solid #d8e4ee !important;
    border-radius: 10px !important;
    box-shadow: 0 12px 28px rgba(15,31,50,.12) !important;
  }

  body > .site-header .mobile-menu-inline span {
    display: block !important;
    width: 22px !important;
    height: 2px !important;
    background: currentColor !important;
    border-radius: 999px !important;
  }

  body > .site-header .mobile-menu-button,
  body > .site-header .restore-mobile-menu-button {
    display: none !important;
  }

  .process-strip.process-advisor .process-steps {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
    gap: 8px !important;
  }

  .process-strip.process-advisor .process-step:last-child {
    grid-column: 1 / -1 !important;
  }

  .process-strip.process-advisor .process-step {
    min-height: 58px !important;
    padding: 10px 10px !important;
    gap: 9px !important;
  }
}

@media (min-width: 1041px) {
  body > .site-header .mobile-menu-inline,
  body > .site-header .restore-mobile-menu-button,
  body > .site-header .premium-menu-toggle {
    display: none !important;
  }
}

body > .site-header .premium-menu-toggle {
  display: none !important;
}

@media (max-width: 1040px) {
  body {
    padding-bottom: 86px !important;
  }

  body > .site-header .premium-menu-toggle {
    position: fixed !important;
    top: 17px !important;
    right: auto !important;
    left: 326px !important;
    z-index: 8000 !important;
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: column !important;
    gap: 5px !important;
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 0 !important;
    appearance: none !important;
    color: #111827 !important;
    background: #fff !important;
    border: 1px solid #d8e4ee !important;
    border-radius: 10px !important;
    box-shadow: 0 12px 28px rgba(15,31,50,.12) !important;
    pointer-events: auto !important;
  }

  body > .site-header .premium-menu-toggle span {
    display: block !important;
    width: 22px !important;
    height: 2px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: currentColor !important;
    border-radius: 999px !important;
  }
}

@media (max-width: 380px) {
  body > .site-header .premium-menu-toggle {
    left: 300px !important;
  }
}

/* Mobile polish: keep the header quiet and move actions to a compact bottom bar. */
@media (max-width: 1040px) {
  body {
    padding-bottom: 92px !important;
  }

  body > .site-header .mobile-header {
    padding: 12px 14px 14px !important;
  }

  body > .site-header .mobile-header-top {
    min-height: 52px !important;
  }

  body > .site-header .mobile-photo-cta,
  body > .site-header .mobile-taxi-toggle,
  body > .site-header .mobile-taxi-popover {
    display: none !important;
  }

  body > .site-header .mobile-header .header-logo,
  body > .site-header .mobile-header .header-logo img {
    width: 164px !important;
    max-height: 58px !important;
  }

  .channel-photo {
    --channel-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 7h3l1.5-2h7L17 7h3a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V9a2 2 0 0 1 2-2zm8 10a4 4 0 1 0 0-8 4 4 0 0 0 0 8z' fill='black'/%3E%3C/svg%3E");
  }

  .mobile-bar {
    left: 50% !important;
    right: auto !important;
    bottom: 10px !important;
    width: min(370px, calc(100vw - 20px)) !important;
    max-width: min(370px, calc(100vw - 20px)) !important;
    box-sizing: border-box !important;
    transform: translateX(-50%) !important;
    z-index: 7000 !important;
    min-height: 66px !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    border: 1px solid rgba(201, 218, 231, .92) !important;
    border-radius: 14px !important;
    background: rgba(255,255,255,.96) !important;
    box-shadow: 0 18px 42px rgba(15,31,50,.18) !important;
    backdrop-filter: blur(16px) !important;
    overflow: hidden !important;
  }

  .mobile-bar a,
  .mobile-bar button {
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    min-width: 0 !important;
    min-height: 66px !important;
    padding: 8px 6px !important;
    border: 0 !important;
    border-right: 1px solid rgba(216, 228, 238, .95) !important;
    background: transparent !important;
    color: #057bc0 !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    cursor: pointer !important;
  }

  .mobile-bar a:last-child,
  .mobile-bar button:last-child {
    border-right: 0 !important;
  }

  .mobile-bar .channel-icon {
    width: 21px !important;
    height: 21px !important;
    flex: 0 0 21px !important;
    color: currentColor !important;
  }

  .process-strip.process-advisor .process-detail-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    padding: 14px !important;
    border-radius: 14px !important;
  }

  .process-strip.process-advisor .process-contact-title {
    max-width: none !important;
    margin: 0 !important;
    font-size: 12px !important;
    line-height: 1.15 !important;
  }

  .process-strip.process-advisor .process-contact-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  .process-strip.process-advisor .process-contact-grid .contact-chip {
    min-height: 44px !important;
    padding: 0 10px !important;
    border-radius: 9px !important;
    font-size: 13px !important;
    gap: 7px !important;
    white-space: nowrap !important;
  }

  .process-strip.process-advisor .process-detail-actions .process-detail-cta {
    width: 100% !important;
    min-height: 48px !important;
    border-radius: 10px !important;
    font-size: 14px !important;
  }

  .process-strip.process-advisor .process-detail-actions a[data-stage-more] {
    min-height: 36px !important;
    color: rgba(255,255,255,.82) !important;
  }

  .process-strip.process-advisor .process-detail-actions {
    margin-bottom: 18px !important;
  }
}

/* Final header override: visible mobile taxi/call/menu group. */
@media (max-width: 1040px) {
  body > .site-header .mobile-header {
    position: relative !important;
    min-height: 84px !important;
    padding: 12px 14px 12px !important;
    overflow: visible !important;
  }

  body > .site-header .mobile-header-top {
    display: flex !important;
    align-items: center !important;
    min-height: 58px !important;
  }

  body > .site-header .premium-mobile-actions {
    position: absolute !important;
    top: 20px !important;
    left: calc(100vw - 154px) !important;
    right: auto !important;
    z-index: 8100 !important;
    display: flex !important;
    width: auto !important;
    gap: 7px !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    align-items: center !important;
    justify-content: flex-end !important;
  }

  body > .site-header .premium-icon-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    padding: 0 !important;
    border: 1px solid #d7e5f0 !important;
    border-radius: 11px !important;
    background: rgba(255,255,255,.97) !important;
    color: #081426 !important;
    box-shadow: 0 12px 28px rgba(15,31,50,.12) !important;
  }

  body > .site-header .premium-taxi-button {
    border-color: #f0c547 !important;
    background: linear-gradient(180deg, #ffe98b, #ffc928) !important;
    color: #171000 !important;
    box-shadow: 0 14px 30px rgba(242,185,24,.26) !important;
  }

  body > .site-header .premium-call-button {
    border-color: rgba(21,156,229,.30) !important;
    color: #0789d0 !important;
  }

  body > .site-header .premium-icon-button .header-icon {
    width: 22px !important;
    height: 22px !important;
  }

  body > .site-header .premium-menu-button {
    flex-direction: column !important;
    gap: 5px !important;
  }

  body > .site-header .premium-menu-button span {
    display: block !important;
    width: 22px !important;
    height: 2px !important;
    border-radius: 999px !important;
    background: currentColor !important;
  }

  body > .site-header .mobile-taxi-popover.is-open,
  body > .site-header .mobile-header.is-taxi-open .mobile-taxi-popover {
    display: block !important;
    position: absolute !important;
    top: 72px !important;
    right: 14px !important;
    left: auto !important;
    width: min(300px, calc(100vw - 28px)) !important;
    z-index: 8200 !important;
    border: 1px solid rgba(240,197,71,.55) !important;
    border-radius: 14px !important;
    background: #101820 !important;
    color: #fff !important;
    box-shadow: 0 18px 46px rgba(15,31,50,.22) !important;
  }
}

@media (max-width: 380px) {
  body > .site-header .mobile-header .header-logo,
  body > .site-header .mobile-header .header-logo img {
    width: 132px !important;
  }

  body > .site-header .premium-mobile-actions {
    left: calc(100vw - 144px) !important;
    width: auto !important;
    gap: 5px !important;
  }

  body > .site-header .premium-icon-button {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
  }
}