@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css");



* {

    box-sizing: border-box;

    padding: 0;

    margin: 0;

    font-family: "Inter", sans-serif;

}



audio,

canvas,

embed,

iframe,

img,

object,

svg,

video {

    display: block;

    height: auto;

    max-width: 100%;

    width: 100%;

}



summary {

    display: list-item;

}



body,

html {

    height: 100%;

}



html {

    font-size: 100%;

    scroll-behavior: smooth;

}



body {

    line-height: 1.4;



    -webkit-overflow-scrolling: touch;



    -ms-overflow-style: scrollbar;



    background-color: #ffffff;

}



body::-webkit-scrollbar {

    width: 10px;

}



body::-webkit-scrollbar-track {

    background-color: #e7e7e7;

}



body::-webkit-scrollbar-thumb {

    background-color: #9f6300;

    ;



    border: 1px solid #9f6300;



    border-radius: 10px;

}



p {

    font-size: 15px;

    color: #1c1c1c;

    line-height: 1.55;

    margin-bottom: 1rem;

    font-weight: 500;

}



a,

a:hover,

a:focus,

button:hover,

button:focus,

input:focus {

    outline: none !important;

    text-decoration: none !important;

}



.h1,

.h2,

.h3,

.h4,

.h5,

.h6,

h1,

h2,

h3,

h4,

h5,

h6 {

    color: #000;

}

 a{color: #00459E;}

/*------Parallax Css----------*/

.parallax {

    background-attachment: fixed;

    background-repeat: no-repeat;

    background-size: cover;

    background-position-x: center;

}



.animation {

    animation-duration: 0.5s;

    animation-timing-function: linear;

    animation-delay: 0s;

    animation-iteration-count: 1;

    animation-direction: normal;

    animation-fill-mode: forwards;

    animation-play-state: running;

}



@keyframes slide-up {

    from {

        opacity: 0;

        top: 100px;

    }



    to {

        opacity: 1;

        top: 0;

    }

}



.animation_slide-up {

    animation-name: slide-up;

}



@keyframes slide-down {

    from {

        opacity: 0;

        bottom: 100px;

    }



    to {

        opacity: 1;

        bottom: 0;

    }

}



.animation_slide-down {

    animation-name: slide-down;

}



@keyframes slide-left {

    from {

        opacity: 0;

        left: 100px;

    }



    to {

        opacity: 1;

        left: 0;

    }

}



.animation_slide-left {

    animation-name: slide-left;

}



@keyframes slide-right {

    from {

        opacity: 0;

        right: 100px;

    }



    to {

        opacity: 1;

        right: 0;

    }

}



.animation_slide-right {

    animation-name: slide-right;

}



@keyframes flip-x {

    from {

        opacity: 0;

        transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -180deg);

    }



    to {

        opacity: 1;

        transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);

    }

}



.animation_flip-x {

    backface-visibility: visible;

    animation-name: flip-x;

}



@keyframes flip-y {

    from {

        opacity: 0;

        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);

    }



    to {

        opacity: 1;

        transform: perspective(400px);

    }

}



.animation_flip-y {

    backface-visibility: visible !important;

    animation-name: flip-y;

}



@keyframes zoom {

    from {

        opacity: 0;

        transform: scale3d(0.3, 0.3, 0.3);

    }



    to {

        opacity: 1;

    }

}



.animation_zoom {

    animation-name: zoom;

}



/*-----Custome Css Area----*/



.sec_padding {

    padding: 30px 0

}



/*------Main Header--------*/

/*.container{ max-width: 1340px;}*/

.main_header {

    position: relative;

    background-color: #fff;

}



.main_header.sticky {

    position: fixed;

    top: 0;

    left: 0;

    width: 100%;

    z-index: 9;

    /* -webkit-animation: smoothScroll 1s forwards;

animation: smoothScroll 1s forwards; */

    box-shadow: var(--bs-box-shadow) !important;

}



@-webkit-keyframes smoothScroll {

    0% {

        -webkit-transform: translateY(-40px);

        transform: translateY(-40px);

    }



    100% {

        -webkit-transform: translateY(0px);

        transform: translateY(0px);

    }

}



@keyframes smoothScroll {

    0% {

        -webkit-transform: translateY(-40px);

        transform: translateY(-40px);

    }



    100% {

        -webkit-transform: translateY(0px);

        transform: translateY(0px);

    }

}



.main_header .navbar-brand {



    margin-top: 0px;

    padding: 0px 10px 0;

    z-index: 0;

    -webkit-transition: all 500ms ease-in-out;

    -o-transition: all 500ms ease-in-out;

    transition: all 500ms ease-in-out;

    display: flex;

}



.main_header .navbar-brand .logo-2 {

    display: none

}



.main_header.sticky .navbar-brand {

    padding: 5px 10px 0;

    background-color: inherit;

    z-index: 0;

    -webkit-box-shadow: none;

    box-shadow: none;

    -webkit-transition: all 500ms ease-in-out;

    -o-transition: all 500ms ease-in-out;

    transition: all 500ms ease-in-out;

}



.main_header.sticky .navbar-brand .logo-1 {

    display: none

}



.main_header.sticky .navbar-brand .logo-2 {

    display: block

}



.main_header.sticky .navbar-brand::after {

    display: none;

}



.bg_blue {

    background: #00459E;

}



.topmain_section {

    display: flex;

    justify-content: space-between;

    align-items: center;

    padding: 4px 0px;

}



.top_left {

    display: flex;

    align-items: center;

}



.top_right {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 30px;

}



.sell_avamartmain {

    display: flex;

    gap: 5px;

    justify-content: space-between;

    align-items: center;

}



.sell_avamartmain img {

    width: auto;

}



.sell_avamartmain p {

    margin: 0px;

    color: #fff;

    font-size: 12px;

    font-weight: 700;

}



.sell_avamartmain p span {

    color: #FFCC4B;

}



.link_button {

    gap: 20px;

    display: flex;

}



.link_button a {

    color: #00459E;

    font-size: 12px;

    font-weight: 700;

    background: #fff;

    border-radius: 30px;

    padding: 8px 16px;

}



.google_tral {

    position: relative;

}

.header_mid_mainsection {

    border-bottom: solid 1px rgba(0, 0, 0, 0.1);
    background: #fff;

}



/* Default select styling */

.google_tral .form-select {

    width: 100%;

    padding: 12px 45px 12px 15px;

    font-size: 14px;

    font-weight: 600;

    border: none;

    border-radius: 0px;

    background-color: transparent;

    appearance: none;

    cursor: pointer;

    transition: all 0.2s ease;

    color: #fff;

    box-shadow: none;

}



.google_tral .form-select:focus {

    outline: none;

    border-color: #4285f4;

    box-shadow: none;

}



.google_tral .form-select option {

    color: #000;

}



/* Custom arrow styles */

.google_tral::after {

    content: "";

    position: absolute;

    top: 50%;

    right: 15px;

    transform: translateY(-50%);

    width: 0;

    height: 0;

    pointer-events: none;

}





/* Arrow Style 4 - Modern Arrow */

.arrow-4::after {

    width: 10px;

    height: 10px;

    border-right: 2px solid #fff;

    border-bottom: 2px solid #fff;

    transform: translateY(-70%) rotate(45deg);

}



/* header mid section start */

.header_mid_section {

    display: flex;

    justify-content: space-between;

    padding: 15px 0px;

}

.header_mid_lift a img{ max-width: 161px;}



.header_mid_right {

    display: flex;

    justify-content: space-around;

    align-items: center;

    gap: 16px;

}

/* BUTTONS */

.header_mid_right .btn-outline {

   border: 1px solid rgba(254, 240, 138, 1);

    background: rgba(255, 251, 235, 1);

    padding: 9px 16px;

    border-radius: 50px;

    color: rgba(134, 77, 15, 1);

    font-size: 12px;

    font-weight: 600;

}



.header_mid_right .btn-primary {

    background: rgba(0, 69, 158, 1);

    color: #fff;

    border: none;

    padding: 9px 16px;

    border-radius: 30px;

    font-size: 12px;

    font-weight: 600;

}



.header_mid_right .btn-icon {

    background: rgba(240, 240, 240, 1);

    padding: 6px 12px;

    border-radius: 32px;

    font-size: 12px;

    font-weight: 600;

    color: #000;

        display: flex;

    align-items: center;

    gap: 4px

}

.header_mid_right .btn-icon i{ font-size: 20px;}





/*---------Home Main ------*/

.site_main {background: rgba(244, 247, 250, 1);  
        margin-top: 149px;

}

.site_main_inner {

    bbackground: linear-gradient(180deg, #F4F7FA 0%, #EAF3FF 100%);

}



/* LAYOUT */

.main-grid {

    display: grid;

    grid-template-columns: 2.2fr 1fr;

    gap: 24px;

    padding-top: 20px;

}



.search_cardbg {

    background: rgba(255, 255, 255, 1);

    border: 1px solid rgba(0, 0, 0, 0.1);

    box-shadow: 20px 40px 100px 0px rgba(0, 0, 0, 0.08);

    border-radius: 16px;

    padding: 40px 32px 32px; margin-bottom: 32px;

}



/* SEARCH */

.badge_search {

    background-color: rgba(234, 243, 255, 1);

    padding: 2px 13px;

    border-radius: 2px;

    font-size: 14px;

    font-weight: 800;

    display: inline-block;

    margin-bottom: 16px;

        line-height: 28px;

}



.badge_search span {

    background: linear-gradient(90deg, #2563EA 0%, #0FA4E9 100%);

    -webkit-background-clip: text;

    background-clip: text;

    -webkit-text-fill-color: transparent;

    color: transparent;

}



.search-card h1 {

    font-size: 32px;

    font-weight: 600;

    color: rgba(36, 36, 36, 1);

    margin-bottom: 12px;

}



.search-card p {

    color: rgba(107, 114, 128, 1);

    margin-bottom: 20px; font-size: 16px; font-weight: 400;

}



.search-box {

    display: flex;

    gap: 12px;

     position: relative;

}



.search-box input {

    flex: 1;

    padding: 14px 36px !important;

    border-radius: 30px;

   border: 1px solid rgba(0, 0, 0, 0.1);

    background: rgba(243, 244, 246, 1);

    font-size: 14px;

    font-weight: 500;

    color: rgba(156, 163, 175, 1);



}



.search-box input:focus {

    outline: none;

    border-color: #2563EA;

    box-shadow: 0 0 0 2px rgba(37, 99, 234, 0.1);

}



.search-icon {

    position: absolute;

    left: 15px;

    top: 50%;

    transform: translateY(-50%);

    color: #6b7280; /* Gray color */

    pointer-events: none; /* Makes icon non-clickable */

    width: 2%;

}

.search-box button {

    padding: 9px 32px;

    border-radius: 50px;

    border: none;

   background: rgba(0, 69, 158, 1);

   border: 2px solid rgba(0, 69, 158, 0.2);

   box-shadow: 0px 8px 10px -6px rgba(0, 0, 0, 0.1);

    color: #fff;

}



.chips {

    margin: 18px 0;

}



.chip {

    display: inline-block;

    padding: 7px 12px;

    border-radius: 20px;

   border: 1px solid rgba(0, 0, 0, 0.1);

    margin-right: 8px;

    font-size: 12px;

    font-weight: 500;

    color: rgba(107, 114, 128, 1);

}



.chip.active {

    border: 1px solid rgba(0, 69, 158, 1);

    color: rgba(0, 69, 158, 1);

    background: rgba(234, 243, 255, 1);

    font-size: 12px;

    font-weight: 600;   

}



.meta {

    color: rgba(107, 114, 128, 1);

    font-size: 11px;

    font-weight: 600;

}

.meta span{ color: rgba(0, 69, 158, 1);}



/* VIDEO */

.section-head {

    display: flex;

    justify-content: space-between;

    margin-bottom: 16px;

    align-items: center;

}

.section-head  h2{ color: rgba(36, 36, 36, 1); font-size: 24px; font-weight: 700;}

.section-head  h2 span{ display: block; color: rgba(107, 114, 128, 1); font-size: 14px; font-weight: 400; margin-top: 8px;}

.section-head a{ color:rgba(0, 69, 158, 1); font-size: 14px; font-weight: 700;}



.video-grid {

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 16px;

}



.video-card {

    position: relative;

    border-radius: 14px;

    overflow: hidden;

}



.video-thumb {

    height: 160px;

    background: #e5e7eb;

}



.play {

       position: absolute;

    inset: 0;

    display: grid;

    place-items: center;

    font-size: 30px;

    color: rgba(0, 69, 158, 1);

    background: rgba(255, 255, 255, 1);

    width: 40px;

    height: 40px;

    border-radius: 30px;

    left: 0;

    right: 0;

    top: 0;

    bottom: 0;

    margin: auto;

    font-size: 14px;

}

.video_caps{background: rgba(0, 33, 76, 1); padding: 12px 8px;display: inline-block;width: 100%;height: 100%;}

.video_caps p{ color: rgba(255, 255, 255, 1); font-size: 13px; font-weight: 600; margin-bottom: 0;}

.video_caps p span{ color: rgba(209, 213, 219, 1);font-size: 11px; font-weight: 500; display: block;}



/* SIDEBAR */



.sidebar_cardbg {

    background: rgba(255, 255, 255, 1);

    border: 1px solid rgba(0, 0, 0, 0.1);

    box-shadow: 20px 40px 100px 0px rgba(0, 0, 0, 0.08);

    border-radius: 16px;

    padding: 24px; margin-bottom: 24px;

}



.points-card h2 {

    font-size: 36px;

    margin: 10px 0;

}



.level {

    font-size: 11px;

    background: rgba(254, 243, 199, 1);

    padding: 4px 10px;

    border-radius: 12px;

    color: rgba(146, 64, 14, 1);

    font-weight: 700;

}

.point_jana{ display: flex;align-items: center; justify-content: space-between; margin-top: 20px;}

.point_jana h2{ color: rgba(0, 69, 158, 1); font-size: 24px; font-weight: 800; margin: 0px;}

.point_jana p{ font-size: 12px; font-weight: 500; color: rgba(107, 114, 128, 1); margin: 0;}



.progress {

    background: #e5e7eb;

    height: 6px;

    border-radius: 10px;

    margin: 8px 0;

}



.progress span {

    display: block;

    width: 60%;

    height: 100%;

    background: #2563eb;

    border-radius: 10px;

}

.explor{ color: rgba(107, 114, 128, 1); font-size: 11px; font-weight: 500;}



.ask-card {

   background: linear-gradient(102.02deg, #00449B 0%, #002C60 98.32%);

  box-shadow: 20px 40px 100px 0px rgba(0, 0, 0, 0.08);

}

.ask-card h3{ color: #fff; font-size: 18px; font-weight: 600;}

.ask-card p{ color: rgba(209, 213, 219, 1); font-size: 12px; font-weight: 400; margin-bottom: 0px;}



.btn-yellow {

    margin-top: 14px;

    width: 100%;

    padding: 10px 16px;

    background: rgba(252, 192, 32, 1);

    border: none;

    border-radius: 30px;

    font-weight: 600;

    color: rgba(36, 36, 36, 1); font-size: 14px;

}



.project_expart { 

    font-size: 11px;

    border: 1px solid rgba(0, 0, 0, 0.1);

    padding: 4px 10px;

    border-radius: 12px;

    font-weight: 700;



    /* Gradient text color */

    background-image: linear-gradient(90deg, #2563EA 0%, #0FA4E9 100%);

    -webkit-background-clip: text;

    background-clip: text;

    -webkit-text-fill-color: transparent;

}



.guidemain_jana{  margin-top: 20px;}

.guidemain_jana h2{ color: rgba(36, 36, 36, 1); font-size: 20px; font-weight: 700; margin: 0px;}

.guidemain_jana p{ font-size: 12px; font-weight: 400; color: rgba(107, 114, 128, 1); margin: 12px 0 16px;}

.casestudy_video{ margin-bottom: 10px;}

.casestudy_video p{ color: rgba(0, 69, 158, 1); font-size: 12px; font-weight:600 ; margin: 0 0 8px;}

.casestudy_video i{ color: rgba(252, 147, 1, 1); margin-right: 5px;}



.btn-blue {

    margin-top: 0px;

    width: 100%;

    padding: 10px 16px;

    background: rgba(0, 69, 158, 1);

    border: none;

    border-radius: 30px;

    font-weight: 700;

    color: rgba(255, 255, 255, 1); font-size: 14px;

}



.btn-white {

    margin-top: 14px;

    width: 100%;

    padding: 10px 16px;

    background: rgb(255, 255, 255);

    border: 1px solid rgba(209, 213, 219, 1);

    border-radius: 30px;

    font-weight: 600;

    color: rgba(0, 69, 158, 1); font-size: 14px;

}

.btn-white i {font-weight: 600; color: rgba(0, 69, 158, 1); font-size: 14px;}



/*========live right start==========*/

/* 

.main-title{

    margin-top: 24px;

}



.main-title h2 {

    font-size: 32px;

    font-weight: 600; color: rgba(36, 36, 36, 1);

}



.main-title p {

    color: rgba(107, 114, 128, 1); font-size: 16px; font-weight: 400;

    margin-top: 0px;

}





.dashboard-grid {

    display: grid;

    grid-template-columns: 1.5fr 1fr;

    gap: 24px;

    align-items: start;

}



.activity_card {

    background: rgba(255, 255, 255, 1);

    border: 1px solid rgba(0, 0, 0, 0.1);

    border-radius: 16px;

    padding: 24px;

    box-shadow: 20px 40px 100px 0px rgba(0, 0, 0, 0.08);

}





.feed-header {

    display: flex;

    justify-content: space-between;

    align-items: center;

    margin-bottom: 24px;

}

.feed-header h2{ font-size: 20px;

    font-weight: 700; color: rgba(36, 36, 36, 1);}



.tab-bar ul{ display: flex; margin: 0; padding: 0; justify-content: center; align-items: center;border: none;}



.tab-bar li button { color: rgba(131, 131, 131, 1); font-size: 12px; font-weight: 600; border: none!important;}



.tab-bar li button.active {background-color: rgba(0, 69, 158, 1) !important;

    border-radius: 40px;

    padding: 8px 16px;

    color: #fff !important;

    font-size: 12px;

    font-weight: 600;

    border: none !important;}





.feed-item {

    display: flex;

    justify-content: space-between;

    align-items: end;

    padding: 12px;

    background: rgba(249, 250, 251, 1);

    border: 1px solid rgba(0, 0, 0, 0.05);

    border-radius: 8px;

    margin-bottom: 12px;

}



.feed-item h3 {

    font-size: 14px;

    font-weight: 700; color: rgba(36, 36, 36, 1);

    margin-bottom: 0px;

}



.subtext {

    font-size: 12px; font-weight: 400;

    color: rgba(107, 114, 128, 1); margin: 0;

}



.item-meta {

    display: flex;

    gap: 16px;

    font-size: 12px;

    color: rgba(107, 114, 128, 1); font-weight: 600;

    white-space: nowrap;

}





.tags {

    display: flex;

    gap: 8px;

    margin-bottom: 16px;

}



.tag {

    font-size: 12px;

    font-weight: 600;

    padding: 8px 8px;

    border-radius: 6px;

}



.tag-blue {

    background: rgba(243, 244, 246, 1); 

    padding: 6px 12px;

    border-radius: 6px;

    display: inline-block;

}



.tag-blue span {

    background-image: linear-gradient(90deg, #2563EA 0%, #0FA4E9 100%);

    -webkit-background-clip: text;

    background-clip: text;

    -webkit-text-fill-color: transparent;

    font-weight: 600;

}

.tag-light { background: #f3f4f6; color: #6b7280; }



.featured-title {

    font-size: 1.4rem;

    line-height: 1.2;

    margin-bottom: 12px;

}



.featured-desc {

    font-size: 0.9rem;

    color: var(--text-gray);

    margin-bottom: 24px;

}



.stats-list {

    margin-bottom: 32px;

}



.stat-item {

    font-size: 0.9rem;

    color: var(--primary-blue);

    margin-bottom: 8px;

}





.cta-group {

    display: flex;

    flex-direction: column;

    gap: 12px;

}



.btn-primary, .btn-secondary {

    padding: 12px;

    border-radius: 50px;

    font-weight: 600;

    cursor: pointer;

    text-align: center;

    font-size: 0.95rem;

}



.btn-primary {

    background: var(--primary-blue);

    color: white;

    border: none;

}



.btn-secondary {

    background: transparent;

    color: var(--primary-blue);

    border: 1px solid var(--border);

} */



.ava_ecosystem{ padding-bottom: 80px;}

.main_title {

  display: flex;

  justify-content: space-between;

  align-items: center;

  margin-bottom: 30px;

}

.main_title h2 {

    font-size: 32px;

    font-weight: 600; color: rgba(36, 36, 36, 1);

}



.main_title p {

    color: rgba(107, 114, 128, 1); font-size: 16px; font-weight: 400;

    margin: 0px;

}

.main_title a{ color: rgba(0, 69, 158, 1);font-size: 16px; font-weight: 600;}



/* Card Styling */

.card-grid {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 20px;

}



.category-card {

  background: rgba(255, 255, 255, 1);

  border: 1px solid rgba(0, 0, 0, 0.1);

  border-radius: 16px;

  padding: 32px 32px 24px ;

 box-shadow: 20px 40px 100px 0px rgba(0, 0, 0, 0.08);

  display: flex;

  flex-direction: column;

}



.card-header {

  display: flex;

  justify-content: space-between;

  align-items: center;

  margin-bottom: 20px;

}



.card-header h2 {

  color: rgba(0, 69, 158, 1);

  font-size: 24px; font-weight: 700;

}



/* Badges and Tags */

.badge {

  font-size: 0.7rem;

  font-weight: bold;

  padding: 4px 8px;

  border-radius: 4px;

}



.tag_blue {

    background: rgba(243, 244, 246, 1); 

    padding: 6px 12px;

    border-radius: 6px;

    display: inline-block;

}



.tag_blue span {

    background-image: linear-gradient(90deg, #2563EA 0%, #0FA4E9 100%);

    -webkit-background-clip: text;

    background-clip: text;

    -webkit-text-fill-color: transparent;

    font-weight: 600;

    text-transform: uppercase;

}

.blue-outline { border: 1px solid #cce5ff; color: #007bff; }



.tag-row {

  display: flex;

  gap: 8px;

  margin-bottom: 20px;

}



.tag {

  background: rgba(243, 244, 246, 1);

  border: 1px solid rgba(209, 213, 219, 1);

  padding: 6px 12px;

  border-radius: 50px;

  font-size: 12px;

  color:rgba(107, 114, 128, 1); font-weight: 600;

}



.tag-blue1 {

  background: rgba(234, 243, 255, 1);

  border: 1px solid rgba(198, 223, 255, 1);

  color: rgba(0, 69, 158, 1);

   padding: 6px 12px;

  border-radius: 50px;

  font-size: 12px; font-weight: 600;

}



/* Topic Items */

.topic-item {

  background: rgba(249, 250, 251, 1);

  border: 1px solid rgba(0, 0, 0, 0.05);

  border-radius: 8px;

  padding: 16px 12px;

  margin-bottom: 12px;

}



.topic-item h3 {

  font-size: 18px;

  font-weight: 600;

  color: rgba(36, 36, 36, 1);

  margin-bottom: 20px;

}



.meta {

  display: flex;

  align-items: end;

  gap: 12px;

}



.avatar {

  width: 32px;

  height: 32px;

  background: rgba(229, 231, 235, 1);

  color: rgba(0, 69, 158, 1);

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

  font-weight: 700;

  font-size: 14px;

}



.author-info p {

  color: rgba(0, 0, 0, 1);

  font-size: 14px; font-weight: 700; margin: 0;

}



.author-info span {

  font-size: 12px;

  color: rgba(107, 114, 128, 1);

  font-weight: 500;

}



.stats  {    

  margin-left: auto; 

  display: flex;

  gap: 10px;

}



.stats span {    

  font-size: 12px;

  color: rgba(107, 114, 128, 1); font-weight: 600;

}



.footer-link {

  align-self: flex-end;

  color: rgba(0, 69, 158, 1);

  font-weight: 600; font-size: 16px;

  text-decoration: none;

  margin-top: auto;

  padding-top: 10px;

}



/*========live right  End==========*/





/* Trending Expert start */



.trending_expert_section{background: rgba(255, 255, 255, 1); border-top: solid 1px rgba(0, 0, 0, 0.1); border-bottom: solid 1px rgba(0, 0, 0, 0.1); padding-top: 80px; padding-bottom: 80px;}



.trending_main_header {

    display: flex;

    justify-content: space-between;

    align-items: end;

    margin-bottom: 40px;

}



.title-area h2 {

    font-size: 32px;

    font-weight: 600;

    margin-bottom: 8px;

    color: rgba(36, 36, 36, 1);

}



.title-area p {

    color: rgba(107, 114, 128, 1);

    font-size: 16px;font-weight: 400; margin: 0;

}



.btn-joinfee {

    background-color: rgba(0, 69, 158, 1);

    color: white;

    border: none;

    padding: 11px 20px;

    border-radius: 30px;

    font-weight: 700;

    font-size: 14px;

    cursor: pointer;

}



.btn-browseall {

    background-color: transparent;

    color: rgba(0, 69, 158, 1);

    border: 1px solid rgba(209, 213, 219, 1);

    padding: 11px 20px;

    border-radius: 30px;

    font-weight: 600;

    font-size: 14px;

    margin-right: 12px;

    cursor: pointer;

}



/* Layout Grid */

.layout-grid {

    display: grid;

    grid-template-columns: 1fr 320px;

    gap: 30px;

}



/* Search and Filter Bar */

.search-filter-wrapper {

   

}



.search-input-containermain {

    padding: 10px 0px;

    display: flex;

    align-items: center;

    gap: 15px;

    margin-bottom: 0px;

     justify-content: space-between;

}



.search-input-container {

    /*display: flex;*/

    /*align-items: center;*/

  flex-grow: 1;

     background: rgba(249, 250, 251, 1);

    border: 1px solid rgba(0, 0, 0, 0.1);

    border-radius: 50px;

    padding: 10px 16px;

    display: flex;

    align-items: center;

    height: 48px;

}



.search-input-container input {

    border: none;

    outline: none;

    padding-left: 10px;

    font-size: 14px; color: rgba(156, 163, 175, 1);

    width: 100%;

        background: transparent;

}



.search-input-container i {

    font-size: 14px; color: rgba(156, 163, 175, 1);

}



.search-input-containermain button {

    padding: 9px 32px;

    border-radius: 50px;

    border: none;

    background: rgba(0, 69, 158, 1);

    border: 2px solid rgba(0, 69, 158, 0.2);

    box-shadow: 0px 8px 10px -6px rgba(0, 0, 0, 0.1);

    color: #fff;

}



.treading_expfil {

    padding: 10px 0px;

    display: flex;

    align-items: center;

    gap: 15px;

    margin-bottom: 25px;

        justify-content: space-between;

}



.filter-chips {

    display: flex;

    gap: 8px;

    /*border-left: 1px solid #eee;*/

    /*padding-left: 15px;*/

}

.filter-chips ul{border: none;  padding: 0;  margin: 0;display: flex;

    gap: 8px;}



.filter-chips li{}

.filter-chips li button{border-radius: 20px !important;

    border: 1px solid rgba(0, 0, 0, 0.1) !important;

    padding: 7px 12px;

    background: white;

    font-size: 12px;

    font-weight: 500;

    color: rgba(107, 114, 128, 1);

    cursor: pointer;}





.filter-chips li button.active {

   background: rgba(234, 243, 255, 1)!important;

  background: rgba(234, 243, 255, 1)!important;

    color: rgba(0, 69, 158, 1)!important;

    font-size: 12px;

    font-weight: 600;

}



.global-search-filter{border-left: none;

    padding-left: 0;

    margin-top: 15px;

    margin-bottom: 25px;}



.sort-dropdown select {

    border: 1px solid #ddd;

    padding: 8px 30px 8px 15px;

    border-radius: 32px;

    font-size: 12px;

    cursor: pointer;

    background-color: #fafafa;

    font-weight: 500;

}

.sort-dropdown .form-select option {

  font-size: 12px;

  font-weight: 500;

  color: rgba(107, 114, 128, 1);

}



/*.sort-dropdown .form-select option span{ font-size: 12px; font-weight: 400; color: rgba(107, 114, 128, 1);}*/



/* Cards */

.discussion-card {

    background: rgba(255, 255, 255, 1);

    border: 1px solid rgba(0, 0, 0, 0.1);

    border-radius: 16px;

    padding: 24px;

    margin-bottom: 20px;

}



.discussion_card_header {

    display: flex;

    justify-content: space-between;

    margin-bottom: 15px;

}



.discussion_category_label {

    font-size: 13px;

    font-weight: 700;

    background-color: rgba(243, 244, 246, 1); /* box background */

    padding: 4px 10px;

    border-radius: 4px;

    display: inline-block;

}



.discussion_category_label span {

    background: linear-gradient(90deg, #2563EA 0%, #0FA4E9 100%);

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

}



.badge_main {

    padding: 6px 12px;

    border-radius: 50px;

    font-size: 12px;

    font-weight: 600;

    margin-left: 5px;

}



.badge_main.expert { background: rgba(240, 253, 244, 1); color: rgba(22, 101, 52, 1); border: 1px solid rgba(74, 222, 128, 1); }

.badge_main.layout { border: 1px solid #28a745; color: #28a745; background: #f0fff4; }

.badge_main.pinned { border: 1px solid rgba(251, 191, 36, 1); color: rgba(146, 64, 14, 1); background: rgba(255, 251, 235, 1); }



.card_title_main {

    font-size: 20px;

    font-weight: 700; color: rgba(36, 36, 36, 1);

    margin-bottom: 12px;

    line-height: 1.3;

}



.card_description {

    color: rgba(107, 114, 128, 1);

     font-size: 14px;

    font-weight: 400;

    line-height: 1.5;

    margin-bottom: 18px;

}



.card_footers {

    display: flex;

    justify-content: space-between;

    align-items: center;

    border-top: 1px solid #f0f0f0;

    padding-top: 15px;

}



.user_info_dis { display: flex; align-items: center; }



.avatar_ar {

    width: 40px;

    height: 40px;

    background: #e9ecef;

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    font-weight: 700; font-size: 14px;

    color: rgba(0, 69, 158, 1);

    margin-right: 12px;

}



.meta_name { display: flex; flex-direction: column; }

.author-name { font-weight: 700; font-size: 14px; color: rgba(0, 0, 0, 1); }

.post-details { font-size: 12px; color: rgba(107, 114, 128, 1); font-weight: 500; }



.card_stats_dis {

    font-size: 12px;

    color: rgba(107, 114, 128, 1); font-weight: 600;

    display: flex;

    gap: 15px;

}



/* Sidebar Styling */

.info_box_discusionwork {

    background: rgba(243, 244, 246, 1);

    border: 1px solid rgba(0, 0, 0, 0.1);

    border-radius: 16px;

    padding: 24px 20px;

}



.info_box_discusionwork h3 { margin-bottom: 15px; font-size: 20px; color: rgba(36, 36, 36, 1); font-weight: 700; }

.info_box_discusionwork p { font-size: 12px; color: rgba(107, 114, 128, 1); line-height: 1.4; margin-bottom: 15px; font-weight: 400; }



.info_list_work {

    list-style: none;

    margin-bottom: 25px; padding: 0px;

}



.info_list_work li::before {

    content: "\f309";

    color: rgba(107, 114, 128, 1);

    padding-right: 8px;

    font-family: bootstrap-icons !important;

    font-style: normal;

    font-weight: 400 !important;

    font-variant: normal;

    text-transform: none;

    line-height: 1;

    vertical-align: -.125em;

    -webkit-font-smoothing: antialiased;

    font-size: 14px;

}



.info_list_work li {

    font-size: 12px;

    color: rgba(107, 114, 128, 1); font-weight: 400;

    margin-bottom: 8px;

}



.btn-primary-block {

    width: 100%;

    background-color: rgba(0, 69, 158, 1);

    color: white;

    border: none;

    padding: 10px 20px;

    border-radius: 30px;

    font-weight: 600;

    cursor: pointer;

    margin-bottom: 25px;

}



.right_sidebar_footer {

    display: flex;

    align-items: center;

    gap: 10px;

    border-top: 1px solid #ddd;

    padding-top: 15px;

}



.expert_badgew {

    background: rgba(240, 253, 244, 1);

    border: 1px solid rgba(74, 222, 128, 1);

    color: rgba(22, 101, 52, 1);

    padding: 4px 10px;

    border-radius: 50px;

    font-size: 12px;

    font-weight: 600;

    min-width: 90px;

}



.right_sidebar_footer p {

    font-size: 11px; font-weight: 400;

    margin-bottom: 0;

}



/* Trending Expert end */



/* AVA Expert Contributors Start */



.expert_section{ padding-top: 80px; padding-bottom: 80px;}



.expert_contributors_header_row{

    display: flex;

    justify-content: space-between;

    align-items: flex-end;

    margin-bottom: 30px;

}



.expert_contributors_header_text h2 {

    font-size: 32px;

    font-weight: 600; color: rgba(36, 36, 36, 1);

    margin-bottom: 8px;

}



.expert_contributors_header_text p {

    color: rgba(107, 114, 128, 1); font-size: 16px; font-weight: 400; margin: 0px;

}



.see_all {

    color: rgba(0, 69, 158, 1);

    text-decoration: none;

    font-weight: 600;

    font-size: 16px;

}



/* Grid Layout */

.expert_grid_contributors{

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 20px;

}



/* Card Styling */

.expert_card_contributors {

    background: rgba(255, 255, 255, 1);

    border: 1px solid rgba(0, 0, 0, 0.1);

    border-radius: 16px;

    padding: 30px 20px;

    text-align: center;

   box-shadow: 20px 40px 100px 0px rgba(0, 0, 0, 0.08);

}



.contributors_profile_img img {

    width: 80px;

    height: 80px;

    border-radius: 50%;

    object-fit: cover;

    margin-bottom: 15px; display: inline;

    border: 4px solid rgba(236, 236, 236, 1);

}



.name_contributors {

    font-size: 24px;

    color: rgba(36, 36, 36, 1); font-weight: 700;

    margin-bottom: 5px;

}



.role_contributors {

    font-size: 13px;

    color: rgba(75, 85, 99, 1); font-weight: 400;

    margin-bottom: 15px;

}



/* Badge & Description */

.badge_row_contributors {

    margin-bottom: 20px;

}



.badge_contributors {

    padding: 4px 12px;

    border-radius: 50px;

    font-size: 12px;

    font-weight: 600;

}



.blue_badge_contributors {

    background: rgba(234, 243, 255, 1);

    color: rgba(0, 69, 158, 1);

   border: 1px solid rgba(198, 223, 255, 1);

}



.description_contributors {

    font-size: 14px;

    color: rgba(75, 85, 99, 1); font-weight: 400;

    line-height: 1.5;

    margin-bottom: 20px;

    padding: 0 10px;

}



/* Tags */

.tags_contributors {

    display: flex;

    justify-content: center;

    gap: 8px;

    margin-bottom: 25px;

}



.tag_contributors {

    background: rgba(243, 244, 246, 1);

    padding: 4px 12px;

    border-radius: 8px;

    font-size: 12px;

    color: rgba(107, 114, 128, 1); font-weight: 600;

}



/* Buttons */

.card_actions {

    display: flex;

    flex-direction: column;

    gap: 10px;

}



.card_actions .btn {

    padding: 12px 16px;

    border-radius: 30px;

    font-weight: 600;

    font-size: 14px;

    cursor: pointer;

    transition: 0.2s;

}



.btn_book_cons {

    background-color: rgba(0, 69, 158, 1);

    color: white;

    border: none;

}



.btn_posts {

    background-color: transparent;

    color: rgba(0, 69, 158, 1);

    border: 1px solid rgba(209, 213, 219, 1)

}



.btn_posts:hover {

    opacity: 0.9;

}



/* AVA Expert Contributors End */



/* get a human answer on your next step start */



/* --- Ask AVA Section Styling --- */

.ask-ava-section {

   background: linear-gradient(0deg, #0A1E36, #0A1E36);

border: 1px solid rgba(0, 0, 0, 0.1);

box-shadow: 20px 40px 100px 0px rgba(0, 0, 0, 0.08);

    border-radius: 32px;

    padding: 48px 56px;   

    margin: 0 auto;

    margin-top: 96px;

}

.ask-container { display: flex; gap: 60px; align-items: center; }

.ask-text { flex: 1; }

.ask-text h2 { font-size: 32px; line-height: 1.2; margin-bottom: 24px; color: rgba(255, 255, 255, 1); font-weight: 700; }

.ask-text p { font-size: 16px; color: rgba(209, 213, 219, 1); line-height: 1.6; font-weight: 400; }



.ask-form { flex: 1.5; }

.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 32px; }

.full-width { grid-column: span 2; }



.input-group label { display: block; font-size: 12px; font-weight: 700; color: rgb(255 255 255); margin-bottom: 8px; }

.input-group input, .input-group select, .input-group textarea {

    width: 100%;

    background: rgba(255, 255, 255, 0.1);

    border: 1px solid rgba(255, 255, 255, 0.2);

    border-radius: 6px!important;

    padding: 10px 16px;

    color: rgb(255 255 255);

    font-size: 14px; font-weight: 500;

}



.input-group input, .input-group select {

    color: rgba(255, 255, 255, 1)!important;

    font-size: 14px; font-weight: 500;

}



.input-group input, .input-group select option {

    /*color: rgb(0 0 0) !important;*/

    /*color: white !important;*/

    font-size: 14px; font-weight: 500;

}



.input-group textarea { height: 120px; resize: none; }



.btn_submit_ques {

    width: 100%;

    background: rgba(252, 192, 32, 1);

    color: rgba(36, 36, 36, 1);

    border: none;

    padding: 16px;

    border-radius: 30px;

    font-weight: 600;

    font-size: 14px;

    cursor: pointer;

}



/* get a human answer on your next step end */



/* Points & Badges for serious learners start */

.reward_point_section{ padding-top: 80px; padding-bottom: 80px;background: rgba(255, 255, 255, 1); border-top: solid 1px rgba(0, 0, 0, 0.1); border-bottom: solid 1px rgba(0, 0, 0, 0.1); }

.reward_point_title h2 {

    font-size: 32px;

    margin-bottom: 8px;

    font-weight: 600; color: rgba(36, 36, 36, 1);

}



.reward_point_title p {

    color: rgba(107, 114, 128, 1);

    font-size: 16px; font-weight: 400;

    margin-bottom: 40px;

}



.rewards-layout {

    display: flex;

    gap: 30px;

}



/* Left Section */

.points_info_work {

    flex: 1;

    background: rgba(243, 244, 246, 1);

    border: 1px solid rgba(0, 0, 0, 0.1);

    padding: 32px;

    border-radius: 16px;

    height: fit-content;

}



.points_info_work h2 {

    margin-top: 0;

    font-size: 20px; font-weight: 700; color: rgba(36, 36, 36, 1);

}



.points_info_work ul {

    list-style: none;

    padding: 0;

    margin: 30px 0;

}



.points_info_work li {

    margin-bottom: 12px;

    position: relative;

    padding-left: 20px; color: rgba(107, 114, 128, 1); font-size: 14px; font-weight: 400;

}



.points_info_work li::before {

       content: "\F309";

    position: absolute;

    left: 0;

    font-weight: 700;

    font-family: bootstrap-icons !important;

    font-style: normal;

    font-variant: normal;

    color: #000;

}

.points_info_work li strong{font-weight: 700;color: rgb(44 44 45);}



.points_info_work li span {

    font-weight: 700;

    color: rgb(44 44 45);

}



.disclaimer {

    font-size: 11px;

    color: rgba(107, 114, 128, 1); font-weight: 400;

    margin-top: 24px;

}



/* Right Section - Grid */

.levels_grid {

    flex: 1.5;

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 20px;

}



.level_card {

   background: rgba(249, 250, 251, 1);

    border: 1px solid rgba(0, 0, 0, 0.1);

    padding: 24px;

    border-radius: 16px;

    transition: box-shadow 0.3s ease;

}



.level_card.active {

    background: rgba(242, 248, 255, 1);

    border-radius: 8px;

    border: 1px solid transparent;

    background-clip: padding-box;

    position: relative;

}



.level_card.active::before {

    content: "";

    position: absolute;

    inset: 0;

    border-radius: 8px;

    padding: 1px;

    background: linear-gradient(90deg, #2563EA 0%, #0FA4E9 100%);

    -webkit-mask: 

        linear-gradient(#fff 0 0) content-box, 

        linear-gradient(#fff 0 0);

    -webkit-mask-composite: xor;

    mask-composite: exclude;

}





.level-tag {

    background: linear-gradient(90deg, #2563EA 0%, #0FA4E9 100%);

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

    font-weight: 700;

    font-size: 14px;

    display: block;

    margin-bottom: 10px;

}



.level_card h3 {

    margin: 5px 0;

    font-size: 18px; font-weight: 700; color: rgba(36, 36, 36, 1);

}



.points-range {

    color: rgba(107, 114, 128, 1);

    font-weight: 600; font-size: 14px;

    margin-bottom: 20px;

}



.description {

    font-size: 12px; font-weight: 400;

    color: rgba(107, 114, 128, 1);

}



/* Level 5 Full Width Span */

.level-5 {

    grid-column: span 2;

}



.level-header {

    display: flex;

    justify-content: space-between;

    align-items: center;

}



/* Points & Badges for serious learners end */





/* inner page  */



.inner_bg{ background: radial-gradient(circle at 0 0, #e0f2fe 0, transparent 55%), radial-gradient(circle at 100% 0, #bbf7d0 0, transparent 45%), #ffffff;

        }



:root {

      --color-bg: #f5f5f7;

      --color-surface: #ffffff;

      --color-surface-soft: #f9fafb;

      --color-primary: #0f766e;

      --color-accent: #4f46e5;

      --color-text: #020617;

      --color-muted: #6b7280;

      --color-muted-soft: #9ca3af;

      --color-border: #e5e7eb;

      --radius-card: 22px;

      --radius-pill: 999px;

      --shadow-soft: 0 18px 40px rgba(15,23,42,0.12);

      --font-sans: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;

    }

   



    

    .article-sidebar {

      /* background:var(--color-surface);

      border-radius:26px; */

      padding:18px 18px 16px;

      /* border:1px solid rgba(209,213,219,0.8); */

      box-shadow:0 12px 30px rgba(148,163,184,0.25);

      position:sticky;

      top:18px;

      font-size:13px;

      color:var(--color-muted);

    }



    .breadcrumbs {

      font-size:11px;

      color:var(--color-muted-soft);

      margin-bottom:10px;

    }



    .article-title {

      font-size:28px;

      line-height:1.2;

      letter-spacing:-0.04em;

      margin-bottom:10px;

    }

    .article-subtitle {

      font-size:14px;

      color:var(--color-muted);

      margin-bottom:16px;

      max-width:640px;

    }



    .meta-pills {

      display:flex;

      flex-wrap:wrap;

      gap:8px;

      margin-bottom:10px;

    }

    .meta-pill {

      padding:6px 12px;

      border-radius:var(--radius-pill);

      background:var(--color-surface-soft);

      border:1px solid rgba(209,213,219,0.9);

      font-size:12px;

      display:flex;

      align-items:center;

      gap:6px;

      color:var(--color-muted);

    }

    .meta-pill.primary {

      background:#ecfdf5;

      border-color:rgba(34,197,94,0.7);

      color:#166534;

      font-weight:600;

    }



    .stats-block {

      margin-top:6px;

      padding:10px 12px 8px;

      border-radius:18px;

      background:var(--color-surface-soft);

      border:1px solid rgba(226,232,240,0.9);

      display:flex;

      flex-wrap:wrap;

      gap:10px;

      align-items:center;

      font-size:12px;

      color:var(--color-muted);

    }

    .stats-inline {

      display:flex;

      flex-wrap:wrap;

      gap:10px;

      align-items:center;

    }

    .stats-inline span {

      display:inline-flex;

      align-items:center;

      gap:4px;

    }

    .feedback-actions {

      display:flex;

      flex-wrap:wrap;

      gap:6px;

      margin-left:auto;

    }

    .feedback-btn {

      padding:5px 10px;

      border-radius:var(--radius-pill);

      border:1px solid var(--color-border);

      background:#ffffff;

      font-size:11px;

      display:inline-flex;

      align-items:center;

      gap:6px;

      cursor:pointer;

    }

    .feedback-btn.primary {

      border-color:rgba(22,163,74,0.7);

      background:#ecfdf5;

      color:#166534;

    }



    .hero-visual {

      margin-top:14px;

      border-radius:18px;

      border:1px dashed rgba(209,213,219,0.9);

      background:repeating-linear-gradient(

        135deg,

        #f9fafb,

        #f9fafb 10px,

        #f3f4f6 10px,

        #f3f4f6 20px

      );

      padding:20px 16px;

      font-size:12px;

      color:var(--color-muted);

      text-align:center;

    }



    .section-block {

      margin-top:18px;

      padding:14px 14px 14px;

      border-radius:18px;

      border:1px solid rgba(226,232,240,0.9);

      background:#f9fafb;

    }

    .section-block h3 {

      margin:0 0 8px;

      font-size:14px;

      letter-spacing:0.12em;

      text-transform:uppercase;

      color:#047857;

    }

    .section-block ul {

      margin:0;

      padding-left:20px;

      font-size:13px;

      color:var(--color-text);

    }



    .article-body {

      margin-top:18px;

      font-size:14px;

      line-height:1.7;

      color:var(--color-text);

    }

    .article-body h2 {

      margin:16px 0 6px;

      font-size:18px;

    }

    .article-body h3 {

      margin:10px 0 4px;

      font-size:15px;

    }

    .article-body ul {

      margin:4px 0 10px;

      padding-left:20px;

    }



    .ava-step-block {

      margin-top: 14px;

      padding: 12px 14px 14px;

      border-radius: 18px;

      border: 1px solid rgba(34,197,94,0.4);

      background: radial-gradient(circle at top left,#ecfdf5,#f9fafb 55%);

    }

    .ava-step-heading {

      margin: 0 0 6px;

      font-size: 13px;

      font-weight: 600;

      color: #166534;

    }

    .ava-step-block p {

      margin: 0 0 8px;

      font-size: 13px;

      color: var(--color-muted);

    }

    .ava-step-tags {

      display: flex;

      flex-wrap: wrap;

      gap: 6px;

    }

    .ava-step-pill {

      padding: 5px 10px;

      border-radius: var(--radius-pill);

      border: 1px dashed rgba(22,163,74,0.55);

      background: #ffffff;

      font-size: 11px;

      color: #166534;

      white-space: nowrap;

    }



    .author-footer {

      margin-top:26px;

      padding-top:16px;

      border-top:1px solid rgba(226,232,240,0.9);

      font-size:13px;

      color:var(--color-muted);

    }

    .author-header {

      display:flex;

      align-items:center;

      gap:10px;

      margin-bottom:10px;

    }

    .author-avatar {

      width:36px;

      height:36px;

      border-radius:999px;

      background:radial-gradient(circle at 20% 20%,#fed7aa,#fb923c);

      box-shadow:0 10px 22px rgba(248,171,89,0.6);

    }

    .author-meta {

      display:flex;

      flex-direction:column;

      gap:2px;

    }

    .author-meta strong {

      font-size:14px;

      color:var(--color-text);

    }

    .author-stats {

      font-size:11px;

      color:var(--color-muted-soft);

    }



    .powered-block {

      margin-top:12px;

      padding:10px 12px 12px;

      border-radius:18px;

      border:1px solid rgba(34,197,94,0.4);

      background:radial-gradient(circle at top left,#ecfdf5,#ffffff 55%);

    }

    .powered-block strong {

      color:#166534;

    }

    .powered-cta-row {

      margin-top:6px;

      display:flex;

      flex-wrap:wrap;

      gap:8px;

    }

    .powered-pill {

      padding:7px 12px;

      border-radius:var(--radius-pill);

      border:1px solid rgba(22,163,74,0.7);

      background:#ecfdf5;

      color:#166534;

      font-size:11px;

      font-weight:600;

      white-space:nowrap;

      cursor:pointer;

    }



    .journey-links {

      margin-top:14px;

      font-size:13px;

    }

    .journey-links a {

      display:block;

      margin-top:4px;

      color:var(--color-accent);

      font-weight:500;

    }



    

    .discussion-forum {

      margin-top: 24px;

      padding-top: 16px;

      border-top: 1px solid rgba(226,232,240,0.9);

    }

    .discussion-header {

      display: flex;

      justify-content: space-between;

      align-items: flex-start;

      gap: 12px;

      flex-wrap: wrap;

      margin-bottom: 10px;

    }

    .discussion-header-main h3 {

      font-size: 15px;

      margin: 0 0 4px;

    }

    .discussion-header-main p {

      margin: 0;

      font-size: 12px;

      color: var(--color-muted);

      max-width: 420px;

    }

    .discussion-header-controls {

      display: flex;

      flex-wrap: wrap;

      gap: 6px;

    }

    .discussion-pill {

      padding: 5px 10px;

      border-radius: var(--radius-pill);

      border: 1px solid rgba(209,213,219,0.9);

      background: #ffffff;

      font-size: 11px;

      color: var(--color-muted-soft);

      cursor: pointer;

      white-space: nowrap;

    }

    .discussion-pill.active {

      background: #020617;

      color: #e5e7eb;

      border-color: #020617;

    }



    .discussion-summary {

      border-radius: 18px;

      border: 1px solid rgba(209,213,219,0.95);

      background: #ffffff;

      padding: 10px 12px 10px;

      display: flex;

      justify-content: space-between;

      gap: 12px;

      align-items: flex-start;

      margin-bottom: 12px;

      box-shadow: 0 10px 26px rgba(15,23,42,0.06);

    }

    .discussion-summary-main {

      flex: 1 1 auto;

      min-width: 0;

    }

    .discussion-summary-tags {

      display: flex;

      flex-wrap: wrap;

      gap: 6px;

      margin-bottom: 4px;

      font-size: 11px;

    }

    .summary-pill {

      padding: 4px 9px;

      border-radius: var(--radius-pill);

      border: 1px solid rgba(209,213,219,0.9);

      background: var(--color-surface-soft);

      color: var(--color-muted);

      white-space: nowrap;

    }

    .summary-pill-primary {

      background: #ecfdf5;

      border-color: rgba(34,197,94,0.7);

      color: #166534;

      font-weight: 600;

    }

    .discussion-summary-title {

      margin: 0 0 4px;

      font-size: 15px;

      letter-spacing: -0.02em;

    }

    .discussion-summary-snippet {

      margin: 0 0 6px;

      font-size: 13px;

      color: var(--color-muted);

    }

    .discussion-summary-meta {

      font-size: 11px;

      color: var(--color-muted-soft);

      display: flex;

      flex-wrap: wrap;

      gap: 8px;

    }



    .discussion-summary-stats {

      flex: 0 0 auto;

      display: flex;

      flex-direction: column;

      gap: 6px;

      align-items: flex-end;

      font-size: 11px;

      color: var(--color-muted-soft);

      min-width: 120px;

    }

    .summary-stat {

      display: flex;

      align-items: center;

      gap: 6px;

      padding: 4px 8px;

      border-radius: 999px;

      background: var(--color-surface-soft);

      border: 1px solid rgba(226,232,240,0.9);

    }

    .summary-stat-icon {

      font-size: 13px;

    }

    .summary-stat strong {

      display: block;

      font-size: 13px;

      color: var(--color-text);

    }

    .summary-stat small {

      display: block;

      font-size: 10px;

      color: var(--color-muted-soft);

    }

    .discussion-summary-trend {

      font-size: 11px;

      color: #4f46e5;

    }



    .discussion-thread {

      margin-top: 6px;

      display: flex;

      flex-direction: column;

      gap: 8px;

      margin-bottom: 14px;

    }



    .forum-post {

      border-radius: 16px;

      border: 1px solid rgba(226,232,240,0.95);

      background: #ffffff;

      padding: 10px 12px;

      display: grid;

      grid-template-columns: minmax(0, 220px) minmax(0, 1fr);

      gap: 10px;

      font-size: 13px;

    }

    .forum-post-panel {

      border-left: 3px solid rgba(34,197,94,0.8);

    }

    .forum-post-owner {

      border-left: 3px solid rgba(59,130,246,0.6);

    }

    .forum-post-meta {

      border-right: 1px solid rgba(226,232,240,0.9);

      padding-right: 10px;

      display: flex;

      flex-direction: column;

      gap: 6px;

    }

    .forum-avatar {

      width: 32px;

      height: 32px;

      border-radius: 999px;

      background: radial-gradient(circle at 20% 20%,#bfdbfe,#4f46e5);

      display: inline-flex;

      align-items: center;

      justify-content: center;

      color: #eef2ff;

      font-size: 13px;

      font-weight: 600;

      box-shadow: 0 8px 18px rgba(79,70,229,0.5);

    }

    .forum-user {

      display: flex;

      flex-direction: column;

      gap: 2px;

    }

    .forum-user-name {

      font-weight: 600;

      font-size: 13px;

    }

    .forum-user-role,

    .forum-user-extra {

      font-size: 11px;

      color: var(--color-muted-soft);

    }

    .forum-badge {

      display: inline-flex;

      padding: 4px 8px;

      border-radius: 999px;

      font-size: 10px;

      text-transform: uppercase;

      letter-spacing: 0.14em;

      align-items: center;

      gap: 4px;

    }

    .forum-badge-panel {

      background: #ecfdf5;

      color: #166534;

      border: 1px solid rgba(34,197,94,0.7);

    }

    .forum-badge-owner {

      background: #eff6ff;

      color: #1d4ed8;

      border: 1px solid rgba(59,130,246,0.6);

    }



    .forum-post-body {

      display: flex;

      flex-direction: column;

      gap: 6px;

    }

    .forum-post-header {

      display: flex;

      justify-content: space-between;

      align-items: baseline;

      font-size: 11px;

      color: var(--color-muted-soft);

    }

    .forum-post-content p {

      margin: 0 0 6px;

      font-size: 13px;

      color: var(--color-text);

    }

    .forum-post-content p + p {

      margin-top: 4px;

    }

    .forum-post-footer {

      display: flex;

      justify-content: space-between;

      align-items: center;

      gap: 8px;

      flex-wrap: wrap;

      font-size: 11px;

      color: var(--color-muted-soft);

    }

    .forum-actions {

      display: flex;

      flex-wrap: wrap;

      gap: 6px;

    }

    .forum-action-btn {

      padding: 4px 9px;

      border-radius: 999px;

      border: 1px solid rgba(209,213,219,0.9);

      background: var(--color-surface-soft);

      font-size: 11px;

      color: var(--color-muted);

      cursor: pointer;

    }

    .forum-meta-note {

      font-size: 11px;

      color: #16a34a;

    }



    .discussion-form {

      margin-top: 4px;

      font-size: 12px;

    }

    .discussion-form-header {

      display: flex;

      justify-content: space-between;

      align-items: flex-start;

      gap: 10px;

      flex-wrap: wrap;

      margin-bottom: 4px;

    }

    .discussion-form-title {

      font-weight: 600;

      font-size: 13px;

    }

    .discussion-form-meta {

      font-size: 11px;

      color: var(--color-muted-soft);

      max-width: 360px;

    }



    .comment-textarea {

      width: 100%;

      min-height: 96px;

      border-radius: 14px;

      border: 1px solid var(--color-border);

      padding: 8px 10px;

      font-family: var(--font-sans);

      font-size: 13px;

      resize: vertical;

    }

    .comment-form-footer {

      margin-top: 6px;

      display: flex;

      justify-content: space-between;

      align-items: center;

      gap: 10px;

      flex-wrap: wrap;

    }

    .comment-hint {

      font-size: 11px;

      color: var(--color-muted-soft);

    }

    .comment-submit {

      padding: 6px 12px;

      border-radius: var(--radius-pill);

      border: 1px solid rgba(55,65,81,0.7);

      background: #111827;

      color: #e5e7eb;

      font-size: 12px;

      cursor: pointer;

    }

.sidebar-title {

      font-size:12px;

      text-transform:uppercase;

      letter-spacing:0.18em;

      color:var(--color-muted-soft);

      margin-bottom:10px;

    }

    .sidebar-list {

      font-size:13px;

      padding-left:18px;

      margin:4px 0 12px;

      color:var(--color-text);

    }

    .sidebar-note {

      font-size:12px;

      color:var(--color-muted);

      margin-top:8px;

    }

    .sidebar-note strong {

      color:var(--color-text);

    }



    .quiz-card {

      margin-top: 14px;

      padding: 12px 12px 14px;

      border-radius: 18px;

      border: 1px solid rgba(59,130,246,0.4);

      background: #eff6ff;

      box-shadow: 0 10px 24px rgba(148,163,184,0.25);

    }

    .quiz-card h3 {

      margin: 0 0 6px;

      font-size: 12px;

      letter-spacing: 0.18em;

      text-transform: uppercase;

      color: #1d4ed8;

    }

    .quiz-question {

      margin: 0 0 8px;

      font-size: 13px;

      color: var(--color-text);

    }

    .quiz-form {

      display: flex;

      flex-direction: column;

      gap: 6px;

      font-size: 13px;

      color: var(--color-text);

    }

    .quiz-option {

      display: flex;

      align-items: flex-start;

      gap: 8px;

    }

    .quiz-option input {

      margin-top: 4px;

    }

    .quiz-btn {

      margin-top: 6px;

      align-self: flex-start;

      padding: 6px 14px;

      border-radius: var(--radius-pill);

      border: 0;

      background: linear-gradient(to right,#22c55e,#16a34a);

      color: #ecfdf5;

      font-size: 12px;

      font-weight: 600;

      cursor: pointer;

      box-shadow: 0 10px 22px rgba(22,163,74,0.5);

    }

    .quiz-btn:hover { filter: brightness(1.05); }

    .quiz-feedback {

      margin-top: 4px;

      font-size: 11px;

      color: var(--color-muted);

    }

    .quiz-feedback.quiz-correct { color: #166534; }

    .quiz-feedback.quiz-incorrect { color: #b91c1c; }



    .sidebar-cta-pill {

      margin-top: 8px;

      padding: 7px 10px;

      border-radius: var(--radius-pill);

      border: 1px solid rgba(15,118,110,0.65);

      background: #ecfdf5;

      color: #115e59;

      font-size: 11px;

      font-weight: 600;

      cursor: pointer;

      width: 100%;

      text-align: center;

    }



    @media (max-width:900px){

      .article-layout {

        grid-template-columns:minmax(0,1fr);

      }

      .article-sidebar {

        position:static;

      }

    }

    @media (max-width:640px){

      .shell {

        padding:20px 14px 32px;

      }

      .article-main {

        padding:16px 14px 18px;

      }

      .article-title {

        font-size:22px;

      }

    }

  

/* AVA Jnana shared shell + header so this page matches the landing mockup */



:root {

  --bg-page: #f3f4f6;

  --bg-shell: #f9fafb;

  --bg-card: #ffffff;

  --bg-soft: #eef2ff;

  --bg-soft-green: #dcfce7;

  --bg-soft-blue: #e0f2fe;

  --border-soft: rgba(148, 163, 184, 0.45);

  --border-subtle: rgba(148, 163, 184, 0.3);

  --text-main: #0f172a;

  --text-soft: #64748b;

  --text-faint: #94a3b8;

  --accent-green: #16a34a;

  --accent-green-soft: #22c55e;

  --accent-blue: #2563eb;

  --accent-gold: #fbbf24;

  --radius-shell: 32px;

  --radius-card: 26px;

  --radius-pill: 999px;

  --shadow-soft: 0 26px 70px rgba(15, 23, 42, 0.16);

  --shadow-card: 0 18px 40px rgba(15, 23, 42, 0.10);

}



/* Override base page styling to align with home mockup */



/* Shell card with soft gradient */



.shell {

  max-width: 1240px;

  margin: 0 auto;

  background:

    radial-gradient(circle at 0 0, #e0f2fe 0, transparent 55%),

    radial-gradient(circle at 100% 0, #bbf7d0 0, transparent 45%),

    var(--bg-shell);

  border-radius: var(--radius-shell);

  border: 1px solid var(--border-subtle);

  box-shadow: var(--shadow-soft);

  padding: 24px 30px 32px;

}

.top-bar {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 18px;

  margin-bottom: 24px;

  flex-wrap: wrap;

}



.brand {

  display: flex;

  align-items: center;

  gap: 10px;

}



.brand-logo {

  width: 36px;

  height: 36px;

  border-radius: 50%;

  background: radial-gradient(circle at 30% 20%, #6ee7b7, #16a34a);

  display: flex;

  align-items: center;

  justify-content: center;

  font-weight: 800;

  color: #022c22;

  font-size: 18px;

  box-shadow: 0 16px 36px rgba(22, 163, 74, 0.45);

}



.brand-title {

  font-size: 17px;

  font-weight: 700;

  letter-spacing: 0.02em;

}



.brand-sub {

  font-size: 11px;

  text-transform: uppercase;

  letter-spacing: 0.16em;

  color: var(--text-soft);

}



nav.primary-nav {

  display: flex;

  gap: 18px;

  font-size: 13px;

  color: var(--text-soft);

  flex-wrap: wrap;

}



nav.primary-nav a {

  position: relative;

  text-decoration: none;

  color: inherit;

  padding-bottom: 4px;

}



nav.primary-nav a.active::after {

  content: "";

  position: absolute;

  left: 0;

  right: 0;

  bottom: -1px;

  height: 2px;

  border-radius: 999px;

  background: linear-gradient(90deg, var(--accent-green), var(--accent-blue));

}



.top-actions {

  display: flex;

  gap: 10px;

  flex-wrap: wrap;

}



.btn-pill {

  border-radius: var(--radius-pill);

  border: 1px solid rgba(148, 163, 184, 0.65);

  padding: 7px 14px;

  background: #ffffff;

  display: inline-flex;

  align-items: center;

  gap: 6px;

  font-size: 12px;

  cursor: pointer;

  color: var(--text-main);

}



.btn-pill.primary {

  border-color: transparent;

  background: linear-gradient(135deg, #22c55e, #16a34a);

  color: #022c22;

  font-weight: 600;

  box-shadow: 0 16px 34px rgba(22, 163, 74, 0.45);

}



.btn-pill.dark {

  background: #020617;

  color: #e5e7eb;

  border-color: #020617;

}



.dot-gold {

  width: 9px;

  height: 9px;

  border-radius: 999px;

  background: radial-gradient(circle at 30% 20%, #facc15, #ea580c);

}



/* Wrapper for article content inside shell */

.article-page {

  display: flex;

  flex-direction: column;

  gap: 18px;

}



/*-------footer Area-------*/

.footer_section{ display: inline-block; width: 100%;}

.footer_bg{ background: #F3F4F6; padding-bottom: 0px;}

.footer_mainsection{  padding: 40px 0%;}

.footer_logo{ margin-bottom: 15px;}

.footer_contact h4 {font-size: 12px; font-weight: 700; color: #4B5563;  margin-bottom: 10px;}

.footer_contact p {font-size: 14px; font-weight: 400; color: #4B5563;  margin-bottom: 10px;}

.footer_contact p a {font-size: 14px; font-weight: 600; color: #4B5563;  }

.footer_contact h5 {font-size: 14px; font-weight: 500; color: #4B5563;  margin-bottom: 10px; margin-top: 20px;}

.follow_us {display: flex; gap: 15px;}

.follow_us a{}

.follow_us a:hover img{ transform: scale(1.05) rotate(2deg);filter: brightness(1.1) contrast(1.1);   box-shadow: 0 5px 15px rgba(0,0,0,0.3);transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);}



.my_youtub{color: rgba(255, 0, 0, 1); font-size: 30px;}

.my_instagram { font-size: 30px;

    font-weight: bold;

    background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

    background-clip: text;

    color: transparent;

    display: inline-block;

}

.my_linkedin{color: rgba(10, 102, 194, 1); font-size: 30px;}

.my_facebook{color: rgba(24, 119, 242, 1); font-size: 30px;}



.footer_about h4 {font-size: 16px; font-weight: 700; color: #239F8E;  margin-bottom: 10px;}

.footer_about ul{ list-style: none; padding: 0;}

.footer_about li{}

.footer_about li a{ font-size: 14px; font-weight: 400; color: #4B5563; margin-bottom: 12px; display: block;transition: all 0.3s ease-in-out;}

.footer_about li a:hover{color: #239F8E; padding-left: 2px;}



.footer_quicklink h4 {font-size: 16px; font-weight: 700; color: #239F8E;  margin-bottom: 10px;}

.footer_quicklink ul{ list-style: none; padding: 0;}

.footer_quicklink li{}

.footer_quicklink li a{ font-size: 14px; font-weight: 600; color: #4B5563; margin-bottom: 12px; display: block;transition: all 0.3s ease-in-out;}

.footer_quicklink li a:hover{color: #239F8E;}

.boder_lefq { padding-left: 15px; border-left: solid 1px #d4d0d0;}

/*.partner li a{ color: #00379C; margin-bottom: 12px; display: block;transition: all 0.3s ease-in-out; border: solid 1px #00379C; border-radius: 20px; padding: 5px 10px;text-align: center;}*/


.partner li a {
    color: #00379C;
    margin-bottom: 12px;
    display: block;
    transition: all 0.3s ease-in-out;
    border: solid 1px #00379C;
    border-radius: 20px;
    padding: 5px 10px;
    text-align: center;
}


.footer_soluction h4 {font-size: 16px; font-weight: 700; color: #239F8E;  margin-bottom: 10px;}

.footer_soluction ul{ list-style: none; padding: 0;}

.footer_soluction li{}

.footer_soluction li a{ font-size: 14px; font-weight: 400; color: #4B5563; margin-bottom: 12px; display: block;transition: all 0.3s ease-in-out;}

.footer_soluction li a:hover{color: #239F8E;padding-left: 2px;}

.footer_soluction li a span{ display:block;}



.footer_community h4 {font-size: 16px; font-weight: 700; color: #239F8E;  margin-bottom: 10px;}

.footer_community ul{ list-style: none; padding: 0;}

.footer_community li{}

.footer_community li a{ font-size: 14px; font-weight: 400; color: #4B5563; margin-bottom: 12px; display: block;transition: all 0.3s ease-in-out;}

.footer_community li a:hover{color: #239F8E;}

.footer_community li a span{font-size: 11px; font-weight: 500; background: #E2FFFB; color: #239F8E; border: solid 1px #239F8E;  border-radius: 15px;  padding: 1px 8px;

    display: inline-flex; align-items: center;justify-content: center;}

.lang_but{ text-align: center;margin-bottom: 45px;}

.lang_but img{ width: auto; display: inline-block;}



.copy_main{ background: #0B1E48; padding: 16px 0; }

.copy_mainse{ display: flex; justify-content: space-between;}

.copy_left{display: flex; gap: 20px;}

.copy_left p{ font-size: 12px; font-weight: 700; color: #fff;  margin-bottom:0px;}

.copy_right{ gap: 15px; display: flex;}

.copy_right a{font-size: 12px; font-weight: 400; color: #fff; }

.copy_right a:hover{color: #239F8E;}



/*-------Testimonial Sec------*/





/*========Scroll Top======*/



.scrollToTop {

    width: 34px;

    height: 34px;

    border-radius: 25px;

    text-align: center;

    font-weight: bold;

    background: #fff;

    text-decoration: none;

    position: fixed;

    bottom: 20px;

    right: 0;

    z-index: 33;

    /*display: none;*/

}



/* topics post page start */

.topics_post_grid {

    display: grid;

    grid-template-columns: 1fr;

    gap: 20px;

}

.post_list{ display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 20px;}

    

    

    option {

    color: black;

}

.content {
    padding: 0 !important;
}


.header_mid_right {
    display: flex;
    justify-content: space-around;
    gap: 10px !important;
}