:root {
  --sidebar-width: 22rem;
  --layout-gap: 6rem;
}

@media (min-width: 1300px) {
  :root {
    --sidebar-width: 27rem;
    --layout-gap: 8rem;
  }
}
.related-pages {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.related-pages li {
  flex: 1 1 100%;
  margin: 0;
}
.related-pages li > * {
  display: flex;
  flex-wrap: wrap;
  align-content: center;
  justify-content: center;
  text-align: center;
  padding: 3rem 1rem;
  border-radius: 10px;
}
.related-pages li.title {
  background: rgba(0, 57, 99, 0.05);
  border-radius: 10px;
}
.related-pages li a {
  flex-direction: column;
  gap: 25px;
  background: #287B90;
  position: relative;
  transition: background-color 0.25s ease-in-out, box-shadow 0.25s ease-in-out, transform 0.25s ease-in-out;
}
.related-pages li a:before {
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg width='272' height='305' viewBox='0 0 272 305' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M299.175 219.176C299.175 218.045 299.175 216.925 299.094 215.794C297.841 189.455 290.084 163.836 276.516 141.226C261.57 118.39 244.07 97.3331 224.353 78.4631C215.339 69.2651 205.783 59.4937 196.926 49.7005C190.679 42.8134 184.821 35.5827 179.38 28.042C171.491 17.1506 164.674 5.52139 159.025 -6.68296C153.194 -19.3537 148.676 -32.5885 145.542 -46.1801C145.542 -46.2613 145.38 -46.2775 145.32 -46.1801C141.955 -41.9436 138.162 -37.4366 134.986 -33.6871C132.784 -31.063 131.026 -29.0016 130.274 -27.9898C124.322 -20.1932 118.132 -12.0124 112.294 -3.3717C103.863 8.65399 97.025 21.721 91.9505 35.5032C90.982 38.3059 90.046 41.1031 89.2939 43.9816C83.174 67.6923 85.7658 92.8118 96.5982 114.773C109.226 139.408 131.166 156.727 152.387 173.462C163.805 182.137 174.726 191.447 185.099 201.348C198.062 213.633 208.361 228.453 215.355 244.887L215.761 245.936C216.172 246.975 216.583 248.041 216.843 248.826L217.562 250.79C219.267 256.175 220.658 261.654 221.728 267.2C224.784 284.328 224.343 301.898 220.432 318.851C216.521 335.804 209.221 351.792 198.972 365.851L198.999 365.894C230.231 354.34 256.926 333.057 275.147 305.182C291.212 280.163 299.58 250.978 299.213 221.248L299.175 219.176Z' fill='white' fill-opacity='0.05'/%3E%3Cpath d='M130.923 196.143C97.5668 169.145 60.1311 138.856 55.3049 79.6483C55.3008 79.6262 55.2902 79.6058 55.2745 79.5897C55.2588 79.5736 55.2386 79.5625 55.2166 79.5579C55.1946 79.5532 55.1717 79.5552 55.1508 79.5636C55.1299 79.572 55.112 79.5864 55.0993 79.605L54.1308 81.0226C49.5319 87.7858 44.7868 94.7709 40.7938 101.929L37.3527 108.075C26.7889 125.985 17.5029 144.619 9.56399 163.837C4.57543 178.683 1.55227 194.119 0.571623 209.751C-1.6916 241.801 6.19073 273.751 23.1012 301.07C42.8498 332.338 72.1534 355.869 101.506 364.049C108.096 365.887 114.905 366.826 121.747 366.841C122.65 366.841 123.548 366.841 124.452 366.798C137.496 366.257 150.124 362.055 160.891 354.673C171.658 347.291 180.13 337.027 185.337 325.055C189.781 315.455 192.277 305.068 192.679 294.496C193.853 247.057 163.289 222.325 130.928 196.143' fill='white' fill-opacity='0.05'/%3E%3C/svg%3E%0A");
  background-size: cover;
  background-position: center;
  border-radius: 10px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
}
.related-pages li a:hover, .related-pages li a:active, .related-pages li a:focus {
  background-color: #F98126;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
  transform: translateY(-6px);
}
.related-pages li:nth-child(odd) a {
  background: #003963;
}
.related-pages li:nth-child(odd) a:hover, .related-pages li:nth-child(odd) a:active, .related-pages li:nth-child(odd) a:focus {
  background-color: #F98126;
}
.related-pages li h3 {
  font-size: var(--wp--preset--font-size--font-22);
  font-weight: 300;
  line-height: 1.5;
  margin: 0;
  padding-left: 10%;
  padding-right: 10%;
  color: #287B90;
}
.related-pages li h4 {
  font-size: var(--wp--preset--font-size--font-28);
  text-align: center;
  margin: 0;
  color: #fff;
}
.related-pages li svg {
  width: 40px;
  margin: 0 auto;
}
@media (min-width: 782px) {
  .related-pages li {
    flex: 1;
    min-height: unset;
    aspect-ratio: 1/1;
  }
  .related-pages li.title {
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .related-pages li a {
    min-height: unset;
    aspect-ratio: 1/1;
  }
  .related-pages li h3 {
    line-height: 1.25;
  }
  .related-pages.odd li {
    flex: auto;
    width: calc(50% - 1rem);
    aspect-ratio: 1/0.6;
  }
  .related-pages.odd li a {
    aspect-ratio: 1/0.6;
  }
}
@media (min-width: 1024px) {
  .related-pages.odd li {
    width: calc(25% - 1.5rem);
    aspect-ratio: 1/1;
  }
  .related-pages.odd li a {
    aspect-ratio: 1/1;
  }
}
@media (min-width: 1200px) {
  .related-pages li h3 {
    font-size: var(--wp--preset--font-size--font-28);
  }
  .related-pages li svg {
    width: 50px;
  }
}