/*
 * Last-mile visibility and bag module lock.
 * Keep this at the end so legacy reveal and bag-card selectors cannot win.
 */

.hero .reveal,
#solutions .reveal,
#applications .reveal,
#bag-types .reveal,
body.home.front-page .hero .reveal,
body.home.front-page #solutions .reveal,
body.home.front-page #applications .reveal,
body.home.front-page #bag-types .reveal,
body.pdl-static-theme-preview .hero .reveal,
body.pdl-static-theme-preview #solutions .reveal,
body.pdl-static-theme-preview #applications .reveal,
body.pdl-static-theme-preview #bag-types .reveal {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
}

/* Approved collection entry added after the frozen four-format presentation. */
.bag-more-entry {
  display: flex;
  justify-content: center;
  margin-top: 22px;
}

.bag-more-entry a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 8px 14px;
  color: rgba(255, 255, 255, .88);
  font-size: .86rem;
  font-weight: 750;
  text-decoration: none;
}

.bag-more-entry a::after {
  content: "";
  width: 7px;
  height: 7px;
  border-top: 1.5px solid currentColor;
  border-right: 1.5px solid currentColor;
  transform: rotate(45deg);
  transition: transform 180ms ease;
}

.bag-more-entry a:hover,
.bag-more-entry a:focus-visible {
  color: #fff;
}

.bag-more-entry a:hover::after,
.bag-more-entry a:focus-visible::after {
  transform: translateX(3px) rotate(45deg);
}

@media (max-width: 720px) {
  .bag-more-entry {
    margin-top: 10px;
  }

  .bag-more-entry a {
    min-height: 40px;
    font-size: .8rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .bag-more-entry a::after {
    transition: none !important;
  }
}

#bag-types.bag-section,
body.home.front-page #bag-types.bag-section,
body.pdl-static-theme-preview #bag-types.bag-section {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  padding-block: clamp(86px, 7vw, 112px) !important;
  background:
    linear-gradient(180deg, rgba(4, 15, 27, .94) 0%, rgba(6, 25, 43, .88) 48%, rgba(5, 18, 33, .94) 100%),
    url("../../images/hero/quick-quote-product-family.webp") center 48% / cover no-repeat !important;
  color: #fff !important;
}

#bag-types.bag-section::before,
body.home.front-page #bag-types.bag-section::before,
body.pdl-static-theme-preview #bag-types.bag-section::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -1 !important;
  display: block !important;
  background:
    radial-gradient(circle at 18% 12%, rgba(39, 141, 224, .2), transparent 34%),
    radial-gradient(circle at 84% 20%, rgba(42, 191, 172, .14), transparent 36%),
    rgba(2, 10, 20, .32) !important;
  backdrop-filter: blur(1.5px) saturate(.9) !important;
}

#bag-types .section-heading,
body.home.front-page #bag-types .section-heading,
body.pdl-static-theme-preview #bag-types .section-heading {
  position: relative !important;
  z-index: 2 !important;
  opacity: 1 !important;
  color: #fff !important;
}

#bag-types .chapter-number,
#bag-types h2,
#bag-types .section-heading p,
body.home.front-page #bag-types .chapter-number,
body.home.front-page #bag-types h2,
body.home.front-page #bag-types .section-heading p,
body.pdl-static-theme-preview #bag-types .chapter-number,
body.pdl-static-theme-preview #bag-types h2,
body.pdl-static-theme-preview #bag-types .section-heading p {
  color: #fff !important;
}

#bag-types .section-heading p,
body.home.front-page #bag-types .section-heading p,
body.pdl-static-theme-preview #bag-types .section-heading p {
  color: rgba(225, 239, 249, .78) !important;
}

#bag-types .bag-mobile-shell,
body.home.front-page #bag-types .bag-mobile-shell,
body.pdl-static-theme-preview #bag-types .bag-mobile-shell,
#bag-types [data-deck="bags"],
body.home.front-page #bag-types [data-deck="bags"],
body.pdl-static-theme-preview #bag-types [data-deck="bags"] {
  position: relative !important;
  z-index: 2 !important;
}

#bag-types [data-deck="bags"],
body.home.front-page #bag-types [data-deck="bags"],
body.pdl-static-theme-preview #bag-types [data-deck="bags"] {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(18px, 2.1vw, 28px) !important;
  align-items: stretch !important;
  overflow: visible !important;
}

#bag-types [data-deck="bags"] .bag-card,
#bag-types [data-deck="bags"] .bag-card:hover,
#bag-types [data-deck="bags"] .bag-card:focus-within,
body.home.front-page #bag-types [data-deck="bags"] .bag-card,
body.home.front-page #bag-types [data-deck="bags"] .bag-card:hover,
body.home.front-page #bag-types [data-deck="bags"] .bag-card:focus-within,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card:hover,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card:focus-within {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto auto !important;
  justify-items: center !important;
  align-content: start !important;
  min-height: clamp(310px, 24vw, 350px) !important;
  width: 100% !important;
  padding: 28px 18px 24px !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 22px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #fff !important;
  opacity: 1 !important;
  transform: translate3d(0, 0, 0) !important;
  transition: transform 240ms cubic-bezier(.22, .8, .25, 1) !important;
  isolation: isolate !important;
}

#bag-types [data-deck="bags"] .bag-card::before,
body.home.front-page #bag-types [data-deck="bags"] .bag-card::before,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -1 !important;
  display: block !important;
  border-radius: inherit !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .045), rgba(255, 255, 255, .018)) !important;
  opacity: .72 !important;
  pointer-events: none !important;
}

#bag-types [data-deck="bags"] .bag-card::after,
body.home.front-page #bag-types [data-deck="bags"] .bag-card::after,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 3 !important;
  display: block !important;
  border: 1px solid rgba(116, 190, 255, .78) !important;
  border-radius: inherit !important;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, .08) inset,
    0 0 24px rgba(54, 152, 255, .32),
    0 0 54px rgba(54, 152, 255, .18) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 220ms ease, box-shadow 220ms ease !important;
}

#bag-types [data-deck="bags"] .bag-card:hover,
#bag-types [data-deck="bags"] .bag-card:focus-within,
body.home.front-page #bag-types [data-deck="bags"] .bag-card:hover,
body.home.front-page #bag-types [data-deck="bags"] .bag-card:focus-within,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card:hover,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card:focus-within {
  transform: translate3d(0, -5px, 0) !important;
}

#bag-types [data-deck="bags"] .bag-card:hover::after,
#bag-types [data-deck="bags"] .bag-card:focus-within::after,
body.home.front-page #bag-types [data-deck="bags"] .bag-card:hover::after,
body.home.front-page #bag-types [data-deck="bags"] .bag-card:focus-within::after,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card:hover::after,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card:focus-within::after {
  opacity: 1 !important;
}

#bag-types [data-deck="bags"] .bag-card img,
#bag-types [data-deck="bags"] .bag-card:hover img,
#bag-types [data-deck="bags"] .bag-card:focus-within img,
body.home.front-page #bag-types [data-deck="bags"] .bag-card img,
body.home.front-page #bag-types [data-deck="bags"] .bag-card:hover img,
body.home.front-page #bag-types [data-deck="bags"] .bag-card:focus-within img,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card img,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card:hover img,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card:focus-within img {
  display: block !important;
  width: min(88%, 248px) !important;
  height: 220px !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 auto 16px !important;
  padding: 0 !important;
  object-fit: contain !important;
  background: transparent !important;
  filter: drop-shadow(0 24px 28px rgba(0, 0, 0, .42)) !important;
  transform: none !important;
}

#bag-types [data-deck="bags"] .bag-card > div,
#bag-types [data-deck="bags"] .bag-card:hover > div,
#bag-types [data-deck="bags"] .bag-card:focus-within > div,
body.home.front-page #bag-types [data-deck="bags"] .bag-card > div,
body.home.front-page #bag-types [data-deck="bags"] .bag-card:hover > div,
body.home.front-page #bag-types [data-deck="bags"] .bag-card:focus-within > div,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card > div,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card:hover > div,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card:focus-within > div {
  display: grid !important;
  justify-items: center !important;
  align-content: start !important;
  gap: 8px !important;
  width: 100% !important;
  max-width: 230px !important;
  min-height: 0 !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  color: #fff !important;
  text-align: center !important;
}

#bag-types [data-deck="bags"] .bag-card h3,
body.home.front-page #bag-types [data-deck="bags"] .bag-card h3,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card h3 {
  margin: 0 !important;
  color: #fff !important;
  font-size: clamp(1.32rem, 1.35vw, 1.58rem) !important;
  line-height: 1.14 !important;
  font-weight: 900 !important;
}

#bag-types [data-deck="bags"] .bag-card p,
#bag-types [data-deck="bags"] .bag-card span,
body.home.front-page #bag-types [data-deck="bags"] .bag-card p,
body.home.front-page #bag-types [data-deck="bags"] .bag-card span,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card p,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card span {
  margin: 0 !important;
  color: rgba(229, 244, 252, .86) !important;
  font-size: .92rem !important;
  line-height: 1.42 !important;
}

#bag-types [data-deck="bags"] .bag-card span,
body.home.front-page #bag-types [data-deck="bags"] .bag-card span,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card span {
  color: rgba(166, 232, 216, .9) !important;
  font-size: .82rem !important;
  font-weight: 800 !important;
}

#bag-types [data-deck="bags"] .bag-card a,
body.home.front-page #bag-types [data-deck="bags"] .bag-card a,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card a {
  color: #7fd2ff !important;
  font-size: .84rem !important;
  font-weight: 900 !important;
  text-decoration: none !important;
}

@media (max-width: 980px) {
  #bag-types [data-deck="bags"],
  body.home.front-page #bag-types [data-deck="bags"],
  body.pdl-static-theme-preview #bag-types [data-deck="bags"] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 720px) {
  #bag-types.bag-section,
  body.home.front-page #bag-types.bag-section,
  body.pdl-static-theme-preview #bag-types.bag-section {
    padding: 52px 0 118px !important;
  }

  #bag-types [data-deck="bags"],
  body.home.front-page #bag-types [data-deck="bags"],
  body.pdl-static-theme-preview #bag-types [data-deck="bags"] {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  #bag-types [data-deck="bags"] .bag-card,
  #bag-types [data-deck="bags"] .bag-card:hover,
  #bag-types [data-deck="bags"] .bag-card:focus-within,
  body.home.front-page #bag-types [data-deck="bags"] .bag-card,
  body.home.front-page #bag-types [data-deck="bags"] .bag-card:hover,
  body.home.front-page #bag-types [data-deck="bags"] .bag-card:focus-within,
  body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card,
  body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card:hover,
  body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card:focus-within {
    min-height: 318px !important;
    padding: 24px 16px 22px !important;
  }
}

/* Bag card internal order lock. */
#bag-types [data-deck="bags"] .bag-card,
#bag-types [data-deck="bags"] .bag-card:hover,
#bag-types [data-deck="bags"] .bag-card:focus-within,
body.home.front-page #bag-types [data-deck="bags"] .bag-card,
body.home.front-page #bag-types [data-deck="bags"] .bag-card:hover,
body.home.front-page #bag-types [data-deck="bags"] .bag-card:focus-within,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card:hover,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card:focus-within {
  grid-template-rows: 236px minmax(0, auto) !important;
  align-content: center !important;
}

#bag-types [data-deck="bags"] .bag-card::before,
body.home.front-page #bag-types [data-deck="bags"] .bag-card::before,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card::before {
  opacity: 0 !important;
}

#bag-types [data-deck="bags"] .bag-card:hover::before,
#bag-types [data-deck="bags"] .bag-card:focus-within::before,
body.home.front-page #bag-types [data-deck="bags"] .bag-card:hover::before,
body.home.front-page #bag-types [data-deck="bags"] .bag-card:focus-within::before,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card:hover::before,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card:focus-within::before {
  opacity: .1 !important;
}

#bag-types [data-deck="bags"] .bag-card img,
#bag-types [data-deck="bags"] .bag-card:hover img,
#bag-types [data-deck="bags"] .bag-card:focus-within img,
body.home.front-page #bag-types [data-deck="bags"] .bag-card img,
body.home.front-page #bag-types [data-deck="bags"] .bag-card:hover img,
body.home.front-page #bag-types [data-deck="bags"] .bag-card:focus-within img,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card img,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card:hover img,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card:focus-within img {
  grid-column: 1 !important;
  grid-row: 1 !important;
  align-self: end !important;
  justify-self: center !important;
  margin: 0 auto 14px !important;
}

#bag-types [data-deck="bags"] .bag-card > div,
#bag-types [data-deck="bags"] .bag-card:hover > div,
#bag-types [data-deck="bags"] .bag-card:focus-within > div,
body.home.front-page #bag-types [data-deck="bags"] .bag-card > div,
body.home.front-page #bag-types [data-deck="bags"] .bag-card:hover > div,
body.home.front-page #bag-types [data-deck="bags"] .bag-card:focus-within > div,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card > div,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card:hover > div,
body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card:focus-within > div {
  grid-column: 1 !important;
  grid-row: 2 !important;
  align-self: start !important;
  justify-self: center !important;
}

@media (max-width: 720px) {
  #bag-types [data-deck="bags"] .bag-card,
  #bag-types [data-deck="bags"] .bag-card:hover,
  #bag-types [data-deck="bags"] .bag-card:focus-within,
  body.home.front-page #bag-types [data-deck="bags"] .bag-card,
  body.home.front-page #bag-types [data-deck="bags"] .bag-card:hover,
  body.home.front-page #bag-types [data-deck="bags"] .bag-card:focus-within,
  body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card,
  body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card:hover,
  body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card:focus-within {
    grid-template-rows: 210px minmax(0, auto) !important;
  }
}

@media (max-width: 720px) {
  #bag-types .bag-mobile-shell,
  body.home.front-page #bag-types .bag-mobile-shell,
  body.pdl-static-theme-preview #bag-types .bag-mobile-shell {
    overflow: visible !important;
  }

  #bag-types [data-deck="bags"],
  body.home.front-page #bag-types [data-deck="bags"],
  body.pdl-static-theme-preview #bag-types [data-deck="bags"] {
    display: grid !important;
    grid-auto-flow: row !important;
    grid-auto-columns: auto !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    scroll-snap-type: none !important;
    touch-action: auto !important;
  }

  #bag-types [data-deck="bags"] .bag-card,
  #bag-types [data-deck="bags"] .bag-card:hover,
  #bag-types [data-deck="bags"] .bag-card:focus-within,
  body.home.front-page #bag-types [data-deck="bags"] .bag-card,
  body.home.front-page #bag-types [data-deck="bags"] .bag-card:hover,
  body.home.front-page #bag-types [data-deck="bags"] .bag-card:focus-within,
  body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card,
  body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card:hover,
  body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card:focus-within {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 238px !important;
    height: auto !important;
    grid-template-rows: 122px minmax(0, auto) !important;
    padding: 18px 10px 16px !important;
    border-radius: 18px !important;
    scroll-snap-align: none !important;
  }

  #bag-types [data-deck="bags"] .bag-card img,
  #bag-types [data-deck="bags"] .bag-card:hover img,
  #bag-types [data-deck="bags"] .bag-card:focus-within img,
  body.home.front-page #bag-types [data-deck="bags"] .bag-card img,
  body.home.front-page #bag-types [data-deck="bags"] .bag-card:hover img,
  body.home.front-page #bag-types [data-deck="bags"] .bag-card:focus-within img,
  body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card img,
  body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card:hover img,
  body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card:focus-within img {
    width: min(100%, 124px) !important;
    height: 112px !important;
    margin-bottom: 10px !important;
  }

  #bag-types [data-deck="bags"] .bag-card > div,
  #bag-types [data-deck="bags"] .bag-card:hover > div,
  #bag-types [data-deck="bags"] .bag-card:focus-within > div,
  body.home.front-page #bag-types [data-deck="bags"] .bag-card > div,
  body.home.front-page #bag-types [data-deck="bags"] .bag-card:hover > div,
  body.home.front-page #bag-types [data-deck="bags"] .bag-card:focus-within > div,
  body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card > div,
  body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card:hover > div,
  body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card:focus-within > div {
    gap: 5px !important;
    max-width: 138px !important;
  }

  #bag-types [data-deck="bags"] .bag-card h3,
  body.home.front-page #bag-types [data-deck="bags"] .bag-card h3,
  body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card h3 {
    font-size: 1.02rem !important;
  }

  #bag-types [data-deck="bags"] .bag-card p,
  body.home.front-page #bag-types [data-deck="bags"] .bag-card p,
  body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card p {
    display: -webkit-box !important;
    overflow: hidden !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    font-size: .76rem !important;
    line-height: 1.35 !important;
  }

  #bag-types [data-deck="bags"] .bag-card span,
  #bag-types [data-deck="bags"] .bag-card a,
  body.home.front-page #bag-types [data-deck="bags"] .bag-card span,
  body.home.front-page #bag-types [data-deck="bags"] .bag-card a,
  body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card span,
  body.pdl-static-theme-preview #bag-types [data-deck="bags"] .bag-card a {
    font-size: .72rem !important;
    line-height: 1.3 !important;
  }

  #bag-types .mobile-deck-controls,
  body.home.front-page #bag-types .mobile-deck-controls,
  body.pdl-static-theme-preview #bag-types .mobile-deck-controls {
    display: none !important;
  }
}
