@layer modules {
  .cta-strip {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 1rem 3rem;
    padding: 2rem;
    color: white;
    background: center top / cover url("/-/modules/cta-strip/bg.svg?v=h2ZMgb6xIi"),
      linear-gradient(90deg, #22BDFF, #8E59FF);
    font-size: 1.1rem;
    text-align: center;
    p { margin: 0; }
    a {
      color: inherit;
      font-weight: 600;
      text-decoration: underline transparent;
      text-decoration-thickness: 2px;
      text-underline-offset: .6rem;
      transition: text-decoration-color .2s;
      &:hover { text-decoration-color: currentcolor; }
    }
    &.bright {
      color: black;
      background: center top / cover url("/-/modules/cta-strip/bg-bright.svg?v=eKWXXK9Vpx"),
        linear-gradient(90deg, #8BFFC7, #2FE6FF);
    }
    &.bold a {
      padding: .75rem 1.25rem;
      color: #384bdf;
      background-color: white;
      font-weight: 600;
      text-decoration: none;
      border-radius: .4rem;
      transition: opacity .2s;
      &:hover { opacity: .8; }
    }
    &.bright.bold a {
      color: white;
      background-color: black;
    }
  }
}