.c-wallpay {
  background-color: var(--background-section);
  font-family: var(--font-sans-grotesk);
  transition: all 0.3ms ease-in-out;
}
.c-wallpay::before {
  position: absolute;
  bottom: 100%;
  left: 0;
  content: "";
  width: 100%;
  height: 200px;
  background-image: linear-gradient(0deg, var(--background-section) 20%, transparent 80%);
  pointer-events: none;
}
.c-wallpay [data-openwall]:checked ~ .c-wallpay--wall {
  visibility: visible;
}
.c-wallpay--img {
  width: 60%;
  max-width: 260px;
}
.c-wallpay--img-subscription {
  min-width: 300px;
}
.c-wallpay--intro, .c-wallpay--title {
  font-size: clamp(20px, 8vw, 30px);
  font-style: normal;
  font-weight: 700;
  line-height: 1.2;
}
.c-wallpay--wall {
  visibility: hidden;
  background: rgba(13, 13, 13, 0.8);
}
.c-wallpay--body {
  width: 100%;
  height: 100vh;
}
@media screen and (min-width: 740px) {
  .c-wallpay--body {
    width: 40%;
    height: auto;
    border: 1px solid var(--divider-color);
    border-radius: 4px;
  }
}
.c-wallpay input {
  accent-color: #148be6;
}
.c-wallpay input:focus {
  -webkit-box-shadow: none;
  box-shadow: none;
}
.c-wallpay--form {
  max-width: 400px;
}
.c-wallpay del {
  color: #808080;
}
.c-wallpay--small {
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 23px;
}
.c-wallpay--advantages {
  width: auto;
  list-style-type: none;
}
.c-wallpay--advantage {
  position: relative;
  font-size: clamp(18px, 5vw, 20px);
  font-style: normal;
  font-weight: 400;
  line-height: 1.3;
}
.c-wallpay--advantage::before {
  position: absolute;
  top: 4px;
  left: -1.5rem;
  content: " ";
  width: 1rem;
  height: 1rem;
  border: 2px solid var(--body-color);
  border-radius: 50%;
}
.c-wallpay--advantage::after {
  position: absolute;
  top: 2px;
  left: -1rem;
  content: " ";
  width: 5px;
  height: 12px;
  border: solid var(--body-color);
  border-width: 0 2px 2px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
.c-wallpay--discount {
  top: -12px;
  right: 1rem;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 700;
  line-height: 15px;
}
.c-wallpay--btn {
  --btn-bg: var(--background-color);
  border-radius: 6px;
  background-color: var(--btn-bg);
  box-shadow: none;
  color: var(--body-color);
  font-family: var(--font-sans-grotesk);
  font-size: clamp(20px, 7vw, 24px);
  font-style: normal;
  font-weight: 700;
  line-height: 1.3;
}
.c-wallpay--btn__primary {
  border: none;
  background-color: #148be6;
  color: #fff;
}
.c-wallpay--btn__secondary {
  border: 1px solid var(--background-color-reverse);
}
.c-wallpay--btn p {
  margin: 0;
}
.c-wallpay--btn label {
  border-radius: 6px;
  font-size: clamp(20px, 7vw, 30px);
  font-style: normal;
  font-weight: bold;
  line-height: 1.3;
}
[data-premium--paywall=showcase] .c-wallpay--btn label {
  background-color: var(--background-section);
}
.c-wallpay--btn span {
  font-size: 18px;
  font-weight: 400;
  line-height: 24px;
}
.c-wallpay--btn input[type=radio]:checked ~ label {
  background-color: var(--background-color-gray);
}
[data-premium--paywall=showcase] .c-wallpay--btn input[type=radio]:checked ~ label {
  background-color: var(--background-color);
}

[data-opt=b] #optyear ~ button {
  display: none;
}
[data-opt=b] #optyear:checked ~ button {
  display: block;
}
[data-opt=b] #optyear:checked ~ label {
  display: none;
}

[data-experiment=a] [data-opt=b] {
  display: none;
}

[data-experiment=b] [data-opt=a] {
  display: none;
}

.c-entry img.c-wallpay--img {
  margin: 0;
}