* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Poppins", serif;
    color: #08336A;
}

.container{
    max-width: 85%;
}


.navbar-nav .dropdown:hover .dropdown-menu {
    display: block;
    margin-top: 0;
}

.dropdown-menu {
    transition: all 0.3s ease-in-out;
}



.navbar-light .navbar-toggler-icon {
    background-image: url('img/hamburger1.png'); 
    background-size: contain;  
    background-repeat: no-repeat; 
    
}


.dropdown-item,
.dropdown-item {
    color: #081A38 !important;
    background-color: #fff !important;
    border-bottom: 1px solid #081A38 !important;
}

.nav-item .nav-link {
    color: #fff !important;
    text-transform: capitalize !important;
    margin: 0 10px;
}

.text-design h1 {
    color: #FFF;
    font-size: 48px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.button-styles {
    background-color: #F76B01;
    color: #fff;
    padding: 12px 0;
}

.button-styles:hover {
    background-color: #0C2C41;
    color: #fff;
}

.card-design {
    padding: 20px;
    border-radius: 5px;
    background: #FFF;
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card-design:hover {
    background: #F76B01;
    transform: translateY(-10px);
}

.card-design h5 {
    color: #F76B01;
    font-weight: 700;
}

.card-design p {
    font-size: 14px;
}

.card-design:hover h5,
.card-design:hover p {
    color: #FFF;
}

.get-in-card{
   padding: 0 50px; 
}


/*  */
.buttons1 {
    color: #08336A;
}

.buttons1:hover {
    color: #fff;
    background-color: #F76B01;
}

.vertical-line {
    width: 4px;
    height: 80px;
    background-color: #08336A;
    margin: 0 10px;
}

.services-card {
    margin-right: 50px;
    margin-left: 30px;
    background: #F1F1F1;
    transition: all 0.3s ease-in-out;
    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.15);
}

.services-card:hover {
    background: linear-gradient(0deg, rgba(8, 51, 106, 0.20) 0%, rgba(8, 51, 106, 0.20) 100%), #FFF;
    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.15);
}

.ser-subcard {
    border-radius: 4.778px;
    background: #5B789D;
    box-shadow: 8.094px 4.047px 4.047px 0px rgba(0, 0, 0, 0.35);
    width: 330px;
    transition: transform 0.3s ease-in-out;
}

.services-card:hover .ser-subcard {
    transform: scale(1.01);
}



.dashed-line {
    width: 3px; 
    height: 550px; 
    background: repeating-linear-gradient(
        to bottom, 
        black 0px, 
        black 20px,  /* Dash ki height */
        transparent 10px, 
        transparent 40px /* Dash ke beech ka gap */
    );
}


@keyframes slideUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes slideOut {
    from {
        opacity: 1;
        transform: translateY(0);
    }

    to {
        opacity: 0;
        transform: translateY(-20px);
    }
}

.about-card {
    opacity: 0;
    border-radius: 15px;
    transform: translateY(20px);
    animation-fill-mode: forwards;
}

.about-card.animate {
    animation: slideUp 0.5s ease-in-out forwards;
}

.about-card.remove {
    animation: slideOut 0.5s ease-in-out forwards;
}

.star-icon .fa-star {
    color: #F7A400;
}

.underline-design {
    display: inline-block;
    text-decoration: none;
}

.underline-design::after {
    content: '';
    position: absolute;
    left: 0;
    top: -20px;
    width: 100%;
    height: 4px;
    background-color: #08336A;
    transition: width 0.3s ease;
}

/*  */


.slider-container {
    position: relative;
    overflow: hidden;
}

.slide {
    display: none;
}

.slide.active {
    display: block;
}

.prev-btn,
.next-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    border: none;
    cursor: pointer;
    font-size: 40px;
    z-index: 10;
    background: transparent;
}

.prev-btn {
    left: 10px;
}

.next-btn {
    right: 10px;
}

/*  */
.btn-submit {
    padding: 10px 20px;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
    background: #FE6B02;
    transition-duration: 0.3s;
}

.btn-submit:hover {
    background: #08336A;
}

/*  */
.search-container {
    display: flex;
    align-items: center;
    gap: 10px;
}

.search-box {
    padding: 8px;
    width: 300px;
    border: 1px solid #ccc;
    border-radius: 5px;
    font-size: 16px;
}

.btn-submit1 {
    padding: 10px 20px;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
    background: #08336A;
    transition-duration: 0.3s;
}

.btn-submit1:hover {
    background: #FE6B02;
}

/*  */
.icons .fa-brands {
    color: #fff;
}

.icons1 .fa-brands:hover {
    color: #FE6B02 !important;
}

.icons .fa-brands:hover {
    color: #FE6B02 !important;
}

.quick-links h4 {
    color: #F76B01;
}

.quick-links a {
    color: #fff;
    text-decoration: none;
    display: block;
    margin: 10px 0;
}


/* about us css strat */
.about-banner h1 {
    font-size: 53px;
    font-weight: 600;
}

.asbg-design {
    display: flex;
    width: 30px;
    height: 30px;
    padding: 5px;
    justify-content: center;
    align-items: center;
    border-radius: 10000px;
    background: #F1F1F1;
}

.ab-carddesign {
    background: linear-gradient(0deg, rgba(255, 255, 255, 0.10) 0%, rgba(255, 255, 255, 0.10) 100%), #081A38;
}

.ab-carddesign h5 {
    font-weight: 600;
}

.ab-carddesign p {
    font-size: 13px;
}

.ab-vision-text p {
    font-size: 14px;
}

.ab-bg-style {
    background: #395C88;
    width: 70px;
    height: 60px;
    padding: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
}


.started-btn {
    padding: 10px 20px;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
    background: #204779;
    transition-duration: 0.3s;
}

.started-btn:hover {
    background: #FE6B02;
}

/* services details css */
.ser-details p {
    font-size: 14px;
}

.ser-det-offering {
    background: rgba(8, 51, 106, 0.65);
    transition: transform 0.3s ease-in-out;
}

.ser-det-offering:hover {
    transform: translateY(-5px);
}

.ser-det-offering p {
    font-size: 12px;
}

/* accordian css */

.accordion-design {
    position: relative;
    max-height: 375px;
    overflow-y: scroll;
}

.accordion-design::-webkit-scrollbar {
    display: none;
}


.accordion {
    display: flex;
    flex-direction: column;
    gap: 15px;
    width: 100%;
}

.accordion__item {
    border-radius: 5px;
    overflow: hidden;

}

.accordion__header {
    padding: 10px 15px;
    font-weight: 600;
    cursor: pointer;
    position: relative;
    background-color: #E5E5E5;
}


.accordion__header::after {
    content: "\f054";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    position: absolute;
    right: 20px;
    top: 10px;
    transition: .4s;
    color: #F76B01;
}



.accordion__header.active {
    background: #08336A;
    color: #fff;
}

.accordion__header.active::after {
    transform: rotate(90deg);
    color: #fff;
}


.accordion__item .accordion__content {
    padding: 5px 10px;
    max-height: 0;
    transition: max-height 0.5s ease-in-out;
    overflow: hidden;
}


/* contact form */
.cont-card{
   padding:30px 40px; 
}

.dashed-style {
    position: relative;
    background: linear-gradient(90deg, transparent 50%, #08336966 50%),
        linear-gradient(90deg, transparent 50%, #08336966 50%),
        linear-gradient(0deg, transparent 50%, #08336966 50%),
        linear-gradient(0deg, transparent 50%, #08336966 50%);
    background-size: 60px 2px, 60px 2px, 2px 60px, 2px 60px;
    background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
    background-position: top, bottom, left, right;
    padding: 30px;
    border-radius: 10px;
}

.contact-form-des p {
    font-size: 13px;
}

/* faq */
.accordion-design1 {
    position: relative;
    max-height: 100%;
    max-height: 470px;
    overflow-y: scroll;
}

.accordion-design1::-webkit-scrollbar {
    display: none;
}


/* blog inside */
.blg-inside h3,
.blg-inside h5,
.blg-inside ul li span {
    font-weight: 600;
}

.blg-inside p,
.blg-inside ul li {
    font-size: 14px;
}

.blog-inside-scroller {
    max-height: 800px;
    overflow-y: scroll;
    position: relative;
}

.blog-inside-scroller::-webkit-scrollbar {
    display: none;
}

.blog-inside-scroller {
    position: sticky;
    top: 0;
}

/* blog page */

.blg-bnr{
    display: block;
}

.blg-bnr img{
   max-width: 100%; 
}

.custom-section {
    position: relative;
    width: 100%;
    background-color: #08336A;
}

.custom-section::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 35%;
    height: 50%;
    background-color: #CED6E1;
    z-index: 0;
}

.blog-bg-des {
    position: relative;
    z-index: 1;
    color: white;
    /* padding: 20px; */
    max-width: 85%;
}

/* Card styling */
.card-overlay {
    position: absolute;
    top: 50%;
    left: 73%;
    transform: translate(-50%, -50%);
    color: white;
    width: 50%;
}

.card-content{
    margin: 50px 40px;
}

.card-content h3 {
    font-size: 20px;
    font-weight: bold;
}

.card-content p {
    font-size: 16px;
}

/*  */
.card-design-blog {
    position: relative;
    overflow: hidden;
}

.card-design-blog img {
    width: 100%;
    height: auto;
    display: block;
}

.card-overlay1 {
    position: absolute;
    bottom: -48px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(8, 51, 106, 0.65);
    backdrop-filter: blur(5px);
    padding: 10px 20px;
    width: 90%;
    color: #fff;
}


.card-dn-text p,
.blog-upts p {
    font-size: 14px;
    color: #0C2C41;
}




.blog-upts h4 {
    font-size: 26px;
    font-weight: 600;
}

.blog-upts {
    position: relative;
    overflow: hidden;
}

.blog-upts .image1,
.blog-upts .image2 {
    width: 100%;
    transition: transform 0.3s ease-in-out;
}

.blog-upts .image1:hover,
.blog-upts .image2:hover {
    transform: scale(1.05);
}




.vertical-lines {
    position: relative;
    padding-left: 140px;
}

.vertical-lines::before {
    content: "";
    position: absolute;
    left: 100px;
    top: 0;
    width: 2px;
    height: 100%;
    background-color: #08336A;
}

.bottom-style h5 {
    display: inline-block;
    border-bottom: 1px solid #08336A;
    padding-bottom: 5px;
}

.bottom-style p {
    font-size: 13px;
}

/* blog category page 1 */
.vertical-lines1 {
    position: relative;
    padding-left: 100px;
}

.vertical-lines1::before {
    content: "";
    position: absolute;
    left: 60px;
    top: 0;
    width: 2px;
    height: 100%;
    background-color: #08336A;
}


.cat1-card,
.cat-card,
.cat2-card {
    background-color: #f1f1f1;
    width: 300px;
    transition: all 0.3s ease-in-out;
}

.cat1-card .fa-circle,
.cat-card .fa-circle,
.cat2-card .fa-circle {
    font-size: 8px;
    color: #08336A;
}

.cat1-card:hover,
.cat-card:hover,
.cat2-card:hover {
    background-color: #08336A;
}

.cat1-card:hover p,
.cat-card:hover p,
.cat2-card:hover p {
    color: white;
}

.cat1-card:hover i,
.cat-card:hover i,
.cat2-card:hover i {
    color: #F76B01;
}

.cat1-card:first-child {
    background-color: #08336A;
}

.cat1-card:first-child p {
    color: white;
}

.cat1-card:first-child i {
    color: #F76B01;
}


/*  */
.cat2-card:nth-child(2) {
    background-color: #08336A;
}

.cat2-card:nth-child(2) p {
    color: white;
}

.cat2-card:nth-child(2) i {
    color: #F76B01;
}