/* Final homepage overrides run after the page-builder and theme styles. */
@media (min-width: 701px) {
  html body.page-home .os-category-grid > a {
    background-image: linear-gradient(180deg, rgba(8, 28, 24, .04) 8%, rgba(8, 28, 24, .76) 100%), url('/assets/img/home-category-contact-sheet-v1.png') !important;
    background-size: cover, 400% 200% !important;
    background-position: center, var(--category-image-position, 0% 0%) !important;
    background-repeat: no-repeat !important;
  }

  html body.page-home form#rh-home-search button.os-search-button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
  }

  html body.page-home form#rh-home-search button.os-search-button > svg.ui-icon.ui-icon-search {
    position: static !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 18px !important;
    height: 18px !important;
    inset: auto !important;
    margin: 0 !important;
    transform: none !important;
    color: #fff !important;
    flex: 0 0 18px !important;
  }

  html body.page-home form#rh-home-search button.os-search-button > span {
    display: inline !important;
  }
}

/* Make every category icon badge use the same glass treatment and icon color. */
@media (min-width: 701px) {
  html body.page-home .os-category-grid .os-cat-icon {
    width: 40px !important;
    height: 40px !important;
    border: 1px solid rgba(255,255,255,.58) !important;
    border-radius: 12px !important;
    background: rgba(255,255,255,.22) !important;
    color: #fff !important;
    backdrop-filter: blur(5px) !important;
    -webkit-backdrop-filter: blur(5px) !important;
  }
  html body.page-home .os-category-grid .os-cat-icon > svg.ui-icon {
    width: 20px !important;
    height: 20px !important;
    color: #fff !important;
  }
}
/* Put the full blue search button in the marked desktop slot at the far left. */
@media (min-width: 1200px) {
  html body.page-home form#rh-home-search {
    position: relative !important;
  }
  html body.page-home form#rh-home-search button.os-search-button {
    position: absolute !important;
    left: 12px !important;
    right: auto !important;
    top: 8px !important;
    bottom: 8px !important;
    width: 150px !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    z-index: 10 !important;
  }
}