/**
 * MCS — Related pages: section decoration + MCS palette (legacy).
 * Hover: #001f89; title/link/h6 and icon #5d91e5; teaser white. Active: #00156e.
 */

.card-related-page-container::after {
  content: "";
  position: absolute;
  width: 100vw;
  left: 50%;
  transform: translateX(-50%);
  height: 100%;
  top: 0;
  background-image: url("../../images/decoration/bg-light-blue.png");
  background-size: 200px;
  background-repeat: repeat;
  background-position: top right;
  z-index: -1;
}

/* --- hover / focus / active (MCS only) --- */

.card-related-page-container .card-wrapper .card:hover {
  background-color: #001f89;
  border-color: #001f89;
}

.card-related-page-container .card-wrapper .card:hover .text,
.card-related-page-container .card-wrapper .card:hover .text * {
  color: #ffffff !important;
}

.card-related-page-container .card-wrapper .card:hover a {
  color: #5d91e5 !important;
}

.card-related-page-container .card-wrapper .card:hover h6,
.card-related-page-container .card-wrapper .card:hover h6 span {
  color: #5d91e5 !important;
}

.card-related-page-container .card-wrapper .card:hover .icon.icon-primary,
.card-related-page-container .card-wrapper .card:hover svg.icon {
  fill: #5d91e5 !important;
}

.card-related-page-container .card-wrapper .card:active {
  background-color: #00156e;
  border-color: #00156e;
}

.card-related-page-container .card-wrapper .card:focus-within {
  background-color: #001f89;
  border-color: #001f89;
}

.card-related-page-container .card-wrapper .card:focus-within .text,
.card-related-page-container .card-wrapper .card:focus-within .text * {
  color: #ffffff !important;
}

.card-related-page-container .card-wrapper .card:focus-within a {
  color: #5d91e5 !important;
}

.card-related-page-container .card-wrapper .card:focus-within h6,
.card-related-page-container .card-wrapper .card:focus-within h6 span {
  color: #5d91e5 !important;
}

.card-related-page-container .card-wrapper .card:focus-within .icon.icon-primary,
.card-related-page-container .card-wrapper .card:focus-within svg.icon {
  fill: #5d91e5 !important;
}

body .card-wrapper .card:hover {
  background-color: #001f89;
  border-color: #001f89;
}

body .card-wrapper .card:hover .text,
body .card-wrapper .card:hover .text * {
  color: #ffffff !important;
}

body .card-wrapper .card:hover a {
  color: #5d91e5 !important;
}

body .card-wrapper .card:hover h6,
body .card-wrapper .card:hover h6 span {
  color: #5d91e5 !important;
}

body .card-wrapper .card:hover .icon.icon-primary,
body .card-wrapper .card:hover svg.icon {
  fill: #5d91e5 !important;
}

body .card-wrapper .card:focus-within {
  background-color: #001f89;
  border-color: #001f89;
}

body .card-wrapper .card:focus-within .text,
body .card-wrapper .card:focus-within .text * {
  color: #ffffff !important;
}

body .card-wrapper .card:focus-within a {
  color: #5d91e5 !important;
}

body .card-wrapper .card:focus-within h6,
body .card-wrapper .card:focus-within h6 span {
  color: #5d91e5 !important;
}

body .card-wrapper .card:focus-within .icon.icon-primary,
body .card-wrapper .card:focus-within svg.icon {
  fill: #5d91e5 !important;
}

body .card-wrapper .card:active {
  background-color: #00156e;
  border-color: #00156e;
}

.card-related-page-container .card-wrapper article.card a,
body .card-wrapper article.card a {
  color: #262626 !important;
}

.card-related-page-container .card-wrapper article.card:hover a,
.card-related-page-container .card-wrapper article.card a:hover,
body .card-wrapper article.card:hover a,
body .card-wrapper article.card a:hover {
  color: #5d91e5 !important;
}

.card-related-page-container .card-wrapper article.card:focus-within a,
body .card-wrapper article.card:focus-within a {
  color: #5d91e5 !important;
}

.card-related-page-container .card-wrapper article.card .text a,
body .card-wrapper article.card .text a {
  color: #262626 !important;
}

.card-related-page-container .card-wrapper article.card:hover .text a,
.card-related-page-container .card-wrapper article.card:focus-within .text a,
body .card-wrapper article.card:hover .text a,
body .card-wrapper article.card:focus-within .text a {
  color: #ffffff !important;
}
