/* Canonical rules that must load after every page-specific stylesheet. */
.page-banner {
  position: relative;
  width: min(92%, 1600px);
  min-height: 280px;
  margin: 24px auto 0;
  overflow: hidden;
  border-radius: 22px;
  background-position: center;
  background-size: cover;
  box-shadow: 0 16px 38px rgba(18, 52, 105, .16);
  color: #fff;
}
.page-banner::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(4, 25, 68, .84), rgba(7, 47, 104, .56) 52%, rgba(7, 47, 104, .16)); }
.page-banner--rd { background-image: url('../img/rd-banner.webp'); }
.page-banner--products { background-image: url('../img/products-banner.webp'); }
.page-banner--about { background-image: url('../img/about-banner.webp'); }
.page-banner--news { background-image: url('../img/news-banner.webp'); }
.page-banner--contact { background-image: url('../images/contact-banner.webp'); }
.page-banner-inner { position: relative; z-index: 1; width: min(620px, 58%); padding: 62px 0 56px 6%; box-sizing: border-box; }
.page-banner-inner > span { display: block; margin-bottom: 10px; color: #bcdcff; font-size: 13px; font-weight: 700; letter-spacing: .16em; }
.page-banner-inner h1 { margin: 0; color: #fff; font-size: 40px; line-height: 1.25; letter-spacing: .04em; text-shadow: 0 2px 8px rgba(0, 20, 58, .25); }
.page-banner-inner p { margin: 15px 0 0; color: rgba(255, 255, 255, .94); font-size: 16px; line-height: 1.8; }
.nav-trigger[href] { display: inline-flex; align-items: center; }
.gut-detail-nav .gut-nav-link { box-sizing: border-box; color: inherit; text-decoration: none; }
.sample-access-jump {
  display: flex;
  width: min(100%, 520px);
  min-height: 66px;
  margin: 24px auto 0;
  padding: 12px 24px;
  box-sizing: border-box;
  align-items: center;
  justify-content: center;
  gap: 13px;
  border: 1px solid #bcd3f1;
  border-radius: 15px;
  background: linear-gradient(135deg, #f8fbff, #eaf3ff);
  box-shadow: 0 10px 24px rgba(26, 87, 166, .12);
  color: #155bbf;
  font-size: 17px;
  font-weight: 700;
  text-decoration: none;
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.sample-access-jump:hover { transform: translateY(-2px); border-color: #79a9e8; box-shadow: 0 14px 30px rgba(26, 87, 166, .18); color: #0e4fa9; }
.sample-access-click { display: inline-flex; width: 40px; height: 40px; align-items: center; justify-content: center; border-radius: 50%; background: #1766d8; color: #fff; line-height: 1; animation: sample-access-tap 1.35s ease-in-out infinite; }
.sample-access-click svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.sample-access-click .sample-access-ray { stroke-width: 2; animation: sample-access-rays 1.35s ease-in-out infinite; }
@keyframes sample-access-tap { 0%, 100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(23, 102, 216, .28); } 45% { transform: scale(.9); box-shadow: 0 0 0 8px rgba(23, 102, 216, 0); } }
@keyframes sample-access-rays { 0%, 100% { opacity: 1; } 45% { opacity: .25; } }
@media (prefers-reduced-motion: reduce) { .sample-access-click, .sample-access-click .sample-access-ray { animation: none; } }
@media (max-width: 900px) {
  body > .unified-site-header {
    position: -webkit-sticky !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 10000 !important;
    overflow: visible !important;
    isolation: isolate;
  }
  body > .unified-site-header .mobile-header-actions,
  body > .unified-site-header .mobile-nav-toggle {
    position: relative;
    z-index: 10002 !important;
  }
  body > .unified-site-header .main-nav,
  body > .unified-site-header .header-search-inline {
    z-index: 10001 !important;
  }
  body > .unified-site-header.is-mobile-open .main-nav {
    display: flex !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: calc(100dvh - 64px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    flex-direction: column !important;
    align-items: stretch !important;
  }
  .page-banner { width: 92%; min-height: 220px; margin-top: 16px; border-radius: 16px; }
  .page-banner-inner { width: 82%; padding: 42px 0 38px 7%; }
  .page-banner-inner h1 { font-size: 31px; }
  .page-banner-inner p { font-size: 14px; line-height: 1.7; }
  .unified-site-header {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 64px !important;
    height: 64px !important;
    margin: 0 !important;
    padding: 8px 16px !important;
    box-sizing: border-box !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
  }
  .unified-site-header .brand {
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: 1 1 auto !important;
    overflow: hidden !important;
  }
  .unified-site-header .brand-copy {
    width: auto !important;
    min-width: 0 !important;
    overflow: hidden !important;
  }
  .unified-site-header .header-logo-img {
    width: auto !important;
    height: 46px !important;
  }
  .unified-site-header .brand-copy h1 {
    margin: 0 !important;
    font-size: clamp(17px, 4.8vw, 22px) !important;
    line-height: 1.15 !important;
    white-space: nowrap !important;
  }
  .mobile-header-actions {
    display: flex !important;
    width: auto !important;
    max-width: none !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    gap: 6px !important;
  }
  .mobile-search-toggle,
  .unified-site-header .mobile-nav-toggle {
    display: inline-flex !important;
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    flex: 0 0 42px !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
  }
  .unified-site-header .header-search-inline { display: none !important; }
  .unified-site-header.is-search-open .header-search-inline { display: flex !important; }
  .sample-access-jump { min-height: 60px; padding: 10px 16px; font-size: 16px; }
}
@media (max-width: 360px) {
  .page-banner { min-height: 200px; }
  .page-banner-inner { width: 92%; padding: 34px 18px; }
  .page-banner-inner h1 { font-size: 28px; }
  .unified-site-header { padding-inline: 10px !important; }
  .unified-site-header .brand-copy { display: none !important; }
}