/* Certification V2: large proof document carousel. */
html body #certifications.certification-band {
  position: relative !important;
  padding-block: clamp(74px, 7vw, 108px) !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 16% 18%, rgba(7, 91, 199, .11), transparent 34%),
    radial-gradient(circle at 86% 78%, rgba(13, 122, 98, .1), transparent 30%),
    linear-gradient(180deg, #f7fbff 0%, #e9f4fb 48%, #f6fbff 100%) !important;
}

html body #certifications .certification-panel {
  display: grid !important;
  grid-template-columns: minmax(300px, .36fr) minmax(0, .64fr) !important;
  gap: clamp(34px, 4.4vw, 58px) !important;
  align-items: center !important;
}

html body #certifications .certification-heading {
  max-width: 470px !important;
}

html body #certifications .certification-heading h2 {
  margin: 0 !important;
  color: #10263b !important;
  font-size: clamp(2.05rem, 3vw, 3.05rem) !important;
  font-weight: 950 !important;
  line-height: 1.12 !important;
  letter-spacing: 0 !important;
}

html body #certifications .certification-heading > p:not(.chapter-number) {
  max-width: 33em !important;
  margin: 18px 0 0 !important;
  color: rgba(16, 38, 59, .72) !important;
  font-size: clamp(.98rem, 1.06vw, 1.12rem) !important;
  line-height: 1.72 !important;
}

html body #certifications .certification-summary {
  gap: 8px !important;
  margin-top: 22px !important;
}

html body #certifications .certification-summary span {
  padding: 7px 10px !important;
  color: #075bc7 !important;
  background: rgba(255, 255, 255, .72) !important;
  box-shadow: 0 10px 22px rgba(18, 64, 104, .08) !important;
}

html body #certifications .certification-carousel {
  position: relative !important;
  isolation: isolate !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 330px) !important;
  gap: clamp(22px, 2.2vw, 32px) !important;
  align-items: center !important;
  min-height: clamp(560px, 48vw, 650px) !important;
  padding: clamp(26px, 2.6vw, 36px) !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 14px !important;
  background:
    linear-gradient(115deg, rgba(255, 255, 255, .96) 0%, rgba(242, 248, 253, .88) 52%, rgba(224, 238, 248, .86) 100%),
    radial-gradient(circle at 35% 42%, rgba(7, 91, 199, .12), transparent 36%) !important;
  box-shadow: 0 34px 86px rgba(18, 52, 82, .16) !important;
}

html body #certifications .certification-carousel::before {
  content: "" !important;
  position: absolute !important;
  inset: 24px 36% 24px 24px !important;
  z-index: -1 !important;
  border-radius: 14px !important;
  background:
    radial-gradient(ellipse at 50% 78%, rgba(6, 38, 68, .16), transparent 55%),
    linear-gradient(180deg, rgba(255, 255, 255, .62), rgba(214, 229, 240, .42)) !important;
}

html body #certifications .certification-stage {
  position: relative !important;
  min-height: clamp(500px, 42vw, 590px) !important;
  overflow: visible !important;
  perspective: 1100px !important;
}

html body #certifications .certification-slide {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  z-index: 1 !important;
  width: clamp(245px, 26vw, 392px) !important;
  aspect-ratio: 3 / 4 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: transparent !important;
  box-shadow: none !important;
  opacity: 0 !important;
  cursor: pointer !important;
  transform: translate3d(-50%, -50%, 0) scale(.58) !important;
  transition:
    opacity 320ms ease,
    transform 420ms cubic-bezier(.22, .8, .25, 1),
    filter 320ms ease !important;
}

html body #certifications .certification-slide img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  padding: 10px !important;
  object-fit: contain !important;
  border-radius: 10px !important;
  background: #fff !important;
  box-shadow: 0 28px 62px rgba(6, 31, 55, .24), 0 2px 0 rgba(255, 255, 255, .96) inset !important;
}

html body #certifications .certification-slide.is-active {
  z-index: 8 !important;
  opacity: 1 !important;
  filter: none !important;
  transform: translate3d(-50%, -50%, 0) scale(1) !important;
}

html body #certifications .certification-slide.is-prev {
  z-index: 5 !important;
  opacity: .74 !important;
  filter: saturate(.88) contrast(.96) !important;
  transform: translate3d(calc(-50% - 160px), -50%, 0) rotate(-4deg) scale(.76) !important;
}

html body #certifications .certification-slide.is-next {
  z-index: 5 !important;
  opacity: .74 !important;
  filter: saturate(.88) contrast(.96) !important;
  transform: translate3d(calc(-50% + 160px), -50%, 0) rotate(4deg) scale(.76) !important;
}

html body #certifications .certification-slide.is-prev-far {
  z-index: 2 !important;
  opacity: .34 !important;
  filter: saturate(.78) contrast(.9) blur(.1px) !important;
  transform: translate3d(calc(-50% - 275px), -50%, 0) rotate(-7deg) scale(.6) !important;
}

html body #certifications .certification-slide.is-next-far {
  z-index: 2 !important;
  opacity: .34 !important;
  filter: saturate(.78) contrast(.9) blur(.1px) !important;
  transform: translate3d(calc(-50% + 275px), -50%, 0) rotate(7deg) scale(.6) !important;
}

html body #certifications .certification-slide.is-hidden {
  opacity: 0 !important;
  pointer-events: none !important;
}

html body #certifications .certification-current {
  position: relative !important;
  z-index: 12 !important;
  align-self: center !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  min-height: 380px !important;
  height: auto !important;
  padding: clamp(24px, 2.2vw, 32px) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 12px !important;
  background:
    radial-gradient(circle at 84% 16%, rgba(62, 203, 183, .28), transparent 34%),
    linear-gradient(155deg, #08243d 0%, #0d5aae 100%) !important;
  box-shadow: 0 28px 64px rgba(2, 30, 58, .24) !important;
}

html body #certifications .certification-current > span {
  display: inline-flex !important;
  width: max-content !important;
  max-width: 100% !important;
  margin-bottom: 14px !important;
  padding: 7px 11px !important;
  color: #10263b !important;
  font-size: .72rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  border-radius: 999px !important;
  background: #50e0c3 !important;
}

html body #certifications .certification-current h3 {
  margin: 0 0 20px !important;
  color: #fff !important;
  font-size: clamp(1.28rem, 1.42vw, 1.62rem) !important;
  font-weight: 950 !important;
  line-height: 1.24 !important;
}

html body #certifications .certification-current dl {
  display: grid !important;
  gap: 14px !important;
  margin: 0 0 20px !important;
}

html body #certifications .certification-current dl div {
  display: grid !important;
  grid-template-columns: 44px minmax(0, 1fr) !important;
  gap: 12px !important;
  padding-top: 14px !important;
  border-top: 1px solid rgba(255, 255, 255, .18) !important;
}

html body #certifications .certification-current dt {
  color: rgba(255, 255, 255, .58) !important;
  font-size: .74rem !important;
  font-weight: 900 !important;
  line-height: 1.5 !important;
}

html body #certifications .certification-current dd {
  margin: 0 !important;
  color: rgba(255, 255, 255, .9) !important;
  font-size: .9rem !important;
  font-weight: 750 !important;
  line-height: 1.58 !important;
  overflow-wrap: anywhere !important;
}

html body #certifications .certification-current strong {
  display: block !important;
  margin-top: auto !important;
  color: rgba(255, 255, 255, .74) !important;
  font-size: .86rem !important;
  font-weight: 750 !important;
  line-height: 1.58 !important;
}

html body #certifications .certification-nav {
  position: absolute !important;
  bottom: clamp(28px, 3vw, 40px) !important;
  z-index: 24 !important;
  width: 44px !important;
  height: 44px !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  color: #075bc7 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, .92) !important;
  box-shadow: 0 14px 32px rgba(4, 32, 58, .18) !important;
}

html body #certifications .certification-nav svg {
  width: 18px !important;
  height: 18px !important;
}

html body #certifications .certification-nav-prev {
  left: clamp(30px, 3.2vw, 44px) !important;
  transform: rotate(180deg) !important;
}

html body #certifications .certification-nav-next {
  left: calc(clamp(30px, 3.2vw, 44px) + 58px) !important;
}

html body #certifications .certification-note {
  max-width: min(1180px, calc(100vw - 40px)) !important;
  margin-top: 22px !important;
  color: rgba(16, 38, 59, .58) !important;
  font-size: .86rem !important;
  line-height: 1.65 !important;
}

@media (hover: hover) {
  html body #certifications .certification-slide:hover img,
  html body #certifications .certification-slide:focus-visible img {
    box-shadow: 0 34px 76px rgba(6, 31, 55, .3), 0 0 0 3px rgba(7, 91, 199, .1) !important;
  }
}

@media (max-width: 1060px) {
  html body #certifications .certification-panel {
    grid-template-columns: 1fr !important;
  }

  html body #certifications .certification-heading {
    max-width: 760px !important;
  }
}

@media (max-width: 780px) {
  html body #certifications.certification-band {
    padding-block: 54px 62px !important;
  }

  html body #certifications .certification-carousel {
    grid-template-columns: 1fr !important;
    min-height: 0 !important;
    padding: 18px !important;
    border-radius: 12px !important;
  }

  html body #certifications .certification-stage {
    min-height: 330px !important;
  }

  html body #certifications .certification-slide {
    width: min(60vw, 220px) !important;
  }

  html body #certifications .certification-slide.is-prev {
    opacity: .42 !important;
    transform: translate3d(calc(-50% - 96px), -50%, 0) rotate(-4deg) scale(.68) !important;
  }

  html body #certifications .certification-slide.is-next {
    opacity: .42 !important;
    transform: translate3d(calc(-50% + 96px), -50%, 0) rotate(4deg) scale(.68) !important;
  }

  html body #certifications .certification-slide.is-prev-far,
  html body #certifications .certification-slide.is-next-far {
    opacity: 0 !important;
  }

  html body #certifications .certification-current {
    min-height: 0 !important;
    padding: 20px !important;
  }

  html body #certifications .certification-nav {
    bottom: auto !important;
    top: 282px !important;
  }

  html body #certifications .certification-nav-prev {
    left: 22px !important;
  }

  html body #certifications .certification-nav-next {
    right: 22px !important;
    left: auto !important;
  }
}

/* Certificate image framing: enlarge scanned document content without editing source files. */
html body #certifications .certification-slide {
  overflow: hidden !important;
  background: #fff !important;
  box-shadow: 0 28px 62px rgba(6, 31, 55, .22) !important;
}

html body #certifications .certification-slide img {
  padding: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transform: scale(1.2) !important;
  transform-origin: center center !important;
}

html body #certifications .certification-slide.is-active img {
  transform: scale(1.24) !important;
}

html body #certifications .certification-slide:hover,
html body #certifications .certification-slide:focus-visible {
  box-shadow: 0 34px 76px rgba(6, 31, 55, .3), 0 0 0 3px rgba(7, 91, 199, .1) !important;
}

/* Production module readability: make the text backing visibly darker in normal state. */
html body #printing .print-panel::after {
  content: "" !important;
  position: absolute !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  z-index: 5 !important;
  height: 58% !important;
  display: block !important;
  opacity: 1 !important;
  pointer-events: none !important;
  background:
    radial-gradient(620px 360px at 20% 72%, rgba(1, 10, 18, .9) 0%, rgba(1, 10, 18, .62) 46%, rgba(1, 10, 18, 0) 76%),
    linear-gradient(180deg, rgba(1, 10, 18, 0) 0%, rgba(1, 10, 18, .46) 33%, rgba(1, 10, 18, .86) 68%, rgba(1, 10, 18, .97) 100%) !important;
  transition: opacity 180ms ease !important;
}

html body #printing .print-panel-gravure::after {
  background:
    radial-gradient(620px 360px at 20% 72%, rgba(1, 10, 18, .86) 0%, rgba(1, 10, 18, .56) 46%, rgba(1, 10, 18, 0) 76%),
    linear-gradient(180deg, rgba(1, 10, 18, 0) 0%, rgba(1, 10, 18, .42) 33%, rgba(1, 10, 18, .82) 68%, rgba(1, 10, 18, .94) 100%) !important;
}

html body #printing .print-panel-header,
html body #printing .print-panel dl,
html body #printing .print-feature-tags {
  text-shadow: 0 2px 14px rgba(0, 0, 0, .5) !important;
}

html body #printing .print-panel:has(.print-media-video.is-video-playing)::after {
  opacity: 0 !important;
}

html body #printing .section-heading > p {
  max-width: 29em !important;
  font-size: clamp(.98rem, 1.08vw, 1.16rem) !important;
  line-height: 1.7 !important;
}

@media (hover: hover) {
  html body #printing .print-panel:hover .print-media img,
  html body #printing .print-panel:focus-within .print-media img {
    transform: scale(1.045) !important;
    transition: transform 760ms cubic-bezier(.22, .8, .25, 1), filter 280ms ease !important;
  }
}

@media (max-width: 980px) {
  html body #printing.printing-section {
    padding-block: 52px 58px !important;
  }

  html body #printing .section-heading {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    margin-bottom: 22px !important;
  }

  html body #printing .section-heading > p {
    max-width: none !important;
    font-size: .96rem !important;
    line-height: 1.62 !important;
  }

  html body #printing .print-switcher {
    order: 2 !important;
    display: block !important;
    margin: 0 0 16px !important;
  }

  html body #printing .print-switcher-heading {
    display: none !important;
  }

  html body #printing .print-tabs {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    padding: 5px !important;
    background: rgba(255, 255, 255, .72) !important;
    border: 1px solid rgba(162, 188, 208, .58) !important;
    border-radius: 10px !important;
  }

  html body #printing .print-tabs button {
    min-height: 58px !important;
    padding: 10px 12px !important;
    border-radius: 8px !important;
  }

  html body #printing .print-tabs button .print-tab-arrow {
    display: none !important;
  }

  html body #printing .print-compare {
    order: 3 !important;
    grid-template-columns: minmax(0, 1fr) !important;
    min-height: 560px !important;
    border-radius: 10px 10px 0 0 !important;
  }

  html body #printing .versus {
    display: none !important;
  }

  html body #printing .print-panel {
    grid-column: 1 !important;
    min-height: 560px !important;
    padding: 32px 24px 34px !important;
  }

  html body #printing .print-panel[aria-hidden="true"] {
    display: none !important;
  }

  html body #printing .print-panel + .versus + .print-panel::before {
    content: none !important;
    display: none !important;
  }

  html body #printing .print-panel-header h3 {
    font-size: clamp(2.28rem, 12vw, 3.3rem) !important;
  }

  html body #printing .print-panel dl {
    top: 30px !important;
    left: 24px !important;
  }

  html body #printing .print-panel dl > div:first-child {
    padding-left: 14px !important;
  }

  html body #printing .print-panel dl > div:first-child dd {
    font-size: clamp(2.75rem, 14vw, 4.2rem) !important;
  }

  html body #printing .print-media::after {
    right: 24px !important;
    bottom: 122px !important;
    left: 24px !important;
  }

  html body #printing .print-media figcaption {
    display: none !important;
  }

  html body #printing .print-feature-tags {
    width: 100% !important;
    grid-template-columns: 1fr !important;
    gap: 11px !important;
    margin-top: 22px !important;
    padding-top: 18px !important;
  }

  html body #printing .quantity-advisor {
    order: 4 !important;
  }

  html body #printing .recommendation {
    min-height: 0 !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    padding: 20px 18px !important;
  }

  html body #printing .recommendation-cta {
    width: 100% !important;
    min-height: 52px !important;
  }
}

body.home.front-page #printing.printing-section .print-compare .print-panel ul.print-feature-tags > li {
  min-height: auto !important;
  padding: 0 !important;
  color: rgba(255, 255, 255, .88) !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

