@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

@font-face {
     font-family: 'Wisteria';
     src: url('../fonts/Wisteria.woff') format('woff'),
          url('../fonts/Wisteria.ttf') format('truetype'),
          url('../fonts/Wisteria.otf') format('opentype');
     font-weight: 400;
     font-style: Regular;
}

:root {
     --bg-color: #000000CC;
     --secondary: #706F6F;
     --section-bg: #EFEFEF;
     --outline: #00000040;
     --radius: 12px;
     --border-color: #D9D9D9;
     --body-bg: #F9F9F9;
     --font-popins: "Poppins", sans-serif;
     --font-wisteria: 'Wisteria', sans-serif;
     --font-mont: "Montserrat", sans-serif;
}

* {
     margin: 0;
     padding: 0;
     box-sizing: border-box;
}

body {
     margin: 0;
     padding: 0;
     box-sizing: border-box;
     font-family: var(--font-popins);
     color: var(--bg-color);
     background-color: var(--body-bg);
}

.align-center {
     display: flex;
     justify-content: center;
     align-items: center;
}

.radius-50 {
     border-radius: 50%;
}

li {
     list-style: none;
}

a {
     text-decoration: none;
     color: inherit;
}

a:hover {
     text-decoration: none;
}

ul {
     margin: 0;
     padding: 0;
}

hr {
     border-bottom: 3px solid var(--section-bg);
}

h1, h2, h3, h4, h5, h6 {
     font-family: var(--font-mont);
     font-weight: 700;
     font-style: Regular;

}

.invalid-feedback {
     display: block !important;
}

.alert {
     --bs-alert-bg: transparent;
     --bs-alert-padding-x: 1rem;
     --bs-alert-padding-y: 1rem;
     --bs-alert-margin-bottom: 1rem;
     --bs-alert-color: inherit;
     --bs-alert-border-color: transparent;
     --bs-alert-border: 1px solid var(--bs-alert-border-color);
     --bs-alert-border-radius: 0.75rem;
     position: relative;
     padding: var(--bs-alert-padding-y) var(--bs-alert-padding-x);
     margin-bottom: var(--bs-alert-margin-bottom);
     color: var(--bs-alert-color);
     background-color: var(--bs-alert-bg);
     border: var(--bs-alert-border);
     border-radius: var(--bs-alert-border-radius);
}

.alert-heading {
     color: inherit;
}

.alert-link {
     font-weight: 700;
}

.alert-dismissible {
     padding-right: 3rem;
}

.alert-dismissible .btn-close {
     position: absolute;
     top: 0;
     right: 0;
     z-index: 2;
     padding: 1.25rem 1rem;
}

.alert-primary {
     --bs-alert-color: #12668b;
     --bs-alert-bg: #d2eefa;
     --bs-alert-border-color: #bce6f8;
}

.alert-primary .alert-link {
     color: #0e526f;
}

.alert-secondary {
     --bs-alert-color: #67227f;
     --bs-alert-bg: #eed7f6;
     --bs-alert-border-color: #e6c4f2;
}

.alert-secondary .alert-link {
     color: #521b66;
}

.alert-success {
     --bs-alert-color: #1a7433;
     --bs-alert-bg: #d5f3dd;
     --bs-alert-border-color: #bfeccc;
}

.alert-success .alert-link {
     color: #155d29;
}

.alert-info {
     --bs-alert-color: #2a128b;
     --bs-alert-bg: #dad2fa;
     --bs-alert-border-color: #c8bcf8;
}

.alert-info .alert-link {
     color: #220e6f;
}

.alert-warning {
     --bs-alert-color: #984d16;
     --bs-alert-bg: #ffe6d3;
     --bs-alert-border-color: #ffd9bd;
}

.alert-warning .alert-link {
     color: #7a3e12;
}

.alert-danger {
     --bs-alert-color: #991c1c;
     --bs-alert-bg: #ffd5d5;
     --bs-alert-border-color: #ffc0c0;
}

.alert-danger .alert-link {
     color: #7a1616;
}

.alert-light {
     --bs-alert-color: #626264;
     --bs-alert-bg: #fdfdfe;
     --bs-alert-border-color: #fcfcfd;
}

section {
     margin: 20px 0px;
}

.form-check-input {
     box-shadow: none;
     border: 1px solid var(--border-color) !important;
     outline: none;
     border-color: var(--border-color);
     border-radius: 50% !important;
}

.form-check-input:focus {
     box-shadow: none;
     border: 1px solid var(--border-color);
     outline: none;
}

.form-check-input:checked {
     background-color: var(--secondary);
     color: var(--bg-color);

}

.btn-primary {
     background-color: var(--bg-color);
     color: #fff;
     border-radius: calc(var(--radius) * 10);
     border: 1px solid var(--bg-color);
     outline: none;
     box-shadow: none;
     margin: 10px 0px;
}

.btn-primary:hover, .btn-primary:active {
     background-color: #fff;
     border: 1px solid var(--bg-color);
     color: var(--bg-color);
}

.btn-primary:focus {
     background-color: #fff;
     border: 1px solid var(--bg-color);
     color: var(--bg-color);
}

.btnprimary {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 10px;
     color: var(--bg-color);
     font-weight: 400;
     border: 1.5px solid var(--border-color);
     padding: 10px 15px;
     border-radius: calc(var(--radius) * 10);
     background-color: transparent;
     transition: 0.4s ease linear;
     position: relative;
}

.btnprimary:hover .icon i {
     transform: rotate(0deg);
}

.btnprimary .icon {
     width: 30px;
     height: 30px;
     display: flex;
     align-items: center;
     justify-content: center;
     border-radius: 50%;
     background-color: var(--section-bg);
     color: var(--bg-color);
     transition: 0.4s ease linear;
}

.btnprimary .icon i {
     transform: rotate(-45deg);
     transition: transform 0.4s ease;
     display: inline-block;
     /* Important for transform to work */
}

button, input, optgroup, select, textarea {
     background-color: var(--section-bg);
     border-radius: 40px;
     border: 1px solid var(--bg-color);
     height: 48px;
     padding: 10px;
}

input::placeholder {
     color: var(--secondary);
     text-transform: capitalize;
}

.form-control:focus, select:focus, textarea:focus {
     box-shadow: none;
     border: 1px solid var(--border-color);
     outline: none;
}

.form-control, select, textarea {
     background-color: var(--section);
     border-radius: 30px;
     border: 1px solid var(--border-color);
}

.form-select {
     background-color: var(--section);
     border-radius: 30px;
     border: 1px solid var(--border-color);
}

textarea {
     min-height: 250px;
     height: 250px;
     max-height: 400px;
}

.top_banner {
     position: relative;
     margin-top: 100px;
     margin-bottom: 100px;
}

.top_banner .image {
     position: relative;
     box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
     border-radius: var(--radius);
     opacity: 0.8;
     background-color: var(--section-bg);
}

.top_banner .image img {
     width: 100%;
     height: 450px;
     border-radius: var(--radius);
     opacity: 0.5;
     background-color: var(--section-bg);
     object-fit: cover;
}

.top_banner .image .button_baner {
     position: absolute;
     top: 50%;
     transform: translate(-50%, -50%);
     left: 50%;
     width: 200px;
     text-align: center;
     background-color: var(--secondary);
     border: 1px solid var(--border-color);
     color: #fff;
     font-weight: 600;
     font-size: 30px;
     display: flex;
     align-items: center;
     justify-content: center;
}

.video-thumbnail-wrapper {
     position: relative;
     display: inline-block;
     cursor: pointer;
}

.play-button {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     background: #fff;
     border-radius: 50%;
     width: 80px;
     height: 80px;
     display: flex;
     align-items: center;
     justify-content: center;
     transition: all 0.3s ease;
}

.play-button svg {
     margin-left: 5px;
     /* Adjust play icon position */
}

.video-thumbnail-wrapper:hover .play-button {
     background: var(--bg-color);
     transform: translate(-50%, -50%) scale(1.1);
}

.video-thumbnail-wrapper .play-button {
     background: var(--bg-color);
     transform: translate(-50%, -50%) scale(1.1);
}

.video_player .video-thumbnail-wrapper img {
     border-radius: var(--radius);
}

.logo_text {
     font-family: var(--font-popins) !important;
     color: var(--secondary) !important;
     font-weight: 900;
}

/* header css start */
header nav {
     padding-top: 15px;
}

header nav .nav_links_menu ul {
     display: flex;
     justify-content: start;
     align-items: center;
     gap: 60px;
}

header nav .nav_links_menu ul li a {
     color: var(--bg-color);
     font-weight: 700;
     font-size: 18px;
     font-family: var(--font-mont);

}

header nav .btnprimary {
     font-family: var(--font-mont);
     font-weight: 700;
     font-size: 18px;
}

header nav .nav_links_menu ul li a img {
     width: 50px;
}

header nav .menu-buttons {
     display: flex;
     justify-content: end;
     align-items: baseline;
     margin-top: 10px;
}


header nav .ceo_tab {
     font-weight: 800 !important;
     font-size: 45px !important;
     font-family: var(--font-wisteria);
}


/* home page css */



.top-section .top_banner {
     position: relative;
     margin-top: 50px;
}

.top-section .top_banner .top-heading h1 {
     font-size: 70px;
}



.block_setion {
     display: flex;
     flex-direction: column;
     gap: 20px;
     width: 100%;
}

.top_img img {
     width: 100%;
}

.bottom_img {
     display: flex;
}

.bottom_img img {
     width: 50%;

}

.bottom_img img:nth-child(1) {
     border-top-left-radius: 80px;
     padding-right: 5px;

}

.bottom_img img:nth-child(2) {
     border-top-right-radius: 80px;
     padding-left: 5px;

}

.top_right {
     width: 100%;
     height: 100%;
}

.top_right img {
     width: 100%;
     height: 100%;
     object-fit: cover;
}

/* counter section */

.counter_bar {
     border-radius: calc(var(--radius) * 10);
     border: 2px solid var(--border-color);
     padding: 40px 20px;
     margin-top: 100px;
}

.counter_bar .count_up .title {
     color: var(--bg-color);
     font-weight: 700;
     font-size: 30px;
}

.counter_bar .count_up {
     text-align: center;
}

.counter_bar .count_up .text {
     text-transform: uppercase;
     font-weight: 500;
}

/* overview css */

.overview {
     position: relative;
     margin-top: 80px;
     margin-bottom: 20px;
}

.overview .text h1 {
     text-align: center;
     text-transform: uppercase;
     font-size: 60px;
     margin-bottom: 50px;

}

.overview .card_section {
     border: 2px solid var(--border-color);
     border-radius: calc(var(--radius) + 8px);
}

.overview .card_section .card_body {
     padding: 20px;
     text-align: center;
     position: relative;
}

.overview .top_abs {
     width: 30px;
     height: 30px;
     text-align: center;
     border: 1px solid var(--border-color);
     border-radius: 50%;
     position: absolute;
     top: 0;
     font-weight: 600;
     display: flex;
     align-items: center;
     justify-content: center;
     transform: translate(-50%, -50%);
     background: var(--body-bg);
     left: 50%;
}

.overview .title {
     font-weight: 600;
     font-size: 30px;
     margin: 20px 0px;
}

/* ultimate css */
.ultimate {
     margin-top: 100px;
     margin-bottom: 20px;
     position: relative;
     background-color: var(--section-bg);
     padding: 20px 0px;
}


.ultimate .img img {
     width: 400px;
     border-radius: calc(var(--radius) + 8px);
     height: 500px;
     object-fit: cover;
     position: relative;
     top: -60px;
}

.ultimate .top_view {
     padding-top: 45px;
}

.ultimate .top_view .title h1 {
     text-align: center;
     text-transform: uppercase;
}

.ultimate .top_view .para {
     padding: 20px 50px;
}

.ultimate .top_view .top-li {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(40%, 1fr));
     justify-content: center;
     align-items: center;
     place-items: center;
     gap: 20px;
     padding: 20px 60px;

}


.ultimate .top_view .top-li span {
     text-align: justify;
     width: 100%;
     position: relative;
     color: var(--secondary);
     text-transform: uppercase;
}


.ultimate .top_view .top-li span::before {
     content: "";
     position: absolute;
     width: 5px;
     height: 5px;
     left: -10px;
     top: 44%;
     background: var(--secondary);
     border-radius: 50%;
}


.ultimate .top_view .ultimat_button {
     display: flex;
     justify-content: center;
     gap: 30px;
}


.ultimate .top_view .ultimat_button .btnprimary {
     background-color: var(--secondary);
     color: #fff;
     width: 200px;
     justify-content: space-between;

}

/* our_product css*/

.our_product {
     position: relative;
}

.our_product .title h1 {
     text-align: center;
     text-transform: uppercase;
     font-size: 60px;
     margin-bottom: 30px;
}

.product_list .p_card {
     position: relative;
     margin-bottom: 20px;
}

.product_list .p_card .p_image {
     overflow: hidden;
     border-radius: calc(var(--radius) + 8px);
}

.product_list .p_card .p_image img {
     position: relative;
     width: 100%;
     border-radius: calc(var(--radius) + 8px);
     height: 220px;
     object-fit: cover;
     transition: 0.4s ease-in-out;

}

.product_list .p_card .p_image img:hover {
     transform: scale(1.1);
}


.product_list .p_card .p_image {
     position: relative;

}

.product_list .p_card .p_img_abs {
     position: absolute;

     bottom: 20px;
     left: 20px;
     display: flex;
     gap: 20px;
}

.product_list .p_card .p_img_abs a {
     color: #fff;
     border: 1px solid var(--border-color);
     border-radius: calc(var(--radius) * 3);
     padding: 5px 12px;
}

.product_list .p_card .p_details .p_title {
     margin: 2px 0px;
     font-weight: 600;
     font-size: 20px;
}

.product_list .p_card .p_btn a {
     margin-top: 20px;
     width: 100%;
}

/* company_since */
.company_since .images {
     position: relative;
     display: flex;
}

.company_since .images .bottom {

     box-shadow: rgb(144 143 143 / 35%) 0px 5px 15px;
}

.company_since .images .top img {
     width: 300px;
     height: 400px;
     object-fit: cover;

}

.company_since .images .bottom img {
     width: 300px;
     height: 400px;
     object-fit: cover;
     position: absolute;
     left: 170px;
     top: 65px;
     background-color: #fff;
     padding: 10px;

}

.company_since .title h1 {
     font-size: 50px;
     text-align: center;
}

/* ceo_section css */
.ceo_section {
     position: relative;
     margin-top: 120px;
}

.ceo_section .box_details {
     border: 1px solid var(--border-color);
     border-left: 8px solid var(--border-color);
     padding: 20px;
}

.ceo_section .flex_item {
     display: flex;
     flex-direction: row;
     align-items: center;
     gap: 20px;
}

.ceo_section .flex_item a {
     text-decoration: underline;
}

.ceo_section .flex_item img {
     width: 100px;
}

.ceo_section .ceo_img {
     text-align: end;
}

.ceo_section .ceo_img img {
     width: 400px;
}

.ceo_section .title h1 {
     margin-bottom: 30px;
}

.ceo_section .flex_box {
     display: flex;
     justify-content: space-between;
     margin-top: 30px;

}

.ceo_section .flex_box .item {
     position: relative;
}

.ceo_section .flex_box .item .elipse img {
     width: 100px;
}

.ceo_section .flex_box .item .icon img {
     width: 35px;
     position: absolute;
     top: 52px;
     transform: translate(-50%, -50%);
     left: 50%;
     filter: opacity(0.5);
}

.ceo_section .flex_box .item .text {
     margin: 15px 0px;
     font-weight: 500;
     text-align: center;
}

/* our_team css */

.our_team {
     position: relative;
     margin-top: 50px;
     margin-bottom: 20px;
}

.our_team .title h1 {
     margin-bottom: 20px;
}

.card_team {
     background-color: #fff;
     border: 2px solid var(--border-color);
     border-radius: calc(var(--radius) + 8px);
     display: flex;
     align-items: center;
     gap: 20px;
     flex-direction: row;
     min-height: 220px;
     padding: 20px;
     margin: 10px 20px;
}

.card_team .para {
     font-size: 15px;
     color: var(--secondary);
}

.card_team .card_team_img img {
     width: 100px;
     height: 100px;
     border-radius: 50%;
}

.card_team_details .title {
     font-weight: 700;
     margin-bottom: 5px;
     color: var(--bg-color);
     text-transform: uppercase;
}

.card_team_details .social {
     display: flex;
     justify-content: flex-start;
     align-items: center;
     gap: 25px;
     margin-top: 10px;
}

.card_team_details .social a {
     width: 40px;
     height: 40px;
     display: flex;
     justify-content: center;
     align-items: center;
     border-radius: 50%;
     background-color: var(--bg-color);
     color: #fff;
}

.swiper-button-next:after, .swiper-button-prev:after {
     font-size: 16px !important;
     color: var(--secondary) !important;
     background-color: var(--border-color);
     width: 30px;
     height: 30px;
     display: flex;
     justify-content: center;
     align-items: center;
     border-radius: 50%;
}

.swiper-button-prev, .swiper-rtl .swiper-button-next {
     width: 30px;
}

.swiper-button-prev, .swiper-rtl .swiper-button-next {
     width: 30px;
}

.swiper-button-next, .swiper-button-prev {
     width: 30px !important;
}

.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
     border-radius: 0px !important;
     background: var(--bg-color);
}

.swiper-pagination-bullet {
     width: 30px !important;

     border-radius: 0px;
}

.swiper-pagination-bullet-active {
     background: var(--bg-color);
}

.swiper-pagination.swiper-pagination-bullets.swiper-pagination-horizontal {
     position: relative !important;
}

/* our_social_works css */

.our_social_works {
     position: relative;
     margin-top: 50px;
}

.our_social_works .circle_tag {
     position: relative;
     text-align: center;
}

.our_social_works .tag_img img {
     width: 180px;
}

.our_social_works .tag_img {
     position: relative;
}

.our_social_works .tag_img .text {
     position: absolute;
     transform: translate(-50%, -50%);
     left: 50%;
     top: 50%;
     font-weight: 700;
     font-size: 35px;
}

.our_social_works .circle_tag .text.one {
     color: #0456ae !important;
}

.our_social_works .circle_tag .text.two {
     color: #60b1e1 !important;
}

.our_social_works .circle_tag .text.three {
     color: #ffc26c !important;
}

.our_social_works .circle_tag .text.four {
     color: #29d27b !important;
}

.our_social_works .details {
     text-align: center;
     margin-top: 25px;
     margin-bottom: 10px;
}

.our_social_works .details .text_title {
     font-weight: 700;
     color: var(--bg-color);
     font-size: 30px;
     text-transform: capitalize;
}

/* newsletter css */

.newsletter {
     position: relative;
     overflow: hidden;
     background-color: var(--section-bg);
     border-radius: calc(var(--radius) + 8px);
     margin-top: 100px;
     margin-bottom: 40px;

}

.newsletter .flex_box_new {
     display: flex;
     justify-content: space-between;
     flex-direction: row;
     position: relative;
     align-items: center;
}

.flex_box_new .imf:nth-of-type(1) img {}

.newsletter .flex_box_new .imf img {
     width: 400px;
     height: 400px;
     object-fit: cover;
     margin-left: -106px;
}

.newsletter .flex_box_new .test-context {
     text-align: center;
}

.newsletter .flex_box_new .test-context .title {
     font-size: 40px;
     font-weight: 600;

}

.newsletter .flex_box_new .input_group .input {
     margin-top: 25px;
     position: relative;
     flex: 0 0 80%;
}

.newsletter .flex_box_new .input_group .input input {
     width: 100%;
     padding-left: 40px;


}

.newsletter .flex_box_new .input_group .input input:placeholder {
     padding-left: 30px;
}

.newsletter .flex_box_new .input_group .input span {
     position: absolute;
     left: 15px;
     top: 13px;
}

.newsletter .flex_box_new .input_group {
     display: flex;
     align-items: baseline;
     gap: 20px;
}

.newsletter .flex_box_new .input_group button {
     text-transform: capitalize;
     background-color: var(--bg-color);
     color: #ffff;
     padding: 12px 25px;
     border: 1px solid var(--bg-color);
}


/* ceo story css */
.top_baner_ceo {
     position: relative;
}


.top_baner_ceo .img img {
     /* position: absolute; */
     top: 0;
     z-index: -1;
     width: 100%;
     /* height: 100%; */
     opacity: 0.4;
     object-fit: contain;
     height: 500px;
     background: radial-gradient(#e0e0e0, transparent);
}

.top_baner_ceo .text_content .title_main {
     position: absolute;
     top: 100px;
     width: 400px;
}

.top_baner_ceo .text_content .title_text {
     font-family: var(--font-popins);
     font-size: 35px;
     font-weight: 700;
     margin-bottom: 100px;
}

.top_baner_ceo .text_content .btnprimary {
     width: fit-content;
     background-color: var(--secondary);
     color: #fff;
     text-transform: capitalize;
}

.ceo_image .ceo img {
     border-radius: 15px;
     border: 2px solid var(--border-color);
     padding: 0px;
     width: 400px;
     height: 420px;
     object-fit: contain;
}

.ceo_image .social_icons .flex {
     display: flex;
     align-items: center;
     gap: 30px;
}

.social_icons .flex .btnprimary {
     background-color: var(--secondary);
     color: #fff;
}

.social_icons .flex span.icons {
     width: 50px;
     height: 50px;
     display: flex;
     justify-content: center;
     align-items: center;
     background-color: var(--secondary);
     border-radius: 50%;
     font-size: 30px;
     color: #fff;
}

.helping_people {
     margin-top: 100px;
}

.helping_people .img-help img {
     width: 100%;
     border-radius: 10px;
}

.helping_people .para_text p {
     padding-right: 100px;
}

.helping_people .para_text .btnprimary {
     background-color: var(--secondary);
     color: #fff;
     margin: 20px 0px;
}

.story_section .img img {
     border-radius: var(--radius);
     width: 100%;
}

.story_section {
     margin-top: 100px;
}

.hubspot {
     margin-top: 100px;
}

.hubspot .title h1 {
     text-align: center;
}

.hubspot .hub_card {
     border-radius: var(--radius);
     border: 2px solid var(--border-color);
     margin: 20px 0px;
     text-align: center;
     padding: 20px;
}

.hubspot .hub_card .img img {
     opacity: 0.9;
}

.hubspot .hub_card .title {
     margin: 10px 0px;
     color: var(--bg-color) !important;
     font-weight: 700;
     font-size: 25px;
}

.hubspot .hub_card .text-center {
     display: flex;
     justify-content: center;
     margin: 15px 0px;
}

.hubspot .hub_card .text-center .btnprimary {
     background-color: var(--secondary);
     color: #fff;
}



.timeline-container {
     display: flex;
     width: 100%;

}

/* Left Section: My Timeline Circle and Line */
.timeline-left {
     flex: 0 0 30%;
     /* Take 30% of the width */
     display: flex;
     flex-direction: column;
     align-items: center;
     position: relative;
     padding-right: 50px;
     /* Space for the line */
}

.timeline-circle {
     width: 200px;
     /* Diameter of the circle */
     height: 200px;
     background-color: #fff;
     border: 15px solid #e0e0e0;
     /* Outer ring */
     border-radius: 50%;
     display: flex;
     justify-content: center;
     align-items: center;
     text-align: center;
     position: sticky;
     /* Make it sticky as content scrolls */
     top: 20px;
     /* Adjust top position as needed */
     z-index: 2;
     /* Ensure it's above the line */
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
}

.timeline-title {
     font-size: 1.8em;
     color: #333;
     margin: 0;
     line-height: 1.2;
     font-weight: bold;
}

.timeline-line {
     position: absolute;
     left: calc(50% + 15px);
     /* Center relative to the circle's border + small offset */
     top: 0;
     bottom: 0;
     width: 6px;
     /* Thickness of the main line */
     background-color: #ccc;
     /* Main line color */
     transform: translateX(-50%);
     /* Adjust for centering */
     z-index: 1;
}

.timeline-line::before,
.timeline-line::after {
     content: '';
     position: absolute;
     width: 20px;
     height: 20px;
     background-color: #ccc;
     border-radius: 50%;
     left: 50%;
     transform: translateX(-50%);
}

.timeline-line::before {
     top: -10px;
     /* Position the start dot */
     background-color: #888;
     /* Darker dot color */
}

.timeline-line::after {
     bottom: -10px;
     /* Position the end dot */
     background-color: #888;
     /* Darker dot color */
}


/* Right Section: Timeline Steps */
.timeline-right {
     flex: 1;
     /* Take remaining width */
     display: flex;
     flex-direction: column;
     padding-left: 50px;
     /* Space for the connecting lines */
}

.timeline-item {
     position: relative;
     margin-bottom: 40px;
     /* Space between items */
}

.timeline-item:last-child {
     margin-bottom: 0;
     /* No margin after the last item */
}

.timeline-dot {
     position: absolute;
     left: -48px;
     /* Position relative to .timeline-step */
     top: 50%;
     transform: translateY(-50%);
     width: 20px;
     height: 20px;
     background-color: #888;
     /* Match main line dot color */
     border-radius: 50%;
     z-index: 3;
     /* Ensure dots are above lines */
}

/* Connecting line from main timeline to step */
.timeline-dot::before {
     content: '';
     position: absolute;
     top: 50%;
     right: 100%;
     /* Connects to the main line */
     width: 25px;
     /* Length of the connecting line */
     height: 3px;
     /* Thickness of the connecting line */
     background-color: #888;
     transform: translateY(-50%);
}


.timeline-step {
     display: flex;
     align-items: center;
     background-color: var(--secondary);
     /* Darker background for step card */
     color: #fff;
     border-radius: 100px;
     padding: 20px;
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
     min-height: 120px;
     position: relative;
     /* Ensure consistent height for cards */
}

.step-number {
     background-color: rgba(255, 255, 255, 0.2);
     /* Semi-transparent white for step number background */
     border-radius: 8px;
     padding: 10px 15px;
     font-size: 1em;
     font-weight: bold;
     margin-right: 25px;
     flex-shrink: 0;
     width: 100px;
     height: 100px;
     border-radius: 50%;
     display: flex;
     justify-content: center;
     align-items: center;
     /* Prevent it from shrinking */
}

.step-content {
     flex-grow: 1;
     /* Allow content to take available space */
     margin-right: 20px;
}

.step-title {
     font-size: 1.2em;
     margin: 0 0 5px 0;
     color: #fff;
     font-weight: bold;
}

.step-description {
     font-size: 0.9em;
     line-height: 1.5;
     margin: 0;
     color: #f0f0f0;
}

.step-icon-wrapper {
     background-color: #e0e0e0;
     /* Light gray background for icon */
     border-radius: 50%;
     width: 60px;
     height: 60px;
     display: flex;
     justify-content: center;
     align-items: center;
     flex-shrink: 0;
     /* Prevent shrinking */
}

.step-icon-wrapper i {
     font-size: 2.2em;
     /* Adjust icon size */
     color: #555;
     /* Dark gray icon color */
     line-height: 1;
     /* Ensure icon is vertically centered */
}

/* Icon Placeholders (replace with actual icon font/SVG setup) */
/* For demonstration, using text as icons */
.icon-lightbulb,
.icon-settings,
.icon-target,
.icon-dollar,
.icon-chart {
     font-style: normal;
     /* To remove italic for placeholder text */
     font-weight: normal;
}




/* podcast_ceo css */
.podcast_ceo_details {
     margin-top: 100px;
}

.podcast_ceo_details .btnprimary {
     background-color: var(--secondary);
     color: #ffff;
     margin: 20px 0px;
     width: fit-content;
}

.podcast_ceo_details .imgs .imgs-baner {
     display: flex;
     justify-content: end;
     position: relative;
}

.podcast_ceo_details .imgs .imgs-baner span {
     background-color: var(--secondary);
     background-image: url(../images/one.jpg);
     border-radius: var(--radius);
     width: 300px;
     height: 300px;
     display: block;
     box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
     object-fit: contain;
     background-size: cover;
}

.podcast_story {
     margin-top: 100px;
}

.podcast_ceo_details .imgs .imgs-baner span img {

     border-radius: var(--radius);
     width: 300px;
     height: 325px;
     display: block;
     position: absolute;
     right: 10%;
     top: 25px;
     box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
     object-fit: contain;
     background: radial-gradient(black, #00000087);
}

.podcast_story .ep_card {
     border: 2px solid var(--border-color);
     color: var(--secondary);
     border-radius: 30px;
     padding: 10px 20px;
     width: 100%;
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 20px;
     margin: 20px 0px;
}

.podcast_story .ep_card .img i {
     font-size: 25px;
}

.podcast_story .ep_card .text {
     font-weight: 600;
     font-size: 20px;
}

.audio_card {
     border: 2px solid var(--border-color);
     border-radius: var(--radius);
     padding: 20px;
     margin: 20px 0px;
     display: flex;
     gap: 20px;
     /* justify-content: space-between; */
}

.audio_card .icon {
     font-size: 65px;
     background-color: var(--secondary);
     border-radius: var(--radius);
     padding: 10px;
     display: flex;
     justify-content: center;
     align-items: center;
     color: #fff;
     width: 100px;
     height: 100px;
}

.audio_card .icon i {
     transform: rotate(-45deg);
}

.audio_card .detail_card {
     width: 100%;
}

.audio_card .detail_card.title {
     font-weight: 600;
     margin: 10px 0px;
}

.audio_card .detail_card .text {
     margin-bottom: 10px;
     font-size: 14px;
}

.audio_card .detail_card .date {
     font-size: 12px;
     font-weight: 600;
}

.audio_card .audio_div .flex {
     display: flex;
     justify-content: space-between;
     align-items: center;
}

.audio_card .audio_div .flex span:first-child {
     color: var(--secondary);
     font-size: 12px;
     font-weight: 400;
}

.audio_card .audio_div .flex span.audio {
     width: 40px;
     height: 40px;
     background-color: var(--bg-color);
     color: #fff;
     border-radius: 50%;
     display: flex;
     justify-content: center;
     align-items: center;
     font-size: 25px;
     cursor: pointer;
}

.podcast_section {
     margin-top: 100px;
     margin-bottom: 50px;
}

.podcast_section .pod_card {
     margin: 20px 0px;
}

.podcast_section .pod_card .pod_img {
     position: relative;
}

.podcast_section .pod_card .pod_img img {
     width: 100%;
     height: 250px;
     border-radius: var(--radius);
     object-fit: cover;
}

.podcast_section .pod_card .pod_img .audio {
     width: 40px;
     height: 40px;
     display: grid;
     place-items: center;
     border-radius: 50%;
     position: absolute;
     bottom: 15px;
     left: 20px;
     background-color: var(--body-bg);
     font-size: 25px;
     cursor: pointer;
}

.podcast_section .pod_card .pod-details {
     margin: 20px 0px;
}

.podcast_section .pod_card .pod-details .title {
     margin: 0px 0px 0px 0px;
     font-weight: 500;
     font-size: 18px;
}

.podcast_section .pod_card .pod-details .date {
     font-size: 12px;
     color: var(--secondary);
}

.podcast_section .pod_card .pod-details .text {
     font-size: 14px;
     color: var(--secondary);
     font-weight: 400;
}

.podcast_section .pod_card .pod-details .socials {
     display: flex;
     align-items: center;
     gap: 10px;
     color: var(--bg-color);
}

.podcast_section .pod_card .pod-details .socials a {
     color: var(--bg-color);
}

.about_section .top_span:first-child {
     color: red;
     font-size: 30px;
}

.about_section .top_span span svg {
     width: 60px;
     height: 60px;
}

.about_section .text_about_top {
     font-size: 35px;
     font-weight: 600;
}

.about_section .text_about_top span {
     color: red;
}

.about_section .image_sec-block img {
     width: 100%;
     border-radius: var(--radius);
     height: 300px;
     object-fit: cover;
}

.about_section .about_iamge_sec {
     display: flex;
     flex-direction: row;
     justify-content: space-between;
     align-items: center;
}

.about_section .about_iamge_sec img {
     width: 300px;
     height: 250px;
     border-radius: var(--radius);
     object-fit: cover;
     margin-bottom: 40px;
}

.about_section .counters_flex {
     display: flex;
     flex-direction: row;
     justify-content: space-between;
     align-items: center;
     margin: 20px 0px;
     text-align: center;
}

.about_section .counters_flex .item span {
     font-weight: 700;
     font-size: 30px;
}

.about_section .counters_flex .item .text {
     text-transform: uppercase;
     color: var(--secondary);
     font-size: 14px;
     font-weight: 400;
}

.about_section .watch_info {
     margin: 20px 0px;
     display: flex;
     align-items: center;
     gap: 25px;
}

.about_section .watch_info .audio {
     width: 60px;
     height: 60px;
     border-radius: 50%;
     display: flex;
     justify-content: center;
     align-items: center;
     background-color: transparent;
     color: var(--bg-color);
     border: 1px solid var(--border-color);
     font-size: 30px;
}

.about_section .watch_info span {
     font-weight: 500;
     font-size: 30px;
}

.about_company {
     margin-top: 100px;
     position: relative;
}

.about_company .title_red {
     color: red;
     font-weight: 600;
     font-size: 25px;
     margin-bottom: 20px;
}

.about_company .btnprimary {
     background-color: var(--secondary);
     color: #fff;
     margin: 20px 0px;
}

.asked_acd .accordion .accordion-item {
     margin-bottom: 15px;
     border: none;
     background-color: transparent;
     border: 2px solid var(--border-color) !important;
     border-radius: calc(var(--radius) + 5px);
}

.asked_acd .accordion .accordion-item .accordion-button::after {
     content: "\f061";
     font-family: "Font Awesome 6 Free";
     border: none;
     width: 0;
     height: 0px;
     position: absolute;
     right: 10px;
     /* top: 16px; */
     width: 30px;
     height: 30px;
     background: var(--secondary);
     display: flex;
     color: #fff;
     justify-content: center;
     align-items: center;
     border-radius: 50%;
     font-size: 17px;
}

.asked_acd .accordion .accordion-item .accordion-button {

     border: 2px solid transparent !important;
     background-color: transparent;
     color: var(--secondary);
     height: 60px;
     font-family: var(--font-popins);
     font-weight: 600;
     font-size: 20px;
}

.asked_acd .accordion .accordion-item .accordion-button:focus {
     outline: none;
     box-shadow: none;
     border: none;
}

.asked_acd .accordion .accordion-item .accordion-button[aria-expanded="true"] {
     border-bottom-left-radius: 0px !important;
     border-bottom-right-radius: 0px !important;
}

.asked_acd .accordion .accordion-item .accordion-collapse {
     border: none !important;
     border-radius: 0 0 calc(var(--radius) + 5px) calc(var(--radius) + 5px);
}

.team_mentors {
     margin-top: 100px;
}

.team_mentors .title_red {
     margin-bottom: 20px;
     color: red;
}

.team_mentors .mentor_image {
     margin: 0px 0px;
}

.team_mentors .mentor_image img {
     margin-bottom: 20px;
     border-radius: var(--radius);
     width: 100%;
}

/* contact page css */
.contact_us {
     margin-top: 50px;
}

.contact_us .title {
     text-align: center;
}

.contact_us small {
     text-align: center;
     width: 100%;
     display: block;
     color: var(--secondary);
}

.contact_us .contact_form {
     background-color: #fff;
     margin: 40px 0px;
     /* border-radius: var(--radius); */
     box-shadow: rgb(99 99 99 / 4%) 0px 2px 8px 0px;
     display: flex;

}

.contact_us .contact_form .box_left {
     padding: 20px;
     background-color: var(--bg-color);
     /* border-radius: var(--radius); */
     width: 40%;
     color: #fff;
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;

     border-radius: 12px 0px 0px 12px;
}

.contact_us .contact_form {
     border-radius: 0px 10px 10px 0px;
}

.contact_us .contact_form .box_left .text_context {

     display: flex;
     flex-direction: column;
     gap: 10px;
}


.contact_us .contact_form .box_left .text_context:first-child {
     font-weight: 700;
     font-size: 25px;
}

.contact_us .contact_form .box_left .text-muted {
     color: #a5a3a3 !important;
     font-size: 15px !important;
     font-weight: 500;
}

.contact_us .contact_form .box_left .socila_div {
     margin-top: 70px;
}

.contact_us .contact_form .box_left .socila_div .icon {
     display: flex;
     align-items: center;
     gap: 40px;
     margin-bottom: 15px;
}

.contact_us .contact_form .box_left .iocens_socials {
     display: flex;
     flex-direction: row;
     gap: 20px;
     margin: 0px 0px;
}

.contact_us .contact_form .box_left .iocens_socials a {
     width: 50px;
     height: 50px;
     display: flex;
     justify-content: center;
     align-items: center;
     border-radius: 50%;
     background-color: var(--secondary);
     color: #fff;
     font-size: 20px;
}

.contact_us .contact_form .box_right {
     width: 60%;
     padding: 20px;

}

.contact_us .contact_form .fom-contact-us form .flex_grid {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(48%, 1fr));
     gap: 20px;
     margin-top: 25px;
}

.contact_us .contact_form .fom-contact-us form .form-control {
     border-top: none !important;
     border-left: none !important;
     border-right: none !important;
     border-radius: 0px !important;
     border-bottom: 2px solid var(--outline);
     padding: 15px 0px !important;
}

.contact_us .contact_form .fom-contact-us form .form-control::placeholder {
     color: var(--secondary);
}

.contact_us .contact_form .fom-contact-us form .form-control:focus {
     outline: none;
     box-shadow: none;
     border-bottom: 2px solid var(--bg-color);
}

.contact_us .contact_form .fom-contact-us form .form-group {
     margin-bottom: 20px;
}

.contact_us .contact_form .fom-contact-us form label {
     font-weight: 500;
     color: var(--bg-color);
}

.contact_us .contact_form .fom-contact-us form .check_boxes {
     display: flex;
     justify-content: space-between;
     align-items: center;
     margin: 10px 0px;
}

.contact_us .contact_form .fom-contact-us form .check_boxes label {
     font-size: 12px;
     font-weight: 500;
}

.contact_us .contact_form .fom-contact-us form .form-check-label {
     font-size: 14px;
}

.contact_us .contact_form .fom-contact-us form #message {
     min-height: 350px;
     border: 1px solid var(--border-color);
     background-color: transparent;
     color: var(--bg-color);
     width: 100%;
     margin-top: 25px;
     border-radius: var(--radius);

}

.map_box iframe {
     border-radius: var(--radius);
}

/* find it more  css*/

.acc_block {
     margin-top: 50px;
     margin-bottom: 50px;
}

.acc_block .text-center.title_for {
     font-weight: 700;
     margin: 10px 0px 50px 0px;
     font-size: 40px;
}

.acc_block .context_block {
     font-size: 20px;
     color: var(--bg-color);
     padding-right: 80px;
     margin-top: 50px;
}

.apply_now {
     margin: 25px 0px;
     background-color: var(--bg-color);
     color: #ffff;
     border: 1px solid var(--bg-color);
     padding: 10px 0px;
     border-radius: 40px;
     display: flex;
     flex-direction: column;
     gap: 5px;
     text-align: center;
     justify-content: center;
     align-items: center;
     font-weight: 600;
     font-size: 18px;
     width: fit-content;
     min-width: 280px;
}

.acc_block .ceo_img {
     text-align: end;
}

.acc_block .ceo_img img {
     width: 100%;
     height: 300px;
     object-fit: contain;
     border-radius: var(--radius);
     background: radial-gradient(#7a7a7a, #000000);
     background-image: url('../images/CEo\ Header.jpg');
     background-size: cover;
}

.find_more_roadmap .find_more_roadmap {
     margin: 40px 0px;
}

.find_more_roadmap .roadmap_block {
     padding: 15px;
     border: 1px solid var(--border-color);
     border-radius: var(--radius);
     margin-bottom: 10px;
     text-align: center;
     display: grid;
     place-items: center;
     min-height: 350px;
     margin-bottom: 10px;
}

.find_more_roadmap .roadmap_block li {
     list-style: disc;
     text-align: left;
}

.find_more_roadmap .roadmap_block .roadmap_img {
     display: grid;
     place-items: center;
     width: 120px;
     height: 120px;
     border-radius: 50%;
     background-color: var(--section-bg);
     border: 1px solid var(--border-color);
     color: var(--body-bg);
     font-size: 35px;

}

.find_more_roadmap .roadmap_block .roadmap_img img {
     width: 110px;
     height: 110px;
     padding: 15px;
}

.find_more_roadmap .roadmap_block .title {
     font-weight: 700;
     font-size: 20px;
     margin: 15px 0px;
     text-transform: uppercase;
}

.who_wait_for {
     margin-top: 40px;
     margin-bottom: 20px;
}

.who_wait_for .wait_card {
     background-color: var(--section-bg);
     color: var(--bg-color);
     padding: 10px;
     border: 1px solid var(--border-color);
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;
     border-radius: var(--radius);
     margin-bottom: 10px;
}

.who_wait_for .wait_card p {
     font-size: 14px;
     text-align: center;
     color: var(--secondary);
}

.who_wait_for .wait_card .title {
     font-size: 16px;
     font-weight: 600;
     margin: 5px 0px;
}

/* applicant_form_light_4_career css */

.applicant_form_light_4_career {
     margin-top: 40px;
}

.your_work_life .div_section_text p {
     text-align: center;
     margin-bottom: 0px;
}

.your_work_life .div_section_text {
     font-family: var(--font-popins);
     border: 2px solid var(--border-color);
     border-radius: var(--radius) !important;
     padding: 10px;
     height: 100%;
     background-color: var(--section-bg);
     margin-bottom: 10px;
}

.your_work_life .div_section_text h1.title_text.text-center {
     font-size: 20px;
}

.accelator_work_life .div_section_text .title_text {
     font-size: 25px;
     font-weight: 900 !important;
}

.accelator_work_life ul li {
     margin-bottom: 20px;
}

.accelator_work_life .work_with_me h1 {
     text-align: center;
}

.accelator_work_life .app_work_with {
     background-color: var(--bg-color);
     padding: 10px;
     border: 1px solid var(--bg-color);
     border-radius: var(--radius);
     color: #fff;
     min-height: 120px;
     display: flex;
     justify-content: center;
     align-items: center;
     gap: 15px;
     margin-bottom: 10px;
}

.accelator_work_life .app_work_with .icon {
     width: 70px;
     height: 70px;
     display: flex;
     justify-content: center;
     align-items: center;
     border-radius: 50%;
     background-color: var(--secondary);
     color: #fff;
     font-size: 30px;
     flex: 15%;
}

.accelator_work_life .app_work_with .body_app {
     flex: 75%;
}

.accelator_work_life .app_work_with .body_app .title {
     font-weight: 700;
     margin-bottom: 6px;
     font-size: 18px;
}


.your_work_life .image_grid {
     display: grid;
     grid-template-columns: repeat(auto-fill, minmax(30%, 1fr));
     gap: 15px;
     margin: 25px 0px;
}


/* Image styling */
.your_work_life .image_grid img {
     width: 100%;
     height: 300px;
     object-fit: cover;
     transition: transform 0.3s ease;
     border-radius: var(--radius);
}

.your_work_life .image_grid:hover {
     transform: scale(1.03);
}

.top_baner_block {
     position: relative;
     margin-top: 50px;
     margin-bottom: 50px;
}

.top_baner_block .context_block .top_01 {
     display: flex;
     align-items: center;
     gap: 20px;
}

.top_baner_block .context_block .top_01 .text {
     font-size: 25px;
     font-weight: 700;
     font-family: var(--font-mont);
}

.top_baner_block .context_block .top_01 .icon {
     width: 50px;
     height: 50px;
     display: flex;
     justify-content: center;
     align-items: center;
     border-radius: 50%;
     background-color: var(--bg-color);
     color: #fff;
     font-size: 20px;
}

.top_baner_block .context_block .bottom_01 .heading {
     font-size: 50px;
     margin-top: 50px;
     margin-bottom: 20px;
     font-weight: 900;
}

.top_baner_block .context_block .bottom_01 .hr {
     width: 100%;
     height: 2px;
     border-radius: var(--radius);
     background-color: var(--border-color);
     display: block;
     margin-bottom: 20px;
}

.top_baner_block .context_block .bottom_01 {
     padding-left: 10px;
}

.top_baner_block .context_block .bottom_01 .para {
     padding-right: 50px;
     font-size: 20px;
     font-weight: 600;
}

.top_baner_block .image {
     text-align: center;
}

.top_baner_block .image img {
     width: 400px;
     border-radius: var(--radius);
     height: 300px;
     object-fit: cover;
}

.handy_toolkit {

     margin: 50px 0px;
     position: relative;
}

.handy_toolkit .heading_title {
     text-align: center;
     margin: 40px 0px;
}

.handy_toolkit .image {
     text-align: center;
}

.handy_toolkit .image img {
     width: 400px;
     border-radius: var(--radius);
     height: 300px;
     object-fit: cover;
}

.handy_toolkit .menu_list .div_item {
     color: var(--bg-color);
     font-size: 25px;
     font-weight: 700;
     display: flex;
     flex-direction: row;
     gap: 20px;
     align-items: center;
     margin: 10px 0px;
}

.handy_toolkit .menu_list .div_item .icon {
     font-size: 25px;
     color: var(--secondary);
}

.handy_toolkit .menu_list .div_item .text {
     font-size: 18px;
}

.starter_kit {
     background-color: var(--bg-color);
     padding: 100px;
}

.starter_kit .flex_items {
     display: flex;
     flex-direction: row;
     justify-content: center;
     gap: 100px;
     color: #fff;
}

.starter_kit .flex_items .text {
     font-size: 30px;
     font-weight: 700;
}

.starter_kit .flex_items .icon a {
     background-color: var(--body-bg);
     border-radius: var(--radius);
     padding: 10px;
     color: var(--bg-color);
     font-size: 30px;
     font-weight: 700;
}

.include_icon {
     margin-top: 50px;
}

.include_icon .text-center h1 {
     margin-bottom: 40px;
}

.include_icon .include_card {
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;
     text-align: center;
     margin: 10px 0px;
}

.include_icon .include_card .card_icon {
     width: 50px;
     height: 50px;
     display: flex;
     justify-content: center;
     align-items: center;
     background-color: var(--bg-color);
     color: #fff;
     border-radius: 50%;
     font-size: 18px;
}

.include_icon .include_card .card_body-text .title {
     font-size: 25px;
     font-weight: 700;
     margin: 18px 0px;
}

.price_section {
     background-color: var(--bg-color);
     padding: 100px;
}

.price_section .text_price_section {
     text-align: center;
     color: #fff;
}

.price_section .text_price_section .button {
     margin-top: 30px;
}

.price_section .text_price_section .button a {
     background-color: var(--body-bg);
     border-radius: var(--radius);
     padding: 10px;
     color: var(--bg-color);
     font-size: 20px;
     font-weight: 700;

}

.get_started h1 {
     text-align: center;
}

.get_started .div.mt-5.mb-5 {
     text-align: center;
}

.get_started .div.mt-5.mb-5 a {
     background-color: var(--bg-color);
     border-radius: var(--radius);
     padding: 10px;
     color: #fff;
     font-size: 20px;
     font-weight: 700;
}

/* footer css */

footer .logo img {
     width: 50px;
     margin-bottom: 80px;
     margin-top: 50px;
}

footer .logo {

     margin-bottom: 30px;
}

footer ul {
     display: grid;

}

footer .flex_item {
     display: flex;
     flex-direction: row;
     align-items: center;
     justify-content: space-between;
}

footer .flex_item .input input {
     width: 500px;
     border: none;
     border-bottom: 2px solid var(--border-color);
     background-color: transparent !important;
     color: var(--bg-color);
     border-radius: 0px !important;
     padding-left: 0px;
}

footer .flex_item .input input:focus {
     outline: none;
     box-shadow: none;
}

footer ul li a {
     color: var(--bg-color);
     text-transform: capitalize;
     font-weight: 500;
     margin-bottom: 20px;
     display: block;

}

footer .menu_bottom {
     text-align: center;
     display: flex;
     flex-direction: row;
     gap: 30px;
     align-items: baseline;
     justify-content: center;
}

footer .menu_bottom li a {
     display: inline-block;
}



/* media query css */

@media (max-width:992px) {
     .ceo_section .flex_box {
          flex-wrap: wrap;
     }

     .ceo_section .flex_box .item {
          flex: 1 1 48%;
          text-align: center;
          /* 2 items per row */
     }

     .ceo_section .flex_box .item .icon img {
          left: 50%;
     }

     .ceo_section .ceo_img img {
          width: 100%;
     }

     h1, h2, h3, h4, h5, h6 {
          text-align: center;
     }

     .card_team {
          flex-direction: column;
          justify-content: center;
          align-items: center;
     }

     .card_team_details {
          text-align: center;
     }

     .card_team_details .social {
          justify-content: center;
          align-items: center;
     }

     .scroll header {
          transition: 0.4s ease;
          position: fixed;
          width: 100%;
          top: 0;
          z-index: 5;

     }

     header {
          transition: 0.4s ease;

     }

     header nav .nav_links_menu .menu_small.d-none {
          display: flex !important;
          justify-content: space-between;
          align-items: center;
     }

     header nav .nav_links_menu .menu_small.d-none .logo img {
          width: 30px;
          filter: invert(1);
     }

     header nav .nav_links_menu ul {
          position: fixed;
          width: 280px;
          height: 100vh !important;
          left: 0;
          background: var(--section-bg);
          top: 0;
          z-index: 6;
          display: flex;
          flex-direction: column;
          gap: 10px;
          justify-content: flex-start;
          align-items: baseline;
          padding: 10px;
          transition: all 0.4s ease-in-out;
          transform: translateX(-100%);
     }

     .sidebar_active {
          overflow: hidden
     }

     .sidebar_active .nav_links_menu ul {
          transform: translateX(0);
     }

     .overlay {
          background-color: rgba(0, 0, 0, 0.5);
          filter: blur(10px);
          position: fixed;
          left: 0;
          top: 0;
          width: 100%;
          height: 100%;
          opacity: 0;
          visibility: hidden;
          transition: all 0.2s ease-in-out;
          transform: translateX(-100%);

     }

     .sidebar_active .overlay {
          opacity: 1;
          visibility: visible;
          transform: translateX(0);
     }

     header nav .nav_links_menu .menu_bar i {
          color: var(--bg-color);
          font-size: 25px
     }

     header nav .nav_links_menu .menu-buttons button {
          display: none !important
     }

     .top-section .top_banner .top-heading h1 {
          font-size: 50px;
     }

     .counter_bar .count_up {
          margin-bottom: 25px;
     }

     .overview .text h1 {
          text-align: center;
          text-transform: uppercase;
          font-size: 35px;
          margin-bottom: 45px;
     }

     .overview .title {
          margin: 10px 0px;
     }

     .overview .card_section {
          margin-bottom: 25px;
     }

     .ultimate .img img {
          width: 100%;
          border-radius: calc(var(--radius) + 8px);
          /* height: 500px; */
          object-fit: cover;
          position: relative;
          /* top: -60px; */
     }

     .ultimate .top_view .para {
          padding: 20px 20px;
     }

     .ultimate .top_view .top-li {
          display: grid;
          grid-template-columns: repeat(auto-fit, minmax(80%, 1fr));
          justify-content: center;
          align-items: center;
          place-items: center;
          gap: 15px;
          padding: 10px 40px;
     }

     .ultimate .top_view .ultimat_button {
          flex-direction: column;
          justify-content: center;
          gap: 10px;
          align-items: center;
     }

     .ultimate .top_view .ultimat_button a {
          width: 100%;
          gap: 10px;
     }

     .ultimate .top_view {
          padding-top: 0px;
     }

     .product_list .p_card .p_details {
          text-align: center;
     }

     .product_list .p_card .p_btn a {
          width: 100%;
     }

     .company_since .images .top img {
          width: 100%;
     }

     .company_since .images .bottom img {
          width: 300px;
          height: 400px;
          object-fit: cover;
          position: relative;
          left: 0;
          top: 0px;
          background-color: #fff;
          padding: 10px;
     }

     .company_since .text_details {
          text-align: center;
     }

     .company_since .title h1 {
          font-size: 50px;
          text-align: center;
     }

     .ceo_section .flex_item {
          flex-direction: column;
          text-align: center;
     }

     .newsletter .flex_box_new .imf img {
          display: none;

     }

     .newsletter .flex_box_new .input_group .input {
          flex: 0 0 100%;
          width: 100%;
     }

     .newsletter .flex_box_new .input_group {
          flex-direction: column;
          justify-content: center;
          align-items: anchor-center;
     }

     .newsletter {
          padding: 20px;
          margin-top: 20px;
     }

     .newsletter .flex_box_new .test-context .title {
          font-size: 30px;
     }

     header {
          background-color: var(--bg-color);
     }

     .menu-buttons {
          display: none !important;
     }

     header .menu_bar i {
          color: #fff !important;
     }

     .top-section .top-heading p {
          text-align: center;
     }

     .top-section .top-heading .mt-1 {
          display: flex;
          justify-content: center;
          margin-bottom: 25px;
     }

     header nav {
          padding: 12px 10px;
     }


     .ceo_image .ceo img {
          width: 100%;
          margin-bottom: 30px;
     }

     .social_icons .flex {
          display: flex;
          align-items: center;
          gap: 20px;
          flex-direction: column;
     }

     .helping_people .para_text p {
          padding-right: 0px;
          text-align: center;
     }

     .helping_people .para_text {
          text-align: center;
          display: flex;
          flex-direction: column;
     }

     .story_section .img img {
          margin-bottom: 30px;
     }

     .story_section .text_context {
          text-align: center;
     }

     /* .top_baner_ceo .img img {
          position: absolute;
          top: -30px;
          z-index: -1;
          width: 100%;
          height: 400px;
          opacity: 0.4;
          object-fit: cover;
     } */

     .top_baner_ceo .img img {
          margin-top: -30px;

     }

     .top_baner_ceo .text_content .title_main {
          position: absolute;
          top: 100px;
          width: 100%;
          padding: 20px;
     }

     .top_baner_ceo .text_content {
          padding-top: 0px;
          margin-bottom: 100px;
          text-align: center;
     }


     .top_baner_ceo .text_content .btnprimary {
          width: 100%;
     }

     .ceo_image .text_para {
          text-align: center;
     }


     footer .flex_item {
          flex-direction: column;

     }

     footer .flex_item .input input {
          margin: 0 15px;
          width: 100% !important;
          margin-bottom: 20px;
     }

     footer .menu_bottom {
          flex-direction: column;
          gap: 0px;
          justify-content: center;
          align-items: center;
     }

     .podcast_ceo_details {
          margin-top: 30px;
     }

     .podcast_ceo_details .imgs .imgs-baner span img {

          width: 100%;
     }

     .podcast_story .ep_card {
          margin: 10px 0px;
     }

     .list_podcast .audio_card {
          margin: 5px 0px;
     }

     .podcast_section {
          margin-top: 20px;
     }

     .podcast_section .title {
          margin-bottom: 15px;
     }

     .about_section .about_iamge_sec {
          flex-direction: column;
     }

     .about_section .about_iamge_sec {
          width: 100%;
     }

     .about_section .image_sec-block img {
          margin-bottom: 25px;
     }

     .about_section .counters_flex .item {
          flex: 0 0 49%;
          margin-bottom: 10px;

     }

     .about_section .counters_flex {
          flex-wrap: wrap;
     }

     .about_section .watch_info {

          justify-content: center;
     }

     .about_company .title_red {
          text-align: center;
     }

     .about_company {
          margin-top: 20px;
          position: relative;
     }

     .about_company .text_para {
          text-align: center;
     }

     .about_company .btnprimary {

          width: 100%;
     }

     .team_mentors .title_red {
          text-align: center;
     }

     .team_mentors .top_text_context p {
          text-align: center;
     }

     .about_section .text_para {
          text-align: center;
     }

     .top_banner {
          position: relative;
          margin-top: 20px;
          margin-bottom: 30px;
     }

     .about_section .top_span:first-child {
          text-align: center;
     }

     .top_banner .image img {
          width: 100%;
          height: 100%;
     }

     .top_banner .image .button_baner {
          font-size: 14px;
     }

     .top_banner .image .button_baner {
          width: 150px;
     }

     .contact_us .contact_form {
          flex-direction: column;
     }

     .contact_us .contact_form .box_left {
          width: 100%;
          border-radius: 12px 12px 0px 0px;
     }

     .contact_us .contact_form .box_right {
          width: 100%;
     }

     .contact_us .contact_form {
          border-radius: 0px 10px 10px 12px;
     }

     .contact_us .contact_form .fom-contact-us form .check_boxes {
          flex-wrap: wrap;
     }

     .contact_us .contact_form .fom-contact-us form .check_boxes .form-checks {
          flex: 0 0 50%;
     }

     .accelator_work_life .app_work_with {
          flex-direction: column;
          justify-content: center;
          align-items: center;
     }

     .accelator_work_life .app_work_with .icon {
          flex: auto;
     }

     .accelator_work_life .app_work_with .body_app {
          flex: auto;
          justify-content: center;
          text-align: center;
     }

     .your_work_life .image_grid {

          grid-template-columns: repeat(auto-fill, minmax(55%, 1fr));

     }

     .your_work_life .div_section_text {
          margin-bottom: 10px;
          height: auto;
     }

     .podcast_ceo_details .imgs .imgs-baner span {
          width: 100%;
     }

     .top_baner_block .context_block .bottom_01 .heading {
          font-size: 30px;
     }

     .top_baner_block .context_block .top_01 {
          flex-direction: column;
     }

     .top_baner_block .image img {
          width: 100%;
     }

     .handy_toolkit .image img {
          width: 100%;
     }

     .handy_toolkit .menu_list {
          margin-top: 25px;
     }

     .starter_kit .flex_items {
          flex-direction: column;
          gap: 20px;
     }

     .price_section {
          padding: 40px 15px;
     }

     .starter_kit {
              padding: 40px 15px;
     }

.starter_kit .flex_items .icon a{
     font-size: 20px;
             display: block;
        text-align: center;
}
.top_baner_block .context_block .bottom_01 .para{
     padding-right: 0px;
     margin-bottom: 20px;
}
}







/* Responsive Layout */
@media (max-width: 768px) {
     .timeline-container {
          flex-direction: column;
          /* Stack columns vertically */
          padding: 20px;
     }

     .timeline-left {
          flex: none;
          width: 100%;
          padding-right: 0;
          margin-bottom: 30px;
          position: relative;
          /* Remove sticky for mobile */
          top: auto;
          display: flex;
          flex-direction: column;
          /* Ensure elements inside stack */
          align-items: center;
          /* Center the circle */
          justify-content: center;
     }

     .timeline-circle {
          width: 150px;
          /* Smaller circle on mobile */
          height: 150px;
          border-width: 10px;
          position: static;
          /* Remove sticky positioning */
          margin-bottom: 20px;
          /* Space between circle and where line would be */
     }

     .timeline-title {
          font-size: 1.5em;
     }

     .timeline-line {
          left: 50%;
          /* Center the line on mobile */
          width: 4px;
          top: 150px;
          /* Start line below the circle */
          bottom: -20px;
          /* Extend line a bit below last item */
          transform: translateX(-50%);
     }

     .timeline-line::before,
     .timeline-line::after {
          width: 15px;
          height: 15px;
          top: -7.5px;
          /* Adjust start dot position */
          bottom: -7.5px;
          /* Adjust end dot position */
     }


     .timeline-right {
          flex: none;
          width: 100%;
          padding-left: 0;
     }

     .timeline-item {
          margin-left: 20px;
          /* Indent items slightly to the right of the line */
          margin-bottom: 30px;
     }

     .timeline-dot {
          left: -30px;
          /* Position dots relative to the main line on mobile */
          width: 15px;
          height: 15px;
     }

     .timeline-dot::before {
          width: 15px;
          /* Shorter connecting line */
          height: 2px;
     }

     .timeline-step {
          flex-direction: column;
          /* Stack elements inside step card */
          text-align: center;
          padding: 15px;
          min-height: auto;
     }

     .step-number {
          margin-right: 0;
          margin-bottom: 15px;
          padding: 8px 12px;
          font-size: 0.9em;
     }

     .step-content {
          margin-right: 0;
          margin-bottom: 15px;
     }

     .step-title {
          font-size: 1.1em;
     }

     .step-description {
          font-size: 0.85em;
     }

     .step-icon-wrapper {
          width: 50px;
          height: 50px;
     }

     .step-icon-wrapper i {
          font-size: 1.8em;
     }

     .apply_now {
          width: 100%;
     }

     .acc_block .text-center.title_for {
          margin-bottom: 10px;
          font-size: 30px;
     }

     .acc_block .context_block {
          padding-right: 0px;
          text-align: center;
          margin-top: 10px;
     }

     .acc_block .ceo_img img {
          width: 100%;
     }

     .mb_hide_Light4Career {
          display: none;
     }
}

@media (max-width: 480px) {
     .timeline-container {
          padding: 15px;
     }

     .timeline-circle {
          width: 120px;
          height: 120px;
          border-width: 8px;
     }

     .timeline-title {
          font-size: 1.3em;
     }

     .timeline-item {
          margin-bottom: 25px;
          margin-left: 15px;
     }

     .timeline-dot {
          left: -25px;
     }

     .timeline-step {
          padding: 10px;
          border-radius: 20px;
     }

}