/* moonlight-section */

.p-space p {
    margin: 10px auto 0;
}

.moonlight-section {
    background-color: #000612;
    position: relative;
    z-index: 1;
    padding: 30px 0 20px;
}

.black-gradient {
    position: relative;
    z-index: 1;
}

.black-gradient::before {
    content: "";
    position: absolute;
    z-index: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 35%;
    background-image: linear-gradient(to bottom, rgba(11, 10, 12, 0), rgba(11, 10, 12, 0) 0, #0b0a0c 100%);
}

.moonlight-section .public-title h2 {
    line-height: 1.3;
}

.moonlight-section .public-title p {
    color: #bdbdbd;
}

.moonlight-section .public-title button {
    padding-inline: 40px;
}

.moonlight-section .logo-image {
    max-width: 300px;
    margin-bottom: 25px;
}

@media (min-width: 992px) {
    .moonlight-section .col-lg-7 {
        flex: 0 0 auto;
        width: 60.333333%;
    }
    .moonlight-section .col-lg-5 {
        flex: 0 0 auto;
        width: 39.666667%;
    }
}


/* Purpose Driven section  */

.blue-purple-gradient {
    background-image: url(../img/blue-purple-gradient.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}

.purpose-driven-section p {
    color: #e6faff;
}

.tranp-card {
    background-color: rgba(255, 255, 255, 0.1);
    padding: 24px;
    border-radius: 16px;
    backdrop-filter: blur(100px);
    text-align: center;
    height: 100%;
    transition: 0.3s all ease;
}

.tranp-card:hover {
    background-color: rgba(255, 255, 255, 0.25);
}

.tranp-card .circle-img {
    width: 70px;
    aspect-ratio: 1;
    margin: 0 auto 25px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.tranp-card h4 {
    color: white;
    font-size: 20px;
    font-weight: 500;
}

.purpose-driven-section .bottom-button {
    margin-top: 40px;
}

.purpose-driven-section .public-title p {
    max-width: 880px;
}

.literature-section .book-crad img {
    max-height: unset;
}

.literature-section .book-crad p {
    color: #5E7074;
}

@media (max-width: 1199px) {
    .moonlight-section .public-title h2 {
        font-size: 32px;
    }
    .moonlight-section .public-title.title-white p {
        font-size: 14px;
    }
    .moonlight-section .logo-image {
        max-width: 230px;
        margin-bottom: 20px;
    }
    .tranp-card h4 {
        font-size: 17px;
    }
}

@media (max-width: 991px) {
    .moonlight-section {
        padding-top: 50px;
    }
}