﻿@media only screen and (min-width: 1084px) {
    .firstsection-container{
        position:relative;
    }
    .custom-foreground {
        position: absolute;
        top: 50%;
        transform: translate(0, -50%);
        width: 100%;
    }
}

@media only screen and (max-width: 769px) {
    .p1cardbody{
        height:450px;
    }
}
@media only screen and (max-width: 454px) {
    .p1cardbody {
        height: 550px;
        padding: 34px;
    }
}

.custom-foreground {
    padding:24px;
}

#section2 {
    background: url(' ../images/bg1.jpg');
    background-repeat: no-repeat;
    background-size: cover;
}

/*    #section2 picture img {
        background: #fff;
        padding: 8px;
        border-radius: 8px;
    }*/

#section3 {
    background: url(' ../images/bg2.jpg');
    background-repeat: no-repeat;
    background-size: cover;
}

    #section3 picture img {
        width: 95%;
        margin: auto;
        display: block;
        margin-top: 12px;
    }

#section4 {
    background: url(' ../images/bg3.jpg');
    background-repeat: no-repeat;
    background-size: cover;
}

#section5, #sectionp24, #sectionp32 {
    background: url('../images/bg42.png');
    background-repeat: no-repeat;
    background-size: cover;
}

    #section5 .card-body,
    #sectionp24 .card-body,
    #sectionp32 .card-body {
        padding: 70px
    }

@media screen and (max-width: 768px) {
    #section5 .card-body,
    #sectionp24 .card-body,
    #sectionp32 .card-body {
        padding: 32px;
    }
}

.custom-btn {
    background: #5935bd;
}

.custom-btn2 {
    background: #fff;
    color: #380c68;
}
/** OUR APPROACH PAGE CSS */
#sectionp22 {
    background: url(' ../images/bgp21.jpg');
    background-repeat: no-repeat;
    background-size: cover;
}

#sectionp23 {
    background: url(' ../images/bgp22.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    padding: 48px;
}

    #sectionp23 .card {
        border-radius: 16px
    }
.portrait-flex{
    gap:8px;
}
.portrait-image {
    border-radius: 50%;
    width: 96px;
    height: 96px;
}

#sectionnew {
    background: url(' ../images/bannernew.jpg');
    background-repeat: no-repeat;
    background-size: cover;
}
/** AI IN FINANCE CSS */
#sectionp34 {
    background: url(' ../images/newfour.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    padding: 48px;
}
#sectionp344 {
    background: url(' ../images/bgp31.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    padding: 48px;
}

    #sectionp34 .card {
        border-radius: 24px;
    }

.special-glyph-btn::before {
    left: -0.625em;
    right: inherit !important;
    background: #5935bd;
    color: white;
    padding: 4px;
    border-radius: 4px;
    margin-top: -10px !important;
    margin-left: -10px;
    transform: translate(-.25em, 0);
}

/** resources css */

#sectionres1 {
    background: url(' ../images/resbg1.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    padding: 2px;
}
#mainsection {
    background: url(' ../images/mainbg.jpg');
/*    background-repeat: no-repeat;*/
    background-size: cover;
}
.special-button {
    background: #5935bd;
    color: white !important;
    padding: 8px;
    border-radius: 2px;
}
.header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}
.feature-img {
    padding: 0.5rem !important;
    /* border: 1px solid red; */
    border-radius: 24px;
}
.custom-card {
    background-color: white !important;
    border-radius: 2rem !important;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.15), 0 6px 20px 0 rgba(0, 0, 0, 0.15);
}

#sectionres5 {
    background: url(' ../images/learnbg.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    padding: 2px;
}

@media only screen and (min-width: 1730px) {
    .card-body-hero {
        padding:1.5rem !important;
    }
}

@media only screen and (max-width: 800px) {
    .fix-mobile {
        flex: 0 0 100%;
        max-width: 100%;
    }
    .header {
        padding-right: 1.5rem !important;
        padding-left: 1.5rem !important;
    }
}

body {
    background: url(' ../images/resbg1.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    padding: 2px;
}

@media only screen and (min-width: 1550px) {
    #sectionres1 {
        max-width: 1600px !important;
        display: block;
        margin: auto;
    }
}
@media only screen and (max-width: 910px) {
    .nav-in-page-bar.nav-in-page-horizontal .nav-in-page-item {
        padding: 0rem;
        margin-left: 0px;
    }

    .nav-in-page-bar.nav-in-page-horizontal .nav-in-page {
        display: block;
        margin-bottom: .5rem;
    }

        .nav-in-page-bar.nav-in-page-horizontal .nav-in-page::before {
            height: 0rem;
        }
}

@media screen and (min-width: 1084px) and (max-width: 1300px) {
    .special-image {
        position: relative !important;
    }

        .special-image:before {
            content: "";
            width: 100%;
            height: 100%;
            position: absolute !important;
            background-color: #000 !important;
            opacity: .4;
        }
    .hero-home {
        color: #fff;
    }
    .container10{
        width:100% !important;
    }
    .nojustifycontent{
        justify-content:start !important;
    }
}

@media screen and (max-width: 1084px) {
    .nojustifycontent {
        justify-content: start !important;
    }
}

.p1cardbody {
    max-width: 1000px; /* adjust as you like (600–900px works well) */
    margin: 0 auto; /* centers it inside the container */
   

    border-radius: 12px; /* soft rounded edges */
}

@media (max-width: 1180px) {
    h1 br {
        display: none;
    }
}

@media (max-width: 752px) {
    #sectionp32 p {
        font-size: 12px;
    }
}