/*
 * PC shell source of truth.
 * Keep the shared header and bottom quick bar identical to the home page.
 */
@view-transition {
  /* KakaoTalk WebView may otherwise restore an empty transition snapshot. */
  navigation: none;
}

/* Keep the shared shell visually persistent during same-origin page navigation. */
@supports (view-transition-name: realq-fixed-header) {
  html body #realq-site-header {
    view-transition-name: realq-fixed-header;
  }

  html body .realq-mobile-nav {
    view-transition-name: realq-fixed-quickbar;
  }

  ::view-transition-group(realq-fixed-header),
  ::view-transition-image-pair(realq-fixed-header),
  ::view-transition-old(realq-fixed-header),
  ::view-transition-new(realq-fixed-header),
  ::view-transition-group(realq-fixed-quickbar),
  ::view-transition-image-pair(realq-fixed-quickbar),
  ::view-transition-old(realq-fixed-quickbar),
  ::view-transition-new(realq-fixed-quickbar) {
    animation: none !important;
    mix-blend-mode: normal !important;
  }

  ::view-transition-old(root),
  ::view-transition-new(root) {
    animation-duration: 0s !important;
  }
}

/* Final mobile lock: page styles must not alter the shared header shell. */
@media (max-width: 760px) {
  html body #realq-site-header {
    box-sizing: border-box !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 1000 !important;
    width: 100% !important;
    height: 77px !important;
    min-height: 77px !important;
    max-height: 77px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 46px !important;
    grid-template-rows: auto !important;
    align-items: center !important;
    justify-items: stretch !important;
    gap: 12px !important;
    margin: 0 !important;
    padding: 10px 16px !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(209, 216, 229, .72) !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  html body #realq-site-header::before,
  html body #realq-site-header::after {
    display: none !important;
    content: none !important;
  }

  html body #realq-site-header .landing-brand {
    position: static !important;
    justify-self: start !important;
    align-self: center !important;
    min-height: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
  }

  html body #realq-site-header .site-logo-img {
    position: static !important;
    display: block !important;
    height: auto !important;
    margin: 0 !important;
  }

  html body #realq-site-header .landing-contact-actions {
    position: static !important;
    justify-self: end !important;
    align-self: center !important;
    width: 46px !important;
    min-width: 46px !important;
    max-width: 46px !important;
    height: 46px !important;
    min-height: 46px !important;
    max-height: 46px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  html body #realq-site-header .landing-chat-phone,
  html body #realq-site-header .landing-chat-phone:hover,
  html body #realq-site-header .landing-chat-phone:focus,
  html body #realq-site-header .landing-chat-phone:focus-visible,
  html body #realq-site-header .landing-chat-phone:active {
    box-sizing: border-box !important;
    position: static !important;
    width: 46px !important;
    min-width: 46px !important;
    max-width: 46px !important;
    height: 46px !important;
    min-height: 46px !important;
    max-height: 46px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: #1267ee !important;
    color: #fff !important;
    box-shadow: none !important;
    text-decoration: none !important;
    transform: none !important;
  }

  html body #realq-site-header .header-phone-icon {
    position: static !important;
    flex: 0 0 46px !important;
    width: 46px !important;
    min-width: 46px !important;
    max-width: 46px !important;
    height: 46px !important;
    min-height: 46px !important;
    max-height: 46px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: transparent !important;
    color: #fff !important;
    box-shadow: none !important;
  }

  html body #realq-site-header .header-phone-icon svg {
    width: 23px !important;
    height: 23px !important;
    display: block !important;
    fill: currentColor !important;
    stroke: none !important;
  }

  html body #realq-site-header .header-phone-label {
    display: none !important;
  }
}

/* Mobile shell source of truth: identical header on every page. */
@media (max-width: 760px) {
  html body .site-common-header {
    box-sizing: border-box !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 1000 !important;
    width: 100% !important;
    min-height: 77px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 46px !important;
    grid-template-rows: auto !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 0 !important;
    padding: 10px 16px !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(209, 216, 229, .72) !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  html body .site-common-header::before,
  html body .site-common-header::after {
    display: none !important;
    content: none !important;
  }

  html body .site-common-header .landing-brand {
    position: static !important;
    min-height: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
  }

  html body .site-common-header .site-logo-img {
    display: block !important;
    height: auto !important;
    margin: 0 !important;
  }

  html body .site-common-header .landing-contact-actions {
    position: static !important;
    width: 46px !important;
    height: 46px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  html body .site-common-header .landing-contact-actions .landing-chat-phone,
  html body .site-common-header .landing-contact-actions .landing-chat-phone:hover,
  html body .site-common-header .landing-contact-actions .landing-chat-phone:focus,
  html body .site-common-header .landing-contact-actions .landing-chat-phone:focus-visible,
  html body .site-common-header .landing-contact-actions .landing-chat-phone:active {
    box-sizing: border-box !important;
    position: static !important;
    width: 46px !important;
    min-width: 46px !important;
    max-width: 46px !important;
    height: 46px !important;
    min-height: 46px !important;
    max-height: 46px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: #1267ee !important;
    color: #fff !important;
    box-shadow: none !important;
    text-decoration: none !important;
    transform: none !important;
  }

  html body .site-common-header .header-phone-icon,
  html body .site-common-header .landing-chat-phone:hover .header-phone-icon,
  html body .site-common-header .landing-chat-phone:focus .header-phone-icon,
  html body .site-common-header .landing-chat-phone:active .header-phone-icon {
    position: static !important;
    flex: 0 0 46px !important;
    width: 46px !important;
    height: 46px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: transparent !important;
    color: #fff !important;
    box-shadow: none !important;
  }

  html body .site-common-header .header-phone-icon svg {
    width: 23px !important;
    height: 23px !important;
    display: block !important;
    fill: currentColor !important;
    stroke: none !important;
  }

  html body .site-common-header .header-phone-label {
    display: none !important;
  }
}

@media (min-width: 761px) {
  html body .site-common-header.site-common-header:not(#site-shell-unified) {
    box-sizing: border-box !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 1000 !important;
    width: 100% !important;
    height: 83px !important;
    min-height: 83px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-rows: auto !important;
    align-items: center !important;
    gap: 18px !important;
    margin: 0 !important;
    padding: 14px max(22px, calc((100% - 1180px) / 2)) !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(209, 216, 229, .72) !important;
    border-radius: 0 !important;
    background: rgba(255, 255, 255, .93) !important;
    color: #061631 !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  html body .site-common-header::before,
  html body .site-common-header::after {
    display: none !important;
    content: none !important;
    background: none !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
    animation: none !important;
  }

  html body .site-common-header .landing-brand,
  html body .site-common-header .site-logo-img,
  html body .site-common-header .landing-contact-actions {
    position: static !important;
    inset: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
  }

  html body .site-common-header .landing-brand {
    height: auto !important;
    min-height: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    line-height: 0 !important;
  }

  html body .site-common-header .site-logo-img {
    display: block !important;
  }

  html body .site-common-header .landing-contact-actions {
    width: 174px !important;
    height: 54px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;
  }

  html body .site-common-header .landing-contact-actions .landing-chat-phone,
  html body .site-common-header .landing-contact-actions .landing-chat-phone:hover,
  html body .site-common-header .landing-contact-actions .landing-chat-phone:focus,
  html body .site-common-header .landing-contact-actions .landing-chat-phone:focus-visible,
  html body .site-common-header .landing-contact-actions .landing-chat-phone:active {
    box-sizing: border-box !important;
    position: static !important;
    inset: auto !important;
    width: 174px !important;
    min-width: 174px !important;
    height: 54px !important;
    min-height: 54px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 13px !important;
    margin: 0 !important;
    padding: 6px 18px !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 999px !important;
    outline: 0 !important;
    background: #1267ee !important;
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: normal !important;
    box-shadow: none !important;
    filter: none !important;
    text-decoration: none !important;
    text-shadow: none !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
  }

  html body .site-common-header .landing-chat-phone::before,
  html body .site-common-header .landing-chat-phone::after {
    display: none !important;
    content: none !important;
    background: none !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
    animation: none !important;
  }

  html body .site-common-header .header-phone-icon,
  html body .site-common-header .landing-chat-phone:hover .header-phone-icon,
  html body .site-common-header .landing-chat-phone:focus .header-phone-icon,
  html body .site-common-header .landing-chat-phone:active .header-phone-icon {
    flex: 0 0 42px !important;
    position: static !important;
    inset: auto !important;
    width: 42px !important;
    height: 42px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 0 !important;
    border-radius: 13px !important;
    background: #1267ee !important;
    color: #fff !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
  }

  html body .site-common-header .header-phone-icon svg {
    width: 27px !important;
    height: 27px !important;
    display: block !important;
    overflow: visible !important;
    fill: currentColor !important;
    stroke: none !important;
    transition: none !important;
    animation: none !important;
  }

  html body .site-common-header .header-phone-label {
    position: static !important;
    inset: auto !important;
    display: block !important;
    color: #fff !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: -.02em !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
  }

  html body .sticky-bottom-nav:not(#sticky-nav-reference),
  html body .sticky-bottom-nav:not(#sticky-nav-reference) .sticky-bottom-nav-item,
  html body .sticky-bottom-nav:not(#sticky-nav-reference) .sticky-bottom-nav-item:hover,
  html body .sticky-bottom-nav:not(#sticky-nav-reference) .sticky-bottom-nav-item:focus,
  html body .sticky-bottom-nav:not(#sticky-nav-reference) .sticky-bottom-nav-item:focus-visible,
  html body .sticky-bottom-nav:not(#sticky-nav-reference) .sticky-bottom-nav-item:active {
    background-color: #fff !important;
    background-image: none !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
  }

  html body .sticky-bottom-nav:not(#sticky-nav-reference) .sticky-bottom-nav-icon,
  html body .sticky-bottom-nav:not(#sticky-nav-reference) .sticky-bottom-nav-phone,
  html body .sticky-bottom-nav:not(#sticky-nav-reference) .sticky-bottom-nav-item:hover .sticky-bottom-nav-icon,
  html body .sticky-bottom-nav:not(#sticky-nav-reference) .sticky-bottom-nav-item:focus .sticky-bottom-nav-icon,
  html body .sticky-bottom-nav:not(#sticky-nav-reference) .sticky-bottom-nav-item:active .sticky-bottom-nav-icon {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
  }

  html body .sticky-bottom-nav:not(#sticky-nav-reference) .sticky-bottom-nav-icon::before,
  html body .sticky-bottom-nav:not(#sticky-nav-reference) .sticky-bottom-nav-icon::after {
    display: none !important;
    content: none !important;
  }

  html body .sticky-bottom-nav:not(#sticky-nav-reference) .sticky-bottom-nav-icon-rocket,
  html body .sticky-bottom-nav:not(#sticky-nav-reference) .sticky-bottom-nav-icon-tune,
  html body .sticky-bottom-nav:not(#sticky-nav-reference) .sticky-bottom-nav-item:hover .sticky-bottom-nav-icon-rocket,
  html body .sticky-bottom-nav:not(#sticky-nav-reference) .sticky-bottom-nav-item:hover .sticky-bottom-nav-icon-tune,
  html body .sticky-bottom-nav:not(#sticky-nav-reference) .sticky-bottom-nav-item:focus .sticky-bottom-nav-icon-rocket,
  html body .sticky-bottom-nav:not(#sticky-nav-reference) .sticky-bottom-nav-item:focus .sticky-bottom-nav-icon-tune,
  html body .sticky-bottom-nav:not(#sticky-nav-reference) .sticky-bottom-nav-item:active .sticky-bottom-nav-icon-rocket,
  html body .sticky-bottom-nav:not(#sticky-nav-reference) .sticky-bottom-nav-item:active .sticky-bottom-nav-icon-tune {
    background-color: currentColor !important;
    background-image: none !important;
  }

  body.home-page #specials-preview .popular-vehicle-image {
    background: #f5f7fa !important;
  }

  body.home-page #specials-preview .popular-vehicle-card[data-popular-card-href] {
    cursor: pointer !important;
  }

  body.home-page .site-common-footer.landing-footer {
    align-items: center !important;
    text-align: center !important;
  }

  body.home-page .site-common-footer .site-footer-brand {
    justify-content: center !important;
  }

  body.home-page .site-common-footer .site-footer-details {
    text-align: center !important;
  }

  body.home-page .site-common-footer .site-footer-business {
    justify-content: center !important;
  }

  body.home-page .site-common-footer .site-footer-business-item,
  body.home-page .site-common-footer .site-footer-business-item:first-child,
  body.home-page .site-common-footer .site-footer-business-item + .site-footer-business-item {
    text-align: center !important;
  }

  body.home-page .site-common-footer .site-footer-lower {
    justify-content: center !important;
  }
}

/* Desktop header navigation: phone action is replaced by the shared My entry. */
@media (min-width: 761px) {
  html body #realq-site-header.site-common-header {
    grid-template-columns: auto minmax(0, 1fr) auto !important;
  }

  html body #realq-site-header .realq-desktop-header-nav {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    z-index: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: translate(-50%, -50%) !important;
  }

  html body #realq-site-header .realq-desktop-header-nav a {
    min-height: 42px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 18px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    color: #071c3d !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: -.02em !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    box-shadow: none !important;
  }

  html body #realq-site-header .realq-desktop-header-nav a:hover,
  html body #realq-site-header .realq-desktop-header-nav a:focus-visible {
    background: #f1f6fd !important;
    color: #1267ee !important;
  }

  html body #realq-site-header .header-mobile-phone {
    display: none !important;
  }

  html body #realq-site-header .landing-contact-actions {
    width: auto !important;
    min-width: 46px !important;
    height: 54px !important;
  }

  html body #realq-site-header .header-my-link {
    width: 46px !important;
    min-width: 46px !important;
    height: 46px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #071c3d !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    box-shadow: none !important;
  }

  html body #realq-site-header .header-my-link:hover,
  html body #realq-site-header .header-my-link:focus-visible {
    border: 0 !important;
    background: transparent !important;
    color: #1267ee !important;
  }

  html body #realq-site-header .header-my-icon,
  html body #realq-site-header .header-my-icon img {
    width: 22px !important;
    height: 22px !important;
    display: block !important;
  }
}

@media (max-width: 760px) {
  html body #realq-site-header .realq-desktop-header-nav,
  html body #realq-site-header .header-my-link {
    display: none !important;
  }
}