/*
 * Veridian Health 2.6.50
 * Ivy layout refinement:
 * - restore the hero/banner to the normal centered content width
 * - keep the desktop Quick Start rail fixed at the viewport centre-left
 * - remove the broad translucent white panels behind New Products / Featured Collection
 * - preserve individual readable product cards over the ivy wall
 */

/* --------------------------------------------------------------------------
   QUICK START GUIDE — keep it attached to the viewport, not the header.
   The 2.6.49 backdrop-filter on #header created a fixed-position containing
   block in browsers, which pulled the guide into the top-left header area.
   -------------------------------------------------------------------------- */
#header {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
  transform: none !important;
  contain: none !important;
}

.vh-guidebar {
  position: fixed !important;
  left: 9px !important;
  top: 50vh !important;
  right: auto !important;
  bottom: auto !important;
  z-index: 1000 !important;
  transform: translateY(-50%) !important;
}

@media (max-height: 650px) and (min-width: 1200px) {
  .vh-guidebar {
    top: 52vh !important;
    transform: translateY(-50%) scale(.94) !important;
    transform-origin: left center !important;
  }
}

/* --------------------------------------------------------------------------
   HOME HERO — return it to the same centred width as the homepage content.
   The source image is not enlarged, blurred or stretched.
   -------------------------------------------------------------------------- */
#index .image-slider-block {
  float: none !important;
  clear: both !important;
  width: calc(100% - 48px) !important;
  max-width: 1320px !important;
  margin: 24px auto 34px !important;
  overflow: hidden !important;
  border-radius: 16px !important;
  box-shadow: 0 10px 28px rgba(29, 50, 18, .16) !important;
}

#index .image-slider-block > .carousel,
#index .image-slider-block .carousel-inner,
#index .image-slider-block .carousel-item,
#index .image-slider-block .carousel-item figure {
  width: 100% !important;
  max-width: 100% !important;
  border-radius: inherit !important;
}

#index .image-slider-block .carousel-item figure {
  margin: 0 !important;
}

#index .image-slider-block .carousel-item figure > img:not(.vh-unified-blur-image) {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
}

/* --------------------------------------------------------------------------
   NEW PRODUCTS / FEATURED COLLECTION — no large white/translucent slab.
   Only the actual product cards remain light for readability.
   -------------------------------------------------------------------------- */
#index section.featured-products,
#index section.new-products,
#index .featured-products,
#index .new-products,
#index .homefeatured,
#index .products,
#index .product-slider,
#index .product-slider.owl-carousel,
#index .product-slider .owl-wrapper-outer,
#index .product-slider .owl-wrapper,
#index .featured-products .products,
#index .new-products .products,
#index .featured-products .product-slider,
#index .new-products .product-slider {
  background: transparent !important;
  background-color: transparent !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
}

/* Keep the section itself aligned with the hero, like the supplied mock-up. */
#index section.featured-products,
#index section.new-products,
#index .featured-products,
#index .new-products {
  width: calc(100% - 48px) !important;
  max-width: 1320px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  border-radius: 0 !important;
}

/* Titles sit directly over the ivy wall rather than on a washed-out strip. */
#index .products-section-title,
#index .featured-products .products-section-title,
#index .new-products .products-section-title,
#index .section-title {
  display: block !important;
  width: 100% !important;
  margin: 0 0 18px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  color: #f7f3e9 !important;
  text-shadow: 0 2px 5px rgba(22, 49, 15, .78) !important;
}

/* Individual cards match the clean mock-up: solid readable surfaces on ivy. */
#index .featured-products .owl-item,
#index .new-products .owl-item {
  padding-left: 7px !important;
  padding-right: 7px !important;
  box-sizing: border-box !important;
  background: transparent !important;
}

#index .featured-products .owl-item > .product-item,
#index .new-products .owl-item > .product-item,
#index .featured-products .product-miniature,
#index .new-products .product-miniature,
#index .featured-products .thumbnail-container,
#index .new-products .thumbnail-container {
  background: rgba(255, 255, 255, .97) !important;
  border-radius: 14px !important;
}

#index .featured-products .product-miniature,
#index .new-products .product-miniature {
  overflow: hidden !important;
  box-shadow: 0 8px 20px rgba(24, 43, 16, .12) !important;
}

/* Do not re-introduce the 2.6.49 section blur on homepage cards/titles. */
#index .featured-products,
#index .new-products,
#index .featured-products *,
#index .new-products * {
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

/* Header stays clean/cream like the visual reference, without affecting
   the fixed Quick Start guide positioning. */
#header .header-nav,
#header .header-top {
  background-color: rgba(250, 250, 246, .97) !important;
}

/* --------------------------------------------------------------------------
   MOBILE
   -------------------------------------------------------------------------- */
@media (max-width: 767.98px) {
  #index .image-slider-block,
  #index section.featured-products,
  #index section.new-products,
  #index .featured-products,
  #index .new-products {
    width: calc(100% - 20px) !important;
    max-width: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  #index .image-slider-block {
    margin-top: 12px !important;
    margin-bottom: 22px !important;
    border-radius: 12px !important;
    box-shadow: 0 7px 18px rgba(29, 50, 18, .14) !important;
  }

  #index .products-section-title,
  #index .featured-products .products-section-title,
  #index .new-products .products-section-title,
  #index .section-title {
    margin-bottom: 12px !important;
    font-size: 25px !important;
  }

  #index .featured-products .owl-item,
  #index .new-products .owl-item {
    padding-left: 4px !important;
    padding-right: 4px !important;
  }
}