.card-liteword-long {
  .poster img {
    object-position: top center;
  }

  .shade {
    background: linear-gradient(90deg, #092821e8 0 34%, #0928211f 78%);
  }
}

.poster-vertical {
  background:
    radial-gradient(circle at 80% 18%, #ef675d55 0 7%, transparent 28%),
    #14262d !important;

  .mesh {
    position: absolute;
    inset: 0;
    background: repeating-linear-gradient(135deg, transparent 0 40px, #ffffff09 41px 42px);
  }

  .vertical-copy {
    position: absolute;
    top: 39px;
    left: 31px;
    z-index: 4;

    small,
    b,
    i {
      display: block;
    }

    small {
      margin: 0 0 12px;
      color: var(--coral);
      font-size: 10px;
      font-weight: 900;
      letter-spacing: .16em;
    }

    b {
      font-size: 36px;
      font-weight: 950;
      line-height: 1.16;
      letter-spacing: -.06em;
    }

    i {
      margin: 15px 0 0;
      color: #bed0d8;
      font-size: 12px;
      font-style: normal;
      font-weight: 750;
      line-height: 1.7;
    }
  }

  .alert {
    position: absolute;
    right: 33px;
    z-index: 5;
    width: 215px;
    padding: 13px 15px;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 14px 25px #00000028;
    color: var(--ink);

    b,
    small {
      display: block;
    }

    b {
      font-size: 13px;
      font-weight: 900;
    }

    small {
      margin: 4px 0 0;
      color: #6d7b80;
      font-size: 9px;
      font-weight: 700;
    }

    &.one {
      top: 110px;
    }

    &.two {
      top: 181px;
      right: 54px;
      background: var(--coral);
      color: #fff;

      small {
        color: #fff;
      }
    }
  }
}

.poster-phone {
  background:
    radial-gradient(circle at 22% 50%, #00efff24 0 8%, transparent 30%),
    linear-gradient(115deg, #070d1b 0 54%, #293ed8 55% 73%, #8549d9 100%) !important;

  .speed-lines {
    position: absolute;
    inset: 0;
    opacity: .38;
    background: repeating-linear-gradient(0deg, transparent 0 43px, #27f0ff 44px 46px, transparent 47px 80px);
    transform: skewX(-18deg) translateX(-35%);
  }

  > img {
    position: absolute;
    top: -90px;
    left: -5px;
    width: 68%;
    height: 520px;
    object-fit: contain;
    transform: rotate(-8deg);
    filter: drop-shadow(0 30px 35px #0009);
  }

  &:hover > img,
  &:focus > img {
    transform: rotate(-4deg) scale(1.035);
  }

  .phone-copy {
    position: absolute;
    top: 60px;
    right: 32px;
    z-index: 4;
    text-align: right;

    small,
    b,
    i {
      display: block;
    }

    small {
      color: #53f4ff;
      font-size: 9px;
      font-weight: 900;
      letter-spacing: .16em;
    }

    b {
      margin: 8px 0 0;
      font-size: 49px;
      font-weight: 950;
      line-height: .82;
      letter-spacing: -.08em;
    }

    i {
      margin: 16px 0 0;
      color: #b7f13e;
      font-size: 14px;
      font-style: normal;
      font-weight: 900;
    }
  }
}
