:root{
    --theme-blue: #3F56F0;
    --theme-font: 'Inter', sans-serif;
}

body{
    margin:0;
    padding:0;
    font-family: var(--theme-font);
    height: 100%;
    overflow-x: hidden;
}

p{
    color: gray;
}

a{
    text-decoration: none;
}

/* Navbar */

.navbar{
    background-color: var(--theme-blue);
    border-bottom: 1px solid rgba(255,255,255,0.5);
    padding: 1rem 0;
}

.nav-link{
    color: white !important;
    margin: 0 1rem;
    font-weight: 500;
}

.dropdown-menu{
    border:0;
    font-size: 0.9rem;
}

.dropdown-item:hover{
    background: var(--theme-blue);
    color: white;
}


.steer-white-btn{
    width: 12rem;
    background-color: white;
    padding: 0.8rem;
    border-radius: 40px;
    font-weight: 500;
    color: var(--theme-blue);
    border: 2px solid white;
}

.steer-white-btn:hover,
.steer-white-btn:active{
    background-color: transparent;
    color: white !important;
    border: 2px solid white !important;
}

/* Footer */
.steer-cta{
    background-color: var(--theme-blue);
    height: 160px;
    position: relative;
    z-index: 1;
    bottom: -80px;
    border-radius:80px;
    padding-left: 80px;
    padding-right: 80px;
}

.steer-cta .row{
    height: 160px;
    align-items:center;
}

.steer-icon-circle{
    width: 60px;
    height: 60px;
    background-color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 1.5rem;
    color: var(--theme-blue);
}

.steer-contact-details h3{
    font-size: 1.3rem;
    color: white;
    font-weight: 600;
    margin-bottom: 0;
}

.steer-contact{
    height: 100px;
}

.steer-contact-details a{
    font-size: 1rem;
    font-weight: 400;
    color:white;
    margin-top: 0.5rem;
    margin-bottom: 0;
}



footer{
    background-color: rgba(63,86,240,0.1);
    padding: 3rem 0 1rem 0;
    padding-top: 120px;
    border-top-left-radius: 5rem;
    border-top-right-radius: 5rem;
}

footer h4{
    font-size: 1.2rem;
    font-weight: 500;
    color: var(--theme-blue);
}

footer ul{
    list-style: none;
    padding-left: 0;
    margin-top: 1.5rem;
}

footer li{
    margin: 0.5rem 0;
}

footer li a{
    font-size: 0.9rem;
}

footer li a:hover{
    color: var(--theme-blue) !important;
}

footer p{
    font-size: 0.9rem;
    margin-top: 1.5rem;
}

footer input{
    border-top-left-radius:30px !important;
    border-bottom-left-radius: 30px !important;
    padding: 0.75rem 1rem !important;
    font-size: 0.9rem !important;
}

.form-control:focus{
    box-shadow: none;
}

footer button{
    border-top-right-radius: 30px !important;
    border-bottom-right-radius: 30px !important;
    padding: 0.75rem 1rem !important;
    font-size: 0.9rem !important;
}

footer p{
    color: rgb( 108,117,125);
}

.steer-social-media-icons{
    height: 40px;
    width: 40px;
    background-color: var(--theme-blue);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 0.9rem;
    margin-right: 1rem;
}

.steer-theme-btn{
    background-color: var(--theme-blue);
    color: white;
    border:1px solid var(--theme-blue);
}
.steer-theme-btn:hover,
.steer-theme-btn:active{
    background-color: var(--theme-blue) !important;
    color: white !important;
    border:1px solid var(--theme-blue) !important;
}


/* Page Heading */

.steer-page-heading{
    display: flex;
    height: 40vh;
    background-color: var(--theme-blue);
    border-bottom-right-radius: 15rem;
    align-items: center;
    justify-content: center;
    color: white;
}

.steer-page-heading .navigation{
    color: rgba(255,255,255,0.8);
}

.steer-page-heading .navigation a,.steer-page-heading .navigation i{
    color: white;
}
/* Hero Image */
#steer-hero-image{
    background-color: var(--theme-blue);
    min-height: 110vh;
    border-bottom-right-radius: 20rem;
}

#steer-hero-image .container .row{
    height: 100vh;
}

#steer-hero-image img{
    width: 100%;
}

#steer-hero-image h1{
    font-size: 3rem;
    font-weight: 400;
    color: white;
    margin-bottom: 1.5rem;
}

#steer-hero-image h1 span{
    font-weight: 700;
}

.steer-light-text{
    color: rgba(255,255,255,0.9);
}

/* Testimonial */

#steer-feedback-left{
    background-color: var(--theme-blue);
}

.steer-segment{
    font-size: 1.1rem;
    font-weight: 600;
    color: white;
}

#steer-feedback-left h2{
    font-size: 3rem;
    color:white;
    font-weight:400;
    margin:1rem 0;
}

#steer-feedback-left p{
    color: rgba(255,255,255,0.8);
    font-weight: 300;
    font-size: 0.95rem;
}

.feedback-card img{
    width: 80px;
    height: 80px;
    border-radius: 50%;
    border: 2px solid var(--theme-blue);
}

.feedback-card{
    min-height: 665px;
}


.steer-text{
    color: #444444 !important;
}

#steer-feedback-right img{
    width: 100%;
    min-height: 1000px;
    border-bottom-right-radius: 15rem;
    object-fit: cover;
}

.carousel-indicators{
    position: absolute;
    bottom: -4rem;
}

.carousel-indicators button{
    width: 10px !important;
    height: 10px !important;
    border-radius:50%;
    margin:0 0.5rem !important;
}

/* What we offer */
.steer-section .steer-segment-title{
    font-size: 2rem;
    font-weight: 600;
    color: var(--theme-blue);
}

.steer-section .steer-segment-heading{
    font-size: 2.5rem !important;
    font-weight: 400 !important;
    margin-bottom: 1rem;
}

.steer-section .steer-segment-info{
    width: 60%;
    font-size: 01rem;
    color: gray;
    margin-top: 2rem;
    margin: auto;
}

.steer-light-card p,
.steer-dark-card p{
    font-size: 0.9rem;
}

.steer-light-card{
    background-color: rgba(63,86,240,0.1);
    margin-bottom: 1rem;
}

.steer-dark-card{
    background-color: var(--theme-blue);
    margin-bottom: 1rem;
    color: white !important;
}

.steer-dark-card p{
    color: white;
}

.steer-light-card .steer-icon-wrapper{
    background-color: var(--theme-blue);
    color: white;
    height: 80px !important;
    width: 80px !important;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    font-size: 2rem;
}

.steer-light-card h5,
.steer-dark-card h5{
    font-size: 1.2rem;
}

.steer-dark-card .steer-icon-wrapper{
    background-color: white;
    color: var(--theme-blue);
    height: 80px !important;
    width: 80px !important;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    font-size: 2rem;
}

/* Logos */
.steer-logo-card{
    display: flex;
    height: 100px;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    margin-bottom: 1rem;
}

.steer-logo-card img{
    height: 40px;
    width: 100%;
    object-fit: contain;
    display: block;
    margin: auto;
}

.steer-logo-card:hover{
    box-shadow: 5px 5px 10px var(--theme-blue);
    cursor: pointer;
}

/* Faqs */

section#steer-faqs{
    background-color: #f3f5f6;
}

#steer-faqs .accordion-item{
    margin: 1rem 0;
    border: none;
    border-radius: 0 !important;
    font-size: 0.9rem;
}

#steer-faqs .accordion-button{
    background: var(--theme-blue);
    color: white;
    padding: 1rem 1.5rem;
    font-size: 0.9rem;
}

#steer-faqs .accordion-button:not(.collapsed) {
    background-color: var(--theme-blue);
    box-shadow: none;
    border: none;
    outline: none;
    color: white !important;
}

#steer-faqs .accordion-button:focus {
    border-color: none;
    outline: 0;
    box-shadow: none;
    color: white !important;
}

#steer-faqs .accordion-body{
    color:rgb( 108,117,125);
}



#steer-faqs .accordion {
    --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='white'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='white'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

/* Contact Us */

.map-container iframe{
    border-radius: 10px;
}

#steer-contact-page .card{
    border-radius: 10px;
}

#steer-contact-page .steer-theme-btn{
width: 12rem;
padding:1rem;
color: white;
background-color: var(--theme-blue);
border-radius: 50px;
}

.contact-pills .icon-wrapper{
    height: 60px;
    width: 60px;
    border-radius: 50%;
    color:white;
    background-color: var(--theme-blue);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
}


#steer-about-image{
    position: absolute;
    top: 0; 
    left: -45px; 
    width: 646px; 
    background-image: url('../images/pages/about/bg-shape.svg');
    background-repeat: no-repeat;
    height: 50vh;
}

.steps-circle{
    background: var(--theme-blue);
    height:140px;
    width:140px;
    border-radius:50%;
    font-size: 4rem;
    color: white;
}

#steer-how-we-do .steer-text-sm{
    font-size: 1rem;
} 

#steer-how-we-do h6{
    font-size: 1.3rem;
}

.steer-modal-header{
    background: var(--theme-blue);
    color: white;
}

.btn-close:active{
    outline: none;
    box-shadow: none;
}

.btn-close:focus{
    outline: none;
    box-shadow: none;
}

.bi-shield-fill-check {
    color: #06f506;
    font-size: 1rem;
}

.text-sm{
    font-size: 0.9rem;
    font-weight: 300;
}

.modal-footer{
border-bottom: 10px solid var(--theme-blue);
}


.steer-success{
    font-size: 0.85rem;
    font-weight: 300;
    text-align: center;
    margin: 1rem auto;
    width: 100%;
    background:rgba(255,255,255,0.2);
    padding: 0.5rem 1rem;
    border-radius:0.5rem;
}


.checkmark__circle {
    stroke-dasharray: 166;
    stroke-dashoffset: 166;
    stroke-width: 2;
    stroke-miterlimit: 10;
    stroke: #7ac142;
    fill: none;
    animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards
}

.checkmark {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    display: block;
    stroke-width: 2;
    stroke: #fff;
    stroke-miterlimit: 10;
    margin: 1rem auto;
    box-shadow: inset 0px 0px 0px #7ac142;
    animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both
}

.checkmark__check {
    transform-origin: 50% 50%;
    stroke-dasharray: 48;
    stroke-dashoffset: 48;
    animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards
}

@keyframes stroke {
    100% {
        stroke-dashoffset: 0
    }
}

@keyframes scale {

    0%,
    100% {
        transform: none
    }

    50% {
        transform: scale3d(1.1, 1.1, 1)
    }
}

@keyframes fill {
    100% {
        box-shadow: inset 0px 0px 0px 30px #7ac142
    }
}

.steer-p-logo{
    display: flex;
    background:white;
    height: 20px;
    width: 60px;
    align-items:center;
    justify-content: center;
    margin: 0 0.2rem;
}

.steer-p-logo img{
    height: 10px;
}


.steer-disclaimer{
    font-size: 0.8rem;
    color: gray;
}

@media (max-width:991px){
    .steer-disclaimer{
        font-size: 0.8rem;
        position: relative;
        top: 0px;
        color: gray;
        margin: 2rem 0;
    }
}

.steer-company{

    min-height: 80px;
    display: flex;
    align-items:center;
    justify-content: center;
    margin-top: 4rem !important;
}

.steer-company img{
    padding: 1rem;
    width: 150px;
    height: auto;
}

@media only screen and (max-width: 769px) and (min-width: 1024px){
    .steer-company img{
    padding: 1rem;
    width: 100px;
    height: auto;
}
}

.steer-certificates{
    background: #dddcdc;
}

.navbar .steer-white-btn{
    width: 10rem;
    padding: 0.5rem;
}


@media (max-width: 991px){

    footer{
        padding-top:3rem;
    }

    #steer-feedback-right img{
        width: 100% !important;
        min-height: 10vh !important;
        height: auto !important;
        border-bottom-right-radius: 15rem;
    }

    .steer-section .steer-segment-info {
        width: 90%;
    }
    
    .steer-section .steer-segment-heading{
        font-size: 2rem !important;
    }

    #steer-hero-image{
        min-height: 145vh;
        border-bottom-right-radius: 5rem;
    }

    #steer-hero-image h1{
        margin-top: 3rem;
        font-size: 2rem;
    }

    .steer-certificates img{
        margin: 01rem;
        display: inline-block;
    }

    .steer-page-heading{
        height:25vh;
        border-bottom-right-radius:5rem;
    }

    .steer-section .steer-segment-title {
        font-size: 1.2rem;
        font-weight: 600;
        color: var(--theme-blue);
    }

    .steer-p-logo{
        display: flex;
        background:white;
        height: 16px;
        width: 40px;
        align-items:center;
        justify-content: center;
        margin: 0 0.2rem;
    }
    
    .steer-p-logo img{
        height: 7px;
    }
    
    
}

.steer-company-modal img{
    padding: 0.5rem;
    width: 80px;
    height: auto;
}

@media (max-width:540px){
    .steer-company-modal img{
        padding: 0.5rem;
        width: 80px;
        height: auto;
    }
}


/* Social Appreciation */
.steer-fun-fact-wrapper {
    padding-bottom: 30px;
    padding-top: 60px;
    background-color: var(--theme-blue);
}

.steer-fun-fact-item {
    transform: translateY(0px);
}

.steer-fun-fact {
    margin-bottom: 30px;
}

.steer-fun-fact .fun-fact__count {
    font-size: 56px;
    color: #ffffff;
    margin-bottom: 20px;
    line-height: 1;
    font-weight: 700;
}

.steer-fun-fact .fun-fact__text {
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.7);
    font-size: 16px;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 2px;
}

#steer-how-we-do  .card{
    min-height: 430px;
}

@media (max-width: 540px) {
    #steer-how-we-do .card img{
        transform: rotate(90deg);
    }
}