.purchase-order section.landing-hero {
    height: 100vh;
    display: flex;
    align-items: center;
    position: relative;
}

.wrap-hero {
    background: linear-gradient(-62.58deg, #257AB4 17.33%, #206A9C 31.64%, #0F3449 76.7%, #0B2835 91.43%) !important;
}

.landing-container {
    color: #fff;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-width: 1120px;
    padding: 12rem 1rem;
    margin: 0 auto;
}

.purchase-order section.landing-hero:after {
    content: '' !important;
    width: 50%;
    height: 700px;
    background: url(../img/po/hero-lp-po.webp) no-repeat;
    background-position: bottom right;
    position: absolute;
    bottom: 0;
    right: 0;
    background-size: 100%;
}

.purchase-order .div-herotext {
    width: 75%;
    padding-right: 0;
    text-align: left;
}

.purchase-order .landing-container::before {
    display: none;
}

.content-text {
    display: flex;
    align-items: flex-start;
    width: 100%;
}

.content-text .tab-text {
    flex-basis: 50%;
    background: #D4DADE;
    padding: 1rem 2rem;
    text-align: center;
    font-size: 20px;
    color: #fff;
    font-weight: 800;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    transition: .3s all;
}

section.po-methods-differences {
    padding: 6rem;
}

.po-methods-differences .container {
    width: 100%;
    margin: 0 auto;
}

.content-text .tab-text.active {
    background: #4195D5;
    padding: 1.5rem 2rem;
    margin-top: -1rem;
}

.content-illustration {
    border: 2px #E0E4E7 solid;
    border-top: 0;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    width: 100%;
}

.tab-img {
    height: 450px;
}

.wrap-steps-illustration ul {
    display: flex;
    align-items: flex-start;
    padding: 0;
    justify-content: center;
}

.wrap-steps-illustration ul li {
    list-style: none;
    text-align: center;
    width: 14%;
    position: relative;
    padding: 0 5px;
}

.wrap-steps-illustration ul li img {
    max-width: 100%;
    width: unset;
    padding: 0 15%;
}

.wrap-steps-illustration li h4 {
    font-weight: 400;
    margin-top: 1rem;
}

.wrap-steps-illustration {
    display: flex;
    align-items: center;
    padding: 0;
}

.wrap-steps-illustration ul li:after {
    content: '';
    width: 55px;
    height: 20px;
    background: url(../img/po/steps-arrow.webp) no-repeat;
    background-size: contain;
    background-position: center;
    position: absolute;
    top: 4rem;
    left: 81%;
}

.wrap-steps-illustration ul li:last-child:after {
    display: none;
}

.col-sm-pull-6 .kolom-konten {
    text-align: right;
}

.blue-gradient-footer {
    position: relative;
}

section.why-po-paper {
    color: #fff;
}

.why-po-paper .kolom-konten--gambar img {
    max-width: 100%;
}

.kolom-konten p {
    max-width: 80%;
}

.col-sm-pull-6 .kolom-konten p {
    margin-left: 20%;
}

.prove-it-yourself iframe {
    border: 2px solid;
    border-image-source: linear-gradient(180deg, #4195D5 0%, #93C854 100%);
    border-radius: 10px;
}

section.social-proof {
    background: #F3FAFD;
}

.social-proof .wrap-img img {
    max-width: 120%;
    position: absolute;
    top: -50%;
}

.social-proof .wrap-img {
    position: relative;
    height: 300px;
}

.social-proof .row.align-items-center {
    margin-top: 5rem;
    margin-bottom: 2rem;
}

.social-proof .wrap-content p {
    max-width: 90%;
}

.cta .blue-outline-button {
    color: #4199D5;
    border: .96px #4199D5 solid;
    background: transparent;
}

.cta .blue-outline-button:hover {
    background: #4199d5;
    color: #fff;
    border: 2px solid #4199d5;
}

.social-proof .cta a {
    margin-right: 1rem;
}

.social-proof .cta {
    margin-top: 1rem;
}

.footer-content {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    color: #fff;
    gap: 4em;
}

.footer-content h2 {
    text-align: left;
    padding-bottom: 1rem;
}

.illustration-footer img {
    width: 100%;
    max-width: 350px;
}

.purchase-order .footer-row.new-footer #homepage-footer {
    border-top: 1px solid #ffffff8f !important;
}

.landing-cta {
    display: flex;
    gap: 2em;
}

@media (max-width: 1033px) {
    .purchase-order .div-herotext {
        width: 100%;
    }
    
    .purchase-order .div-herotext h1 {
        text-align: left;
    }
}

@media (max-width: 768px) {
    .why-po-paper .kolom-konten--gambar img {
        max-width: 80%;
    }

    .why-po-paper .row:nth-child(4) .kolom-konten--gambar img {
        max-width: 60%;
    }
    
    .kolom-konten, .col-sm-pull-6 .kolom-konten {
        text-align: center;
    }
    
    .kolom-konten p, .col-sm-pull-6 .kolom-konten p {
        margin-left: 0;
        margin-right: 0;
        max-width: 100%;
    }

    .social-proof .wrap-img img {
        position: relative;
    }
    
    .social-proof .wrap-img {
        text-align: center;
    }
    
    .wrap-content {
        text-align: center;
    }
    
    .social-proof .wrap-content p {
        max-width: 100%;
    }
    
    .footer-content {
        padding: 0 1rem;
    }
}

@media (max-width: 576px) {
    .why-po-paper .row:nth-child(4) .kolom-konten--gambar img {
        max-width: 60%;
    }
    
    .z-depan.con-why-po-paper, .social-proof .z-depan {
        padding: 5em 15px;
    }
}

@media (max-width: 480px) {
    .social-proof .wrap-img img {
        max-width: 100%;
    }

    .social-proof .wrap-img {
        height: 250px;
    }
}