
/* V13: mobile home text overlay + sticky detail tabs across all screens */

/* ---------- HOME: mobile/smaller screens only ---------- */
@media (max-width: 600px){
  .home-page .reference-home-hero{
    min-height: 430px !important;
    padding: 0 !important;
    overflow: hidden !important;
  }
  .home-page .reference-home-hero .blueprint{
    display: none !important;
  }
  .home-page .reference-home-hero .hero-media{
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
  }
  .home-page .reference-home-hero .hero-video-clip{
    position: absolute !important;
    inset: 0 !important;
  }
  .home-page .reference-home-hero .hero-video-clip::after{
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
    background:
      linear-gradient(90deg, rgba(4,33,75,.50) 0%, rgba(4,33,75,.28) 24%, rgba(4,33,75,.08) 46%, rgba(4,33,75,0) 64%),
      linear-gradient(180deg, rgba(0,0,0,.10) 0%, rgba(0,0,0,0) 34%, rgba(0,0,0,.06) 100%) !important;
  }
  .home-page .reference-home-hero .hero-video-clip video{
    object-position: 66% center !important;
    transform: scale(1.02) !important;
    filter: brightness(.82) contrast(1.02) !important;
  }
  .home-page .reference-home-hero .hero-copy{
    position: absolute !important;
    left: 16px !important;
    top: 108px !important;
    z-index: 8 !important;
    width: min(42%, 180px) !important;
    max-width: 180px !important;
    padding: 0 !important;
    margin: 0 !important;
    color: #fff !important;
    text-shadow: 0 1px 2px rgba(0,0,0,.25) !important;
  }
  .home-page .reference-home-hero .hero-copy .eyebrow,
  .home-page .reference-home-hero .hero-copy p{
    color: #eef4ff !important;
  }
  .home-page .reference-home-hero .hero-copy h1{
    color: #ffffff !important;
    font-size: 14px !important;
    line-height: 1.15 !important;
    letter-spacing: -.01em !important;
    margin: 6px 0 10px !important;
    max-width: 100% !important;
  }
  .home-page .reference-home-hero .hero-copy p{
    font-size: 10px !important;
    line-height: 1.35 !important;
    margin: 0 0 8px !important;
    max-width: 95% !important;
  }
  .home-page .reference-home-hero .hero-copy .actions{
    display: none !important;
  }
  .home-page .reference-home-hero .stock-cards{
    z-index: 9 !important;
  }
}

/* ---------- PRODUCT/SERVICE DETAIL: sticky tabs until end of detail content ---------- */
.detail-content-shell{
  position: relative;
}
.detail-content-shell .detail-tabs{
  position: sticky !important;
  top: var(--detail-sticky-top, 92px) !important;
  z-index: 48 !important;
  background: rgba(255,255,255,.96) !important;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(12,58,120,.08);
  box-shadow: 0 8px 20px rgba(16,33,64,.06);
  border-radius: 14px;
  margin: 0 auto 14px !important;
  padding: 6px 8px !important;
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
  scrollbar-width: none;
}
.detail-content-shell .detail-tabs::-webkit-scrollbar{
  display: none;
}
.detail-content-shell .detail-tabs a{
  scroll-margin-top: var(--detail-scroll-margin, 150px);
}
.detail-content-shell #overview,
.detail-content-shell #specifications,
.detail-content-shell #applications,
.detail-content-shell #faqs,
.detail-content-shell .mobile-detail details[data-section]{
  scroll-margin-top: var(--detail-scroll-margin, 150px) !important;
}
.detail-content-shell .detail-tabs a.active{
  background: linear-gradient(180deg, #ffffff 0%, #f4f8ff 100%) !important;
  color: #0a3d86 !important;
  box-shadow: inset 0 -2px 0 #0a4ea3;
}
@media (max-width: 980px){
  .detail-content-shell .detail-tabs{
    justify-content: flex-start !important;
    gap: 6px !important;
    padding-inline: 10px !important;
  }
}
@media (max-width: 600px){
  .detail-content-shell .detail-tabs{
    top: var(--detail-sticky-top, 82px) !important;
    border-radius: 12px !important;
  }
  .detail-content-shell .detail-tabs a{
    flex: 0 0 auto !important;
    padding: 10px 14px !important;
    font-size: 12px !important;
  }

  /* keep product/service hero text in the white area */
  .detail-page .reference-detail-hero{
    position: relative !important;
    overflow: hidden !important;
  }
  .detail-page .reference-detail-hero .detail-hero-copy{
    position: absolute !important;
    left: 14px !important;
    top: 94px !important;
    width: 40% !important;
    max-width: 145px !important;
    z-index: 7 !important;
    background: transparent !important;
    padding: 0 !important;
  }
  .detail-page .reference-detail-hero .detail-hero-copy h1{
    font-size: 18px !important;
    line-height: 1.08 !important;
    margin: 6px 0 6px !important;
  }
  .detail-page .reference-detail-hero .detail-hero-copy p{
    font-size: 10px !important;
    line-height: 1.3 !important;
    max-width: 100% !important;
  }
}
