.questions-hero {
  background: var(--wp--preset--color--dark-blue);
  color: var(--wp--preset--color--white);
  padding: 7rem 0 4rem; }
  .questions-hero h1 {
    color: var(--wp--preset--color--white);
    margin: 0 0 1.5rem; }
  .questions-hero p {
    font-weight: 500;
    font-size: 1.25rem;
    margin: 0 0 4.5rem; }
  .questions-hero .chevron {
    background-image: url("../img/chevron-down-gold.svg");
    background-repeat: no-repeat;
    width: 40px;
    height: 22px; }

.questions-body {
  background: var(--wp--preset--color--light-blue);
  border-top-right-radius: 50px;
  position: relative;
  padding: 6rem 0 8rem; }
  .questions-body:before {
    position: absolute;
    content: '';
    display: block;
    top: 0;
    left: 0;
    right: 0;
    height: 100px;
    background: var(--wp--preset--color--dark-blue);
    z-index: -1; }
  @media (min-width: 75em) {
    .questions-body {
      border-top-right-radius: 100px; } }
  .questions-body .questions-list {
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative; }
    .questions-body .questions-list:before {
      position: absolute;
      height: 1.5px;
      left: 0;
      right: 0;
      background: var(--wp--preset--color--dark-blue);
      opacity: 0.4;
      content: '';
      display: block;
      top: 0; }
    .questions-body .questions-list li a {
      display: block;
      text-decoration: none;
      position: relative;
      font-size: 1.125rem;
      padding: 1.5rem 4rem 1.5rem 0;
      color: var(--wp--preset--color--dark-blue); }
      @media (min-width: 55em) {
        .questions-body .questions-list li a {
          font-size: 1.5rem;
          padding: 3rem 4rem 3rem 0; } }
      .questions-body .questions-list li a .text {
        transform: translateX(0);
        transition: all 300ms ease;
        display: block; }
      .questions-body .questions-list li a .arrow {
        position: absolute;
        top: calc(50% - 23px);
        right: 0;
        width: 46px;
        height: 46px;
        border-radius: 50%;
        border-width: 1.25px;
        border-color: var(--wp--preset--color--dark-blue);
        border-style: solid;
        background-color: transparent;
        background-image: url("../img/arrow-right-blue.svg");
        background-repeat: no-repeat;
        background-position: center;
        transition: all 300ms ease;
        transform-origin: center;
        transform: rotate(0); }
      .questions-body .questions-list li a:hover .text {
        transform: translateX(1.5rem); }
        @media (min-width: 55em) {
          .questions-body .questions-list li a:hover .text {
            transform: translateX(2.5rem); } }
      .questions-body .questions-list li a:hover .arrow {
        transform: rotate(-45deg);
        background-color: var(--wp--preset--color--gold);
        border-color: var(--wp--preset--color--gold); }
      .questions-body .questions-list li a:after {
        position: absolute;
        height: 1.5px;
        left: 0;
        right: 0;
        background: var(--wp--preset--color--dark-blue);
        opacity: 0.4;
        content: '';
        display: block;
        bottom: 0; }
    .questions-body .questions-list li:not(:first-child) a:before {
      display: none; }

.related-questions {
  padding: 6rem 0;
  position: relative; }
  @media (min-width: 75em) {
    .related-questions {
      padding: 8rem 0; } }
  .related-questions .container {
    position: relative;
    height: 100%;
    display: flex;
    flex-direction: column; }
  .related-questions h2 {
    margin: 0 0 4rem;
    background-color: var(--wp--preset--color--off-white); }
  .related-questions .related-questions-list {
    display: grid;
    row-gap: 2.5rem;
    column-gap: 2.5rem;
    list-style: none;
    margin: 0;
    padding: 0; }
    @media (min-width: 600px) {
      .related-questions .related-questions-list {
        grid-template-columns: 1fr 1fr; } }
    @media (min-width: 55em) {
      .related-questions .related-questions-list {
        grid-template-columns: 1fr 1fr 1fr; } }
    @media (min-width: 75em) {
      .related-questions .related-questions-list {
        margin-left: 12.5rem; } }
    .related-questions .related-questions-list a {
      text-decoration: none;
      overflow: hidden;
      background-color: var(--wp--preset--color--white);
      border-radius: 4px 60px 4px 4px;
      transition: all 300ms ease;
      box-shadow: none;
      position: relative;
      color: var(--wp--preset--color--dark-blue);
      display: block;
      height: 100%; }
      .related-questions .related-questions-list a .image {
        display: block;
        aspect-ratio: 404 / 226;
        position: relative; }
        .related-questions .related-questions-list a .image:after {
          position: absolute;
          transition: opacity 300ms ease;
          background-color: rgba(0, 58, 112, 0.8);
          top: 0;
          left: 0;
          bottom: 0;
          right: 0;
          content: '';
          display: block;
          z-index: 1;
          opacity: 0; }
        .related-questions .related-questions-list a .image img {
          width: 100%;
          height: 100%;
          object-fit: cover;
          display: block; }
      .related-questions .related-questions-list a .content {
        padding: 2rem 2rem 6.75rem; }
      .related-questions .related-questions-list a .title {
        font-size: 1.25rem;
        line-height: 1.2;
        font-family: var(--wp--preset--font-family--heading);
        font-weight: 500;
        color: var(--wp--preset--color--dark-blue);
        -webkit-line-clamp: 4;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        margin: 0; }
      .related-questions .related-questions-list a .date {
        font-family: var(--wp--preset--font-family--heading);
        font-weight: 500;
        font-size: 1.25rem; }
      .related-questions .related-questions-list a .meta {
        position: absolute;
        bottom: 2rem;
        left: 2rem;
        right: 5rem;
        font-family: var(--wp--preset--font-family--heading);
        font-weight: 500;
        color: var(--wp--preset--color--blue);
        font-size: 1.125rem;
        line-height: 23px;
        height: 46px;
        display: flex;
        justify-content: center;
        flex-direction: column;
        margin: 0;
        overflow: hidden;
        text-overflow: ellipsis; }
      .related-questions .related-questions-list a .arrow {
        position: absolute;
        bottom: 2rem;
        right: 2rem;
        display: block;
        width: 46px;
        height: 46px;
        border-radius: 50%;
        border-width: 1.25px;
        border-color: var(--wp--preset--color--dark-blue);
        border-style: solid;
        background-color: transparent;
        background-image: url("../img/arrow-right-blue.svg");
        background-repeat: no-repeat;
        background-position: center;
        transition: all 300ms ease;
        transform-origin: center; }
      .related-questions .related-questions-list a:hover, .related-questions .related-questions-list a:focus {
        box-shadow: 0px 130px 52px rgba(0, 0, 0, 0.01), 0px 73px 44px rgba(0, 0, 0, 0.05), 0px 32px 32px rgba(0, 0, 0, 0.09), 0px 8px 18px rgba(0, 0, 0, 0.1); }
        .related-questions .related-questions-list a:hover .image:after, .related-questions .related-questions-list a:focus .image:after {
          opacity: 1; }
        .related-questions .related-questions-list a:hover .title, .related-questions .related-questions-list a:focus .title {
          text-decoration: underline; }
        .related-questions .related-questions-list a:hover .arrow, .related-questions .related-questions-list a:focus .arrow {
          background-color: var(--wp--preset--color--gold);
          border-color: var(--wp--preset--color--gold);
          transform: rotate(-45deg); }