.call-to-action {
    @apply w-1/2 relative lg:w-60 lg:h-60 lg:border-r-0;

    @screen lg {
        border: 8px solid white;
        border-right: 0;

        &:before {
            content: '';
            @apply absolute right-0 -top-1 h-16 block bg-white;
            width: 8px;
        }

        &:after {
            content: '';
            @apply absolute right-0 -bottom-1 h-16 block bg-white;
            width: 8px;
        }
    }

    @screen xl {
        border: 10px solid white;

        &:before {
            width: 10px;
        }

        &:after {
            width: 10px;
        }
    }

    @apply xl:w-80 xl:h-80 xl:border-r-0;

    .wrap-info {
        @apply lg:w-44 lg:h-auto lg:absolute lg:top-10 lg:left-6 xl:w-80 xl:top-20 xl:left-6;

        .title {
            @apply mb-6 font-bold text-white text-lg;

            @screen lg {
                font-size: 1.3rem;
                line-height: 1.8rem;
            }

            @screen xl {
                font-size: 2rem;
                line-height: 2.5rem;
            }
        }

        .title:first-letter {
            text-transform: capitalize;
        }
    }
}