/* FINAL FIX: mobile contacts page only. Loaded after all other styles. */
@media (max-width: 767px) {
  html body.site-page.contact-page {
    padding-top: 68px !important;
  }

  html body.site-page.contact-page .contact-hero {
    position: relative !important;
    width: 100% !important;
    height: 620px !important;
    min-height: 620px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: #fff !important;
  }

  html body.site-page.contact-page .contact-hero::before {
    content: "" !important;
    position: absolute !important;
    z-index: 0 !important;
    inset: 0 0 auto 0 !important;
    width: 100% !important;
    height: 466px !important;
    background:
      linear-gradient(90deg,
        rgba(255,255,255,.99) 0%,
        rgba(255,255,255,.96) 31%,
        rgba(255,255,255,.76) 49%,
        rgba(255,255,255,.25) 70%,
        rgba(255,255,255,.02) 100%),
      linear-gradient(180deg,
        rgba(255,255,255,.01) 0%,
        rgba(255,255,255,.01) 76%,
        rgba(255,255,255,.92) 94%,
        #fff 100%),
      url("images/contact-hero-truck.webp") 66% center / auto 466px no-repeat !important;
    pointer-events: none !important;
  }

  html body.site-page.contact-page .contact-hero__inner {
    position: relative !important;
    z-index: 1 !important;
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 38px 26px 16px !important;
    display: block !important;
    background: transparent !important;
  }

  html body.site-page.contact-page .contact-hero .home-eyebrow {
    margin: 0 0 20px !important;
    color: #0a9634 !important;
    font-size: 17px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
  }

  html body.site-page.contact-page .contact-hero h1 {
    width: max-content !important;
    max-width: calc(100vw - 52px) !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #071a45 !important;
    font-family: "Onest", "Segoe UI", Arial, sans-serif !important;
    font-size: clamp(38px, 10.7vw, 43px) !important;
    font-weight: 800 !important;
    line-height: 1.08 !important;
    letter-spacing: -0.052em !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    white-space: normal !important;
  }

  html body.site-page.contact-page .contact-hero h1 > span {
    display: block !important;
    width: max-content !important;
    max-width: 100% !important;
    white-space: nowrap !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
  }

  html body.site-page.contact-page .contact-hero__inner > p:not(.home-eyebrow) {
    width: 255px !important;
    max-width: calc(100vw - 52px) !important;
    margin: 24px 0 0 !important;
    color: #17264a !important;
    font-size: 18px !important;
    font-weight: 430 !important;
    line-height: 1.5 !important;
    text-align: left !important;
  }

  html body.site-page.contact-page .contact-hero__actions {
    position: absolute !important;
    z-index: 3 !important;
    left: 26px !important;
    right: 26px !important;
    bottom: 14px !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    background: #fff !important;
  }

  html body.site-page.contact-page .contact-hero__phone,
  html body.site-page.contact-page .contact-hero__phone:visited {
    position: relative !important;
    width: 100% !important;
    min-height: 50px !important;
    height: 50px !important;
    margin: 0 !important;
    padding: 0 0 0 50px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #071a45 !important;
    background: #fff !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font-size: clamp(27px, 7.5vw, 31px) !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    letter-spacing: -0.035em !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    overflow: visible !important;
  }

  html body.site-page.contact-page .contact-hero__phone::before {
    content: "" !important;
    position: absolute !important;
    left: 2px !important;
    top: 50% !important;
    width: 38px !important;
    height: 38px !important;
    background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230a9634' stroke-width='2.1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6.6 3.8l2.7-.6c.6-.14 1.2.18 1.43.75l1.1 2.8c.22.55.04 1.18-.43 1.53l-1.65 1.24a14.2 14.2 0 0 0 4.73 4.73l1.24-1.65c.35-.47.98-.65 1.53-.43l2.8 1.1c.57.23.89.83.75 1.43l-.6 2.7a1.65 1.65 0 0 1-1.61 1.28C10.83 18.7 5.3 13.17 5.3 6.61A1.65 1.65 0 0 1 6.6 3.8Z'/%3E%3C/svg%3E") !important;
    transform: translateY(-50%) !important;
  }

  html body.site-page.contact-page .contact-hero__button {
    width: 100% !important;
    min-height: 56px !important;
    height: 56px !important;
    margin: 0 !important;
    padding: 10px 18px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #fff !important;
    background: #0a9634 !important;
    border: 0 !important;
    border-radius: 7px !important;
    box-shadow: none !important;
    font-size: 20px !important;
    font-weight: 750 !important;
    line-height: 1.2 !important;
    text-decoration: none !important;
  }

  /* Larger icons in the contact methods card. */
  html body.site-page.contact-page .contact-quick-card {
    padding-left: 82px !important;
  }

  html body.site-page.contact-page .contact-quick-card__icon {
    left: 4px !important;
    width: 62px !important;
    min-width: 62px !important;
    height: 62px !important;
    min-height: 62px !important;
  }

  html body.site-page.contact-page .contact-quick-card__icon svg {
    width: 54px !important;
    min-width: 54px !important;
    height: 54px !important;
    min-height: 54px !important;
  }
}

@media (max-width: 359px) {
  html body.site-page.contact-page .contact-hero {
    height: 594px !important;
    min-height: 594px !important;
  }

  html body.site-page.contact-page .contact-hero::before {
    height: 442px !important;
    background-size: auto 442px !important;
    background-position: 66% center !important;
  }

  html body.site-page.contact-page .contact-hero__inner {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  html body.site-page.contact-page .contact-hero h1 {
    max-width: calc(100vw - 40px) !important;
    font-size: 38px !important;
  }

  html body.site-page.contact-page .contact-hero__inner > p:not(.home-eyebrow) {
    width: 235px !important;
    max-width: calc(100vw - 40px) !important;
    font-size: 17px !important;
  }

  html body.site-page.contact-page .contact-hero__actions {
    left: 20px !important;
    right: 20px !important;
  }

  html body.site-page.contact-page .contact-hero__phone,
  html body.site-page.contact-page .contact-hero__phone:visited {
    padding-left: 43px !important;
    font-size: 25px !important;
  }

  html body.site-page.contact-page .contact-hero__phone::before {
    width: 33px !important;
    height: 33px !important;
  }

  html body.site-page.contact-page .contact-quick-card {
    padding-left: 74px !important;
  }

  html body.site-page.contact-page .contact-quick-card__icon {
    width: 56px !important;
    min-width: 56px !important;
    height: 56px !important;
    min-height: 56px !important;
  }

  html body.site-page.contact-page .contact-quick-card__icon svg {
    width: 48px !important;
    min-width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
  }
}
/* =========================================================
   КОНТАКТЫ — МОБИЛЬНЫЙ ПЕРВЫЙ ЭКРАН КАК НА РЕНДЕРЕ
   ========================================================= */
@media (max-width: 767px) {

  html body.site-page.contact-page {
    padding-top: 68px !important;
  }


  /* Весь блок: фото + белая нижняя зона */
  html body.site-page.contact-page .contact-hero {
  position: relative !important;

  width: 100% !important;

  height: 640px !important;
  min-height: 640px !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden !important;

    background: #fff !important;
  }


  /* ==================================================
     ФОТО
     ================================================== */

  html body.site-page.contact-page .contact-hero::before {
  content: "" !important;

  position: absolute !important;
  z-index: 0 !important;

  top: 0 !important;
  left: 0 !important;

  width: 100% !important;
  height: 482px !important;

    /*
      Туман только слева.
      Нижний белый туман полностью убираем.
    */
    background:
      linear-gradient(
        90deg,
        rgba(255,255,255,.96) 0%,
        rgba(255,255,255,.89) 20%,
        rgba(255,255,255,.65) 36%,
        rgba(255,255,255,.32) 50%,
        rgba(255,255,255,.08) 63%,
        rgba(255,255,255,0) 73%
      ),
      url("images/contact-hero-truck.webp")
      65% center / cover no-repeat !important;

    pointer-events: none !important;
  }


  /* ==================================================
     ТЕКСТ
     ================================================== */

  html body.site-page.contact-page .contact-hero__inner {
  position: relative !important;
  z-index: 1 !important;

  box-sizing: border-box !important;

  width: 100% !important;
  max-width: none !important;

  height: 640px !important;
  min-height: 640px !important;

    margin: 0 !important;
    padding: 34px 30px 0 !important;

    display: flex !important;
    flex-direction: column !important;

    background: transparent !important;
  }


  /* Контакты */
  html body.site-page.contact-page
  .contact-hero .home-eyebrow {

    margin: 0 0 22px !important;

    color: #079638 !important;

    font-size: 15px !important;
    font-weight: 800 !important;
    line-height: 1.1 !important;
  }


  /* Свяжитесь с нами */
  html body.site-page.contact-page
  .contact-hero h1 {

    width: max-content !important;
    max-width: calc(100vw - 60px) !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #071d55 !important;

    font-size: 43px !important;
    font-weight: 820 !important;

    line-height: 1.04 !important;
    letter-spacing: -.045em !important;
  }

  html body.site-page.contact-page
  .contact-hero h1 > span {

    display: block !important;
    white-space: nowrap !important;
  }


  /* Описание */
  html body.site-page.contact-page
  .contact-hero__inner > p:not(.home-eyebrow) {

    width: 250px !important;
    max-width: 70% !important;

    margin: 28px 0 0 !important;

    color: #142647 !important;

    font-size: 17px !important;
    font-weight: 430 !important;

    line-height: 1.5 !important;
  }


  /* ==================================================
     БЕЛАЯ ЗОНА С ТЕЛЕФОНОМ
     ================================================== */

  html body.site-page.contact-page
  .contact-hero__actions {

    position: static !important;

    width: auto !important;

    /*
      Толкаем блок точно к низу:
      фотография заканчивается — начинается белая зона.
    */
    margin:
      auto
      -30px
      0 !important;

    padding:
      14px
      30px
      18px !important;

    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;

    background: #fff !important;
  }


  /* ==================================================
     ТЕЛЕФОН
     ================================================== */

  html body.site-page.contact-page
  .contact-hero__phone,
  html body.site-page.contact-page
  .contact-hero__phone:visited {

    position: relative !important;

    box-sizing: border-box !important;

    width: 100% !important;
    height: 58px !important;
    min-height: 58px !important;

    margin: 0 !important;

    padding:
      0
      5px
      0
      50px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    color: #071d55 !important;

    background: #fff !important;

    border: 0 !important;
    border-radius: 0 !important;

    box-shadow: none !important;

    font-size: 29px !important;
    font-weight: 820 !important;

    line-height: 1 !important;
    letter-spacing: -.035em !important;

    text-decoration: none !important;
    white-space: nowrap !important;
  }


  /* Зеленая трубка */
  html body.site-page.contact-page
  .contact-hero__phone::before {

    content: "" !important;

    position: absolute !important;

    left: 0 !important;
    top: 50% !important;

    width: 36px !important;
    height: 36px !important;

    transform: translateY(-50%) !important;

    background:
      center / contain no-repeat
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23099b3e' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6.6 3.8l2.7-.6c.6-.14 1.2.18 1.43.75l1.1 2.8c.22.55.04 1.18-.43 1.53l-1.65 1.24a14.2 14.2 0 0 0 4.73 4.73l1.24-1.65c.35-.47.98-.65 1.53-.43l2.8 1.1c.57.23.89.83.75 1.43l-.6 2.7a1.65 1.65 0 0 1-1.61 1.28C10.83 18.7 5.3 13.17 5.3 6.61A1.65 1.65 0 0 1 6.6 3.8Z'/%3E%3C/svg%3E")
      !important;
  }


  /* ==================================================
     КНОПКА
     ================================================== */

  html body.site-page.contact-page
  .contact-hero__button {

    box-sizing: border-box !important;

    width: 100% !important;

    height: 58px !important;
    min-height: 58px !important;

    margin: 0 !important;
    padding: 8px 18px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    color: #fff !important;

    background: #079b35 !important;

    border: 0 !important;
    border-radius: 7px !important;

    box-shadow: none !important;

    font-size: 18px !important;
    font-weight: 780 !important;

    text-decoration: none !important;
  }

}
@media (max-width: 767px) {

  /* Телефон и кнопка чуть ближе друг к другу */
  html body.site-page.contact-page .contact-hero__actions {
    gap: 3px !important;
  }

  /* Номер телефона крупнее */
  html body.site-page.contact-page .contact-hero__phone,
  html body.site-page.contact-page .contact-hero__phone:visited {
    font-size: 32px !important;
    font-weight: 820 !important;
    padding-left: 58px !important;
  }

  /* Зелёная ЗАКРАШЕННАЯ трубка + чуть правее */
  html body.site-page.contact-page .contact-hero__phone::before {
    left: 12px !important;

    width: 35px !important;
    height: 35px !important;

    background:
      center / contain no-repeat
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23099b3e' d='M6.62 10.79a15.46 15.46 0 0 0 6.59 6.59l2.2-2.2a1.5 1.5 0 0 1 1.52-.36c1.05.35 2.17.54 3.32.54A1.75 1.75 0 0 1 22 17.11v3.14A1.75 1.75 0 0 1 20.25 22C10.17 22 2 13.83 2 3.75A1.75 1.75 0 0 1 3.75 2h3.14a1.75 1.75 0 0 1 1.75 1.75c0 1.16.19 2.27.54 3.32a1.5 1.5 0 0 1-.37 1.52l-2.19 2.2Z'/%3E%3C/svg%3E")
      !important;
  }

  /* Кнопку «Позвонить» немного поднимаем */
  html body.site-page.contact-page .contact-hero__button {
    position: relative !important;
    top: -15px !important;
  }

}
/* ФИНАЛЬНЫЙ ФИКС ТЕЛЕФОНА */
@media (max-width: 767px) {

  /* Номер крупнее */
  html body.site-page.contact-page
  .contact-hero .contact-hero__actions
  a.contact-hero__phone,
  html body.site-page.contact-page
  .contact-hero .contact-hero__actions
  a.contact-hero__phone:visited {
    font-size: 40px !important;
    font-weight: 820 !important;

    padding-left: 62px !important;
    padding-right: 8px !important;
  }

  /* Зелёная ЗАКРАШЕННАЯ трубка и немного правее */
  html body.site-page.contact-page
  .contact-hero .contact-hero__actions
  a.contact-hero__phone::before {
    content: "" !important;

    left: 10px !important;
    top: 50% !important;

    width: 31px !important;
    height: 31px !important;

    transform: translateY(-50%) !important;

    background: #099b3e !important;

    -webkit-mask:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.62 10.79a15.46 15.46 0 0 0 6.59 6.59l2.2-2.2a1.5 1.5 0 0 1 1.52-.36c1.05.35 2.17.54 3.32.54A1.75 1.75 0 0 1 22 17.11v3.14A1.75 1.75 0 0 1 20.25 22C10.17 22 2 13.83 2 3.75A1.75 1.75 0 0 1 3.75 2h3.14a1.75 1.75 0 0 1 1.75 1.75c0 1.16.19 2.27.54 3.32a1.5 1.5 0 0 1-.37 1.52l-2.19 2.2Z'/%3E%3C/svg%3E")
      center / contain no-repeat !important;

    mask:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.62 10.79a15.46 15.46 0 0 0 6.59 6.59l2.2-2.2a1.5 1.5 0 0 1 1.52-.36c1.05.35 2.17.54 3.32.54A1.75 1.75 0 0 1 22 17.11v3.14A1.75 1.75 0 0 1 20.25 22C10.17 22 2 13.83 2 3.75A1.75 1.75 0 0 1 3.75 2h3.14a1.75 1.75 0 0 1 1.75 1.75c0 1.16.19 2.27.54 3.32a1.5 1.5 0 0 1-.37 1.52l-2.19 2.2Z'/%3E%3C/svg%3E")
      center / contain no-repeat !important;
  }

}
@media (max-width: 767px) {

  html body.site-page.contact-page
  .contact-hero .contact-hero__actions
  a.contact-hero__phone {
    justify-content: flex-start !important;

    /* область номера после трубки */
    padding-left: 135px !important;
    padding-right: 20px !important;

    font-size: 34px !important;
    font-weight: 820 !important;
    letter-spacing: -0.03em !important;
  }

}
@media (max-width: 767px) {

  html body.site-page.contact-page
  .contact-hero .contact-hero__actions
  a.contact-hero__phone {
    justify-content: flex-start !important;

    padding-left: 82px !important;
    padding-right: 8px !important;

    font-size: 40px !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    letter-spacing: -0.055em !important;

    white-space: nowrap !important;
  }

}
@media (max-width: 767px) {

  html body.site-page.contact-page
  .contact-hero .contact-hero__phone {
    padding-left: 78px !important;
    padding-right: 8px !important;
    justify-content: flex-start !important;
  }

  /* Сам номер — крупный и растянутый */
  html body.site-page.contact-page
  .contact-hero .contact-hero__phone-number {
    display: block !important;

    font-size: 100px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    letter-spacing: -0.045em !important;

    white-space: nowrap !important;

    transform: scaleX(1) !important;
    transform-origin: left center !important;
  }

}
@media (max-width: 767px) {

  /* ВЕСЬ блок телефона + кнопки ближе к фотографии */
  html body.site-page.contact-page
  .contact-hero .contact-hero__actions {
    padding-top: 2px !important;
    gap: 5px !important;
  }


  /* Строка телефона — ровно по ширине кнопки */
  html body.site-page.contact-page
  .contact-hero .contact-hero__actions
  a.contact-hero__phone {
    box-sizing: border-box !important;

    width: 100% !important;
    max-width: 100% !important;

    height: 58px !important;

    margin: 0 !important;
    padding: 0 !important;

    display: grid !important;
    grid-template-columns: 58px minmax(0, 1fr) !important;
    align-items: center !important;

    justify-content: initial !important;
  }


  /* Трубка */
  html body.site-page.contact-page
  .contact-hero .contact-hero__actions
  a.contact-hero__phone::before {
    position: static !important;

    width: 34px !important;
    height: 34px !important;

    margin: 0 auto !important;

    transform: none !important;

    background: #079b3d !important;
  }


  /* НОМЕР — растягиваем от трубки до правого края кнопки */
  html body.site-page.contact-page
  .contact-hero .contact-hero__phone-number {
    width: 100% !important;
    min-width: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    padding: 0 7px 0 5px !important;

    color: #071d55 !important;

    font-size: 30px !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    letter-spacing: -0.04em !important;

    white-space: nowrap !important;
  }


  /* Зеленая кнопка той же ширины */
  html body.site-page.contact-page
  .contact-hero .contact-hero__actions
  a.contact-hero__button {
    width: 100% !important;
    max-width: 100% !important;

    margin: 0 !important;

    top: 0 !important;
  }

}
@media (max-width: 767px) {

  /* Вся строка: трубка + номер строго по центру */
  html body.site-page.contact-page
  .contact-hero .contact-hero__actions
  a.contact-hero__phone {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;
    padding: 0 !important;
    gap: 13px !important;
  }

  /* Трубка рядом с номером */
  html body.site-page.contact-page
  .contact-hero .contact-hero__actions
  a.contact-hero__phone::before {
    position: static !important;

    width: 32px !important;
    height: 32px !important;

    flex: 0 0 32px !important;
    margin: 0 !important;

    transform: none !important;
  }

  /* Сам номер больше НЕ растягиваем */
  html body.site-page.contact-page
  .contact-hero .contact-hero__phone-number {
    width: auto !important;

    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;

    gap: 7px !important;

    padding: 0 !important;
    margin: 0 !important;

    font-size: 30px !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    letter-spacing: -0.045em !important;

    white-space: nowrap !important;
  }
}
@media (max-width: 640px) {

  /* "НАЧАТЬ ПРОСТО" по центру */
  html body.contact-page
  .contact-simple-call__eyebrow {
    width: 100% !important;
    margin: 0 0 10px !important;

    text-align: center !important;
  }


  /* Общий контейнер телефона */
  html body.contact-page
  .contact-simple-call__phone {
    display: flex !important;
    align-items: stretch !important;

    width: 100% !important;
    height: 54px !important;

    padding: 0 !important;

    border: 1px solid rgba(16, 35, 60, 0.14) !important;
    border-radius: 8px !important;

    background: #ffffff !important;
    overflow: hidden !important;
  }


  /* +375 */
  html body.contact-page
  .contact-simple-call__prefix {
    flex: 0 0 82px !important;

    margin: 0 !important;
    padding: 0 14px !important;

    border-radius: 0 !important;
    box-shadow: none !important;
  }


  /* Убираем отдельный закругленный прямоугольник у input */
  html body.contact-page
  .contact-simple-call__input {
    flex: 1 1 auto !important;

    width: 100% !important;
    min-width: 0 !important;
    height: 100% !important;

    margin: 0 !important;
    padding: 0 14px !important;

    border: 0 !important;
    border-radius: 0 !important;
    outline: 0 !important;

    background: transparent !important;
    box-shadow: none !important;

    appearance: none !important;
    -webkit-appearance: none !important;
  }

  html body.contact-page
  .contact-simple-call__input:focus {
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
  }
}