:root {
     --main-color: #2ea9e0;
    --primary:#2ea9e0; 
    --black: #000;
    --white: #fff;
    --green: #19803f;
    --light-green:#14bd5b ;
    --dark-gray-bg:#121314;
    --dark-gray: #1F1C24;
    --yellow: #ffe000;
    --gradient1: linear-gradient(120deg, #5f26fe 0%, #5f26fe 60%, #44008d 100%);
    --gradient: linear-gradient(120deg, #44008d, #2ea9e0);
    
    --plate:#E4E8EC; --card:#FFFFFF; --rail:#1B232D; --rail-2:#26303C;
    --ink:#12171D; --ink-2:#5A646F; --ink-3:#8C959F;
    --hair:#C9D0D7; --wash:#F3F6F8; --brass:#A9793B;
    --shadow:0 1px 2px rgba(18,23,29,.06), 0 8px 24px rgba(18,23,29,.06);
    --step:1.6rem;
}
* {
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: Poppins, sans-serif;
}

li,
ol,
ul {
    list-style: none;
    margin: 0px;
    padding: 0px;
}
h2{
    font-size:28px;
}
p{margin: 0;}
.container{
padding:0 20px;
}
.main-title{
    margin-bottom: 24px;
}
@media (min-width: 1200px) {
    .container {
        max-width: 1270px;
        margin: 0 auto;
        padding: 0;
    }
}
@media (min-width: 768px) {
    .h2, h2 {
       font-size: 40px;
    }
}

a {
    text-decoration: none;
    transition: all 0.5s ease 0s;
}

a:hover {
    color: var(--main-color);
}

body {
     font-family: Poppins, sans-serif;
     font-size: 16px;
     line-height: 1.4;
     background: #fff;
}
.dark-gray-bg {
    background: var(--dark-gray-bg);
}

.section-space{
    padding: 32px 0;
}
@media (min-width: 1200px) {
.section-space{
    padding: 40px 0;
}
}
.primary-color{
    color: var(--primary);
}


/*** Chart  JS ***/

.form-control:focus,
.select2-container--bootstrap-5 .select2-dropdown .select2-search .select2-search__field:focus {
    border-color: inherit;
    box-shadow: none;
}
.select2-container--bootstrap-5.select2-container--open .select2-selection {
    box-shadow: none;
}
.yellow {
    background: #ffe000;
}

.light-gray {
    background: #F7FAFC;
}

.dark-gray-bg {
    background: #121314;
}

.white {
    color: var(--white) !important;
}

.text-center {
    text-align: center;
}
.p-18 {
    font-size: 18px;
    line-height: 28px;
}
/* Comparison Chart CSS Start Here */
#comparison-chart .title {
    font: normal normal normal 48px/24px Poppins;
    letter-spacing: 0px;
    color: #9A9A9A;
    opacity: 1;
}
#comparison-chart .btn {
    font: normal normal medium 14px/21px Poppins;
    letter-spacing: 0px;
    color: #FFFFFF;
    opacity: 1;
    margin-top: 1em;
    border: 1px solid #FFFFFF;
    border-radius: 4px 0px 0px 4px;
}
.bank-group-select {
    font-size: 12px;
    opacity: 0.8;
}
/** remove border radius from all btn in btn-group  except first and last btn */
#comparison-chart .menu>.btn:not(:first-child):not(:last-child):not(.dropdown-toggle) {
    border-radius: 0 !important;
}
/** remove right border-radius from first btn in btn-group */
#comparison-chart .menu>.btn:first-child:not(:last-child):not(.dropdown-toggle) {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}
/** remove left border-radius from last btn in btn-group */
#comparison-chart .menu>.btn:last-child:not(:first-child),
#comparison-chart .menu>.btn.dropdown-toggle:not(:first-child) {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}
#comparison-chart .menu>.btn:last-child {
    border-radius: 0 4px 4px 0;
}
#comparison-chart .btn-primary {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid #FFFFFF;
    color: black;
}
/** hover fix */
#comparison-chart .btn:hover {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid #FFFFFF;
    color: black;
}
#comparison-chart .select2-container--bootstrap-5 .select2-selection {
    border: 0;
    background-color: #27292B !important;
    color: #EFC342;
}
#comparison-chart .select2-container--bootstrap-5 {
    max-width: 100%;
}
#comparison-chart .select2-container--bootstrap-5 .select2-selection--single .select2-selection__rendered {
    color: #6a6a6a
}
#comparison-chart span.select2-selection.select2-selection--single {
    height: auto;
}
#comparison-chart .bank-name-select-selection {
    letter-spacing: 0px;
    color: #FFFFFF;
    font-size: 12px;
}
#comparison-chart .bank-group-select-selection,
#comparison-chart .bank-group-select {
    letter-spacing: 0px;
    color: #9A9A9A;
    font-size: 13px;
}
#comparison-chart .yellow-box {
    width: 12px;
    height: 12px;
    /* UI Properties */
    background: #F0B32F 0% 0% no-repeat padding-box;
}
#comparison-chart .blue-box {
    width: 12px;
    height: 12px;
    /* UI Properties */
    background: #2D9CDB 0% 0% no-repeat padding-box;
}
#comparison-chart #myChart {
    height: 500px;
}
#comparison-chart .select-help-text {
    font: normal normal normal 12px Poppins;
    letter-spacing: 0px;
    color: #A3A3A3;
    margin-top: 10px;
}
/* Comparison Chart CSS End Here */
/* Report Card Chart CSS Start Here */
.report-chart .title {
    font: normal normal normal 48px/24px Poppins;
    letter-spacing: 0px;
    color: #A3A3A3;
    opacity: 1;
}
.report-chart .btn {
    font: normal normal medium 14px/21px Poppins;
    letter-spacing: 0px;
    color: #FFFFFF;
    opacity: 1;
    margin-top: 1em;
    border: 1px solid #FFFFFF;
    border-radius: 4px 0px 0px 4px;
}
/** remove border radius from all btn in btn-group  except first and last btn */
.report-chart .menu>.btn:not(:first-child):not(:last-child):not(.dropdown-toggle) {
    border-radius: 0 !important;
}
/** remove right border-radius from first btn in btn-group */
.report-chart .menu>.btn:first-child:not(:last-child):not(.dropdown-toggle) {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}
/** remove left border-radius from last btn in btn-group */
.report-chart .menu>.btn:last-child:not(:first-child),
.report-chart .menu>.btn.dropdown-toggle:not(:first-child) {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}
.report-chart .btn-primary {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid #FFFFFF;
    color: black;
}
.report-chart .select2-container--bootstrap-5 {
    max-width: 100%;
}
.report-chart svg,.rankings-chart svg {
    width: 100%;
}
/** hover fix */
.report-chart .btn:hover {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid #FFFFFF;
    color: black;
}


.report-chart .bank-rating-text {
    color: #9A9A9A;
}
.report-chart .bank-rating {
    font: normal 600 24px/35px Poppins;
    letter-spacing: 0px;
    color: #FFFFFF;
    min-width: 70px;
}
.report-chart .bank-rating-label {
    font: normal 13px Poppins;
    font-weight: 600;
    text-transform: uppercase;
    color: #FFFFFF;
}
.report-chart .section-heading {
    text-align: left;
    font: normal 20px/24px Poppins;
    letter-spacing: 0px;
    color: #9A9A9A;
    opacity: 1;
}
.report-chart .categorical-ranking-title {
    font: normal 16px/25px Poppins;
    letter-spacing: 0px;
    color: #9A9A9A;
    font-weight: 500;
}
.report-chart .categorical-ranking-rank {
    font: normal normal 600 20px/30px Poppins;
    letter-spacing: 0px;
    color: #EFC342;
}
#nbfc-report-chart.report-chart .categorical-ranking-rank, #hfc-report-chart.report-chart .categorical-ranking-rank {
    display: none;
}
.report-chart .categorical-ranking-value-with {
    font: normal 15px/25px Poppins;
    letter-spacing: 0px;
    color: #9A9A9A;
    text-transform: lowercase;
}
.report-chart .categorical-ranking-value {
    font: bold 24px/32px Poppins;
    letter-spacing: 0px;
    color: #FFFFFF;
    padding-left: 4px;
}
.report-chart .categorical-ranking-item {
    background: #121314 0% 0% no-repeat padding-box;
    border: 1px solid rgb(68, 82, 96);
    border-radius: 4px;
    padding: 1em;
}
.report-chart .financial-row .card {
    border-radius: 26px;
    background: #27253A;
    /* box-shadow: 0 8px 15px rgba(0, 0, 0, 0.85); */
    transition:.3s;
}
.report-chart .financial-row .card:hover{
    transform: translateY(-5px);
    border-color: rgba(49, 166, 224, .48) !important;
    background: #1a1a20;
}
.report-chart .financial-row .card-header {
    border-bottom: 1px solid rgb(68, 82, 96);
    font: 600  18px/24px Poppins;
    color: #fff;
    text-align: center;
    padding: 0 0 8px 0;
}
.report-chart .financial-row .card-body {
    padding: 16px;
}
@media(min-width:992px){
    .report-chart .financial-row .card-body {
    padding: 36px;
}
    .report-chart .financial-row .card-header {
    font: 600  24px/30px Poppins;
}
    .report-chart .financial-row .card-body{
        padding: 20px 24px;
    }
   
}
.text-light{color: #000!important;}
.report-chart .section-heading-line {
    font: normal 14px Poppins;
    color: #f2f2f2;
}
.report-chart .section-heading-value {
    font-family: 'Poppins';
    font-size: 16px;
    color: #fff;
    margin-top: 4px;
    font-weight: 600;
    margin-left: 16px;
}
.data-row{
    border-bottom: 1px solid #EBEBEF;
    padding: 14px 0;
}
.data-row:last-child{border: none;}
.text-danger{color:#ff390b!important}
@media(min-width:768px){
  .report-chart .section-heading-line{
    font: normal 14px Poppins;
  } 

}
.report-chart .section-heading-value-large {
    font-size: 24px;
    color: #EFC342;
    font-family: 'Poppins';
}
hr {
    border-color: #666;
}
.report-chart .select2-container--bootstrap-5 .select2-selection {
    border: 1px solid #4B4A60;
    background-color: #27253A !important;
    color: #fff;
    border-radius: 16px;
}
.select2-container--bootstrap-5 .select2-selection--single .select2-selection__rendered .select2-selection__placeholder{
    color: #f2f2f2;
}
.report-chart .select2-container--bootstrap-5 .select2-selection--single .select2-selection__rendered {
    color: #fff;
    padding-top: 8px;
}
.select2-container .select2-selection--single{height: 54px;}
.report-chart #categorical-ranking-value-element {
    text-align: end;
}
.report-chart #bank-logo-report-card,
.report-chart #nbfc-bank-logo-report-card,.report-chart #hfc-bank-logo-report-card {
    width: 58px;
    height: 58px;
    border-radius: 100%;
}
/* Report Card Chart CSS End Here */

/* Ranking Chart CSS Start Here */
.rankings-chart .title {
    font: normal 48px/24px Poppins;
    letter-spacing: 0px;
    color: #9A9A9A;
    opacity: 1;
}
.rankings-chart .section {
    background-image: url('https://akm-img-a-in.tosshub.com/businesstoday/resource/bt-best-banks-summit-2024/assets/bg-rays.svg');
    background-size: cover;
    background-position-y: center;
    background-repeat: no-repeat;
}
@media screen and (max-width: 768px) {
    .rankings-chart .section {
        background-size: contain;
    }
}
.rankings-chart .btn {
    font: medium 14px/21px Poppins;
    letter-spacing: 0px;
    color: #FFFFFF;
    opacity: 1;
    margin-top: 1em;
    border: 1px solid #FFFFFF;
    border-radius: 4px 0px 0px 4px;
}
/** remove border radius from all btn in btn-group  except first and last btn */
.rankings-chart .menu>.btn:not(:first-child):not(:last-child):not(.dropdown-toggle) {
    border-radius: 0 !important;
}
/** remove right border-radius from first btn in btn-group */
.rankings-chart .menu>.btn:first-child:not(:last-child):not(.dropdown-toggle) {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}
/** remove left border-radius from last btn in btn-group */
.rankings-chart .menu>.btn:last-child:not(:first-child),
.rankings-chart .menu>.btn.dropdown-toggle:not(:first-child) {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}
.rankings-chart .btn-primary {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid #FFFFFF;
    color: black;
}
.rankings-chart .select2-container--bootstrap-5 {
    max-width: 100%;
}
/** hover fix */
.rankings-chart .btn:hover {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid #FFFFFF;
    color: black;
}
.rankings-chart .select2-container--bootstrap-5 .select2-selection {
    border: 0;
    background-color: #27292B !important;
    color: #EFC342;
    border: 1px solid #9A9A9A;
}
.rankings-chart .select2-container--bootstrap-5 .select2-selection--single .select2-selection__rendered {
    color: white
}
.rankings-chart .bank-name-rankings {
    font: bold 20px Poppins;
    letter-spacing: 0px;
    color: #FFFFFF;
    text-align: center;
}
.rankings-chart #bank-first-place .bank-name-rankings,
.rankings-chart #nbfc-bank-first-place .bank-name-rankings {
    font: bold 32px Poppins;
    letter-spacing: 0px;
    color: #FFFFFF;
}
.rankings-chart .bank-withscore-rankings {
    font: normal 14px Poppins;
    letter-spacing: 0px;
    color: #A3A3A3;
    text-align: center;
}
.rankings-chart #bank-first-place .bank-withscore-rankings,
.rankings-chart #nbfc-bank-first-place .bank-withscore-rankings,.rankings-chart #hfc-bank-first-place .bank-withscore-rankings {
    font: normal 20px Poppins;
    letter-spacing: 0px;
    color: #A3A3A3;
}
.rankings-chart .bank-score-rankings {
    text-align: center;
    font: bold 20px Poppins;
    letter-spacing: 0px;
    color: #fff;
}
.rankings-chart #bank-first-place .bank-score-rankings,
.rankings-chart #nbfc-bank-first-place .bank-score-rankings,.rankings-chart #hfc-bank-first-place .bank-score-rankings {
    font: bold 32px Poppins;
    letter-spacing: 0px;
}
.rankings-chart #bank-logo-ranking,
.rankings-chart #nbfc-bank-logo-ranking,.rankings-chart #hfc-bank-logo-ranking {
    border-radius: 100%;
    width: 80px;
    height: 80px;
    border: 2px white solid;
}
.tabs-wrap .nav-tabs {
    border-bottom: none;
}
.tabs-wrap .nav-tabs .nav-link {
    color: #fff;
    text-transform: uppercase;
    font-size: 20px;
    font-weight: 600;
    padding: 10px 25px;
    border: 1px solid #484848;
    margin-right: 10px;
    border-radius: 5px;
    margin-bottom: 6px;
    min-width: 220px;
}
.tabs-wrap .nav-tabs .nav-link.active {
    background: #ffe000;
    color: #000;
    border-bottom: none;
}
#nbfc-balance-sheet-chart, #balance-sheet-chart,#hfc-balance-sheet-chart{
    min-height: 250px;
  }

  .tabs-wrap .tab-content>.tab-pane {
    display: block!important;
    opacity: 0!important;
    pointer-events: none!important;
    height: 0px!important;
    overflow: hidden;
  }
  
  .tabs-wrap .tab-content>.active{
    display: block!important;
    opacity: 1!important;
    pointer-events: all!important;
    height: auto!important;
  }
/* Ranking Chart CSS End Here */



@media screen and (max-width: 768px) {
    /* Comparison */
    #comparison-chart .title {
        text-align: center;
        line-height: 1 !important;
        font: normal normal normal 38px Poppins;
        letter-spacing: 0px;
        color: #fff;
        padding: 0.5em 1em;
    }

    #comparison-chart #myChart {
        height: 300px;
    }
    /* Report Card */
    .report-chart .title {
        text-align: center;
        line-height: 1 !important;
        font: normal normal normal 38px Poppins;
        letter-spacing: 0px;
        color: #6E6E6E;
        padding: 0.5em 1em;
    }

    .report-chart .bank-rating-column {
        margin-top: 1em;
    }

    .report-chart #balance-sheet-chart {
        min-height: 300px;
    }

    .report-chart .categorical-ranking-title {
        font: normal 14px Poppins;
        letter-spacing: 0px;
        color: #9A9A9A;
        font-weight: 500;
    }

    .report-chart #categorical-ranking-value-element {
        text-align: start;
    }

    .report-chart .categorical-ranking-rank {
        font:normal 600 18px Poppins;
    }

    .report-chart .categorical-ranking-value-with {
        font:normal 14px Poppins;
    }

    .report-chart .categorical-ranking-value {
        font:bold 16px Poppins;
    }

    .report-chart .categorical-ranking-item {
        padding: 0.5em;
    }

    /* Ranking */
    .rankings-chart .title {
        text-align: center;
        line-height: 1 !important;
        font: normal normal normal 38px Poppins;
        letter-spacing: 0px;
        color: #fff;
        padding: 0.5em 1em;
    }

    .rankings-chart .bank-name-rankings {
        font:bold 16px Poppins;
    }
    .rankings-chart #bank-first-place .bank-name-rankings,
    .rankings-chart #nbfc-bank-first-place .bank-name-rankings {
        font:bold 20px Poppins;
    }
    .rankings-chart .bank-withscore-rankings {
        font:normal 14px Poppins;
    }
    .rankings-chart #bank-first-place .bank-withscore-rankings,
    .rankings-chart #nbfc-bank-first-place .bank-withscore-rankings {
        font:normal 14px Poppins;
    }
    .rankings-chart .bank-score-rankings {
        font:bold 20px Poppins;
    }
    .rankings-chart #bank-first-place .bank-score-rankings,
    .rankings-chart #nbfc-bank-first-place .bank-score-rankings {
        font: bold 20px Poppins;
    }

}
.logo-col img{width: 100%;height: auto;}
@media screen and (max-width: 767px) {
    #comparison-chart .bank-name-select-selection{font-size: 16px;}

}
@media screen and (max-width: 767px) {
    #comparison-chart .bank-name-select-selection{font-size: 11px;}
    .report-chart .title {
        text-align: left;
        padding: 0 0 20px;
    }
    .tabs-wrap .nav-tabs .nav-link{
        padding: 10px 15px;
        font-size: 16px;
        margin-bottom: 6px;

    }
    .curve-bg {
        background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIzNzUiIGhlaWdodD0iNjIiIHZpZXdCb3g9IjAgMCAzNzUgNjIiPgogIDxwYXRoIGlkPSJjdXJ2ZSIgZD0iTTAsMEMxMjQuMTgsNjIsMzA5LjM1NCw0Mi42MzksMzc1LDMyVjYySDBaIiBmaWxsPSIjMTIxMzE0Ii8+Cjwvc3ZnPgo=);
        height: 107px;
        top: -107px;
    }
}

@media screen and (max-width: 575px) {
    .report-chart .title {
        font-size: 25px;
    }
    .tabs-wrap .nav-tabs li {
        width: 100%;
    }
    .tabs-wrap .nav-tabs .nav-link{
        width: 100%;
        margin-bottom: 10px;
    }
    .report-chart.mt-5{
        margin-top: 1rem!important;
    }
}
img {
    max-width: 100%;
}

.primary-color{
    color: var(--primary);
}

.categorical-ranking-icon{min-width: 21px;}
#hfc-balance-sheet-chart{min-height: 200px;}
.rp-symbl{font-family: Arial, Helvetica, sans-serif!important;}

/*** new Card **/
.report-chart.company-report .financial-row .card-header,.report-chart.company-report .financial-row .card-body{text-align: left;}


.sec-title {
    font-size: 30px;
    font-weight: 600;
    color: #09090B;
    

}

/***ranking section****/

.sector-filter-container select {
    background-color: #fff;
    border: 1px solid #DEDEE5;
    color: #000;
    padding: 16px 12px;
    width: auto;
    font-family: 'Poppins', sans-serif;
    font-size: 15px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: 0.01em;
    text-align: left;
    border-radius: 16px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    /* margin-right: 40px; */
    margin-bottom: 20px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='8' viewBox='0 0 14 8'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%23666666' stroke-width='1.5'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 16px center;
    background-size: 14px 8px;
    outline: none;
    width: 100%;
}

.dropdown-label {
    color: #000;
    margin-right: 10px;
    margin-bottom: 4px;
    font-size: 15px;
    font-weight: 600;
}

.dataTables_scroll table.dataTable thead th,
.dataTables_scroll table.dataTable thead td,
.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody {
    border: none;
}
.dark-bg {
    background: var(--dark-gray);
}
.dataTables_filter {
    width: 100%;
}
.dataTables_filter input {
    width: 100%;
    /* background: #353535 ; */
     background:transparent;
    padding: 16px 15px 16px 36px;
    border-radius: 16px;
    margin: 0px;
    background: #fff url(https://akm-img-a-in.tosshub.com/businesstoday/resource//best-bank-awards/assets/search.svg);
    background-repeat: no-repeat;
    background-position: 10px center;
    /* border: none; */
    border: 1px solid #DEDEE5;    
    font-family: 'Poppins', sans-serif;
    font-size: 15px;
    font-weight: 500;
    color: #f1f1f1;
}
.ranking-sec{background: #F6F7FB;padding: 40px 24px;}
#select-ranking-sector{min-width:360px; margin-right: 12px;}
.ranking-data-wrapper.school-rank #ranking-table_filter{display: none;}
.ranking-data .dataTables_empty {
    color: #fff;
}
.school-detail {
    border-radius: 12px;
    background: #fff;
    padding: 14px 12px;
    position: relative;
    border-bottom: 1px solid #DEDEE5;
    border-left: 4px solid #1B57B1;
        transition: .24s;
}
.school-detail:hover{background-image: linear-gradient(to right, #BBF1FF, #FF92CB);transform: translateX(4px);}
.school-detail .ai-center {
    padding: 0 12px 0 0px;
}
.rank-sec{min-width: 50px;text-align: center;font-size: 26px;color: #1B57B1;font-weight: 500; margin-right: 12px;}
.chart-data .school-detail .rank {
    margin: 0;
    position: absolute;
    left: 0;
    width: 52px;
    height: 33px;
}
.chart-data h5 {
    font-weight: 600;
    font-size: 14px;
    line-height: 21px;
    color: #09090B;
    margin-bottom: 0;
}
@media(min-width:991px){
    .chart-data h5{
   font-size: 17px; 
    }
.sec-title{
font-size: 58px;
}
}
.full-width {
    width: 100% !important;
}
.chart-data .badge {
    background: #F7D14C;
    font-weight: 500;
    color: #000;
    font-size: 12px;
    padding: 4px 6px;
    line-height: 26px;
    border-radius: 5px;
    text-align: center;
}
.dataTables_filter label {
    width: 100%;
}
.dataTables_wrapper .dataTables_paginate {
    float: none;
    text-align: center;
    margin-top: 10px;
    color: #fff;
}
.table.dataTable thead th {
    border-bottom: 0;
}
.chart-data .paginate_button .arrow.left {
    transform: rotate(180deg);
}
#ranking-table_paginate .arrow{border-width:0;}
.dataTables_scroll table.dataTable thead th,
.dataTables_scroll table.dataTable thead td,
.dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody {
    border: none;
}
.dataTables_scrollHead{
    max-height: 1px;
}
table.dataTable tbody th, table.dataTable tbody td{
    padding: 5px 4px;
}
.dataTables_wrapper .dataTables_paginate {
    float: none;
    text-align: center;
    margin-top: 4px;
    color: #fff;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled {
    opacity: 0.1;
    background: none !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    color: #fff !important;
    font-weight: 600;
    font-size: 12px;
    padding: 6px 6px !important;
    min-width: 24px;
    border-radius: 50%;
    margin: 0 6px;
    background: #000;
}
.dataTables_wrapper .dataTables_paginate .ellipsis{color: #000;}
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: #1B57B1 !important;
    color: #fff !important;
}
@media(min-width:767px){
.dataTables_wrapper .dataTables_paginate .paginate_button {
    padding: 6px!important;
    min-width: 32px;
}
}
@media screen and (max-width:767px) {
  .sector-filter-container{width: 100%;}
.mba-rankings-card .dataTables_wrapper .dataTables_paginate .paginate_button.current,
.mba-rankings-card .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: #1B57B1 !important;
    border-color: transparent;
    color: #fff !important;
}

.mba-rankings-card .dataTables_wrapper .dataTables_paginate .paginate_button {
    color: #1F1C24 !important;
}

   .chart-data .school-detail .rank.desktop {
        display: none;
    }

    .chart-data .school-detail .rank.mobile {
        margin: 0;
        position: absolute;
        left: 10px;
        top: 0;
        width: 34px;
        height: auto;
    }
}
.ai-top {
    align-items: flex-start;
}
.jc-space-b {
    justify-content: space-between;
}

@media screen and (min-width:768px) {
 .chart-data .rank.mobile {
        display: none;
    }
}

@media screen and (min-width:320px) {
      .chart-data img {
        width: 100%;
    }
}
@media screen and (min-width:320px) and (max-width:767px) {
        /* .school-detail {
        padding: 8px;
    } */

    .school-detail .ai-center {
        align-items: flex-start;
    }
}
.form-select {
    background-color: #343a40;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
    color: #fff;
}
.comp-name:focus-visible{outline: none;}
.filter-data-list .btn-link-tab
{
    color: #000;
    text-decoration: none;
    font-weight: 500;
    border: 1px solid #DEDEE5;
    padding: 16px 20px;
    margin: 0 4px 4px 0;
    background: transparent;
    border-radius: 12px;
    font-size: 18px;
    line-height: 1.5;
    text-align: left;
    white-space:nowrap;
    width: 180px;
}
@media(min-width:1200px){
.filter-data-list .btn-link-tab{
    width: 220px;
    padding: 16px 30px;
}
}
.f-sm{font-size: 13px;color: #656570;font-weight: 400;}
@media(min-width:768px){
  .filter-data-list .btn-link-tab{
      font-size: 24px;
  }  
}
.filter-data-list, .state-bank-btn-sec {
        display: flex;
        justify-content: space-between;
        flex-wrap: nowrap;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        overscroll-behavior-inline: contain;
        gap: 12px;
    }
.filter-data-list .btn-link-tab.active,.filter-data-list .btn-link-tab:hover{background: #1B57B1;color: #fff;}
.filter-data-list .btn-link-tab.active .f-sm,.filter-data-list .btn-link-tab:hover .f-sm{color: #fff;}
.sm-text{font-size: 14px;text-transform: uppercase;color: #666;font-weight: 500;margin-bottom: 4px;}
.card-state{
    background: #F7F9FC;
    border-radius: 26px;
    padding: 24px;
    /* box-shadow: 0 8px 8px rgba(0, 0, 0, .045); */
    transition: .3s;
    position: relative;
    overflow: hidden;
  }
  .card-state:hover{
    background: #E0E5EF;
  }
  /* .card-state::before{
    content: "";
    background: #1b1f24;
    width: 172px;
    height: 172px;
    border-radius: 100%;
    position: absolute;
    top: -45px;
    right: -47px;
    z-index: 1;
  } */
  .card-state-inner{
    position: relative;
    z-index: 2;
  }
.card-state:hover{
    transform: translateY(3px);
}
.card-state svg{
    width: 100%;
}
.rank-svg-container{min-width:70px;}
.rank-text{
    min-width:48px;
    height: 26px; 
    border-right: 1px solid #61677C;
    font-size: 30px;
    font-weight: 500; 
    display: inline-flex;
    justify-content: flex-start;
    align-items: center;
    color: #1B57B1;
}
.card-state .heading-sec{color: #09090B; font-size: 19px;font-weight: 600;}
.card-state .detail-notes{
    color: #fff;
}
.progress-notes{display: flex; gap: 12px; justify-content: center;}
.detail-sec{
    background: #fff;
    padding: 14px 12px;
    border-radius: 18px;
    margin: auto;
    margin-bottom: 8px;
    max-width: 220px;
    text-align: center;
    flex: 1 0 48%;
}
    .fy-label {
        font-weight: 600;
        font-size: 12px;
        line-height: 120%;
        color: #656570;
        margin-bottom: 4px;
    }
    .fy-value {
        font-weight: 600;
        font-size: 17px;
        line-height: 120%;
        color: #13825D;
    }
.text-success{color: #13825D!important;}
.text-na{text-transform: uppercase!important; color: #666!important; font-weight: 400;}
@media(min-width:768px){
    .detail-sec{
    margin: inherit;
    margin-bottom: 0; 
    }
   .fy-value { font-size: 22px;}
   .fy-label{font-size: 13px;} 
}
    .state-DataSearch{
    width: 100%;
    background: #F5F5F7;
    padding: 10px 15px 10px 34px;
    border-radius: 8px;
    margin: 0px;
    background-image: url(https://akm-img-a-in.tosshub.com/businesstoday/resource//best-bank-awards/assets/search.svg);
    background-repeat: no-repeat;
    background-position: 6px center;
    border: none;
    font-family: 'Poppins', sans-serif;
    font-size: 15px;
    font-weight: 500;
    color: #000;
    }
    .heading-text{
        font-size: 18px;
         padding-bottom: 12px;
        color: #000;
        font-weight: 500;
    }
    @media(min-width:991px){
    .rank-text{
    min-width:60px;
    height: 60px; 
    justify-content: center;
    }    
     .heading-text{
        font-size: 24px;
        padding-bottom: 0;
    }       
    }
.link-tab
{
    color: #000;
    text-decoration: none;
    font-weight: 500;
    border: 1px solid #DEDEE5;
    padding: 12px 16px;
    margin: 0 2px 8px 0;
    background: transparent;
    border-radius: 24px;
    font-size: 13px;
    /* transition: all 0.3s ease-in; */
    text-align: left;
    min-width: 172px;
}
.link-tab span{margin-top: 6px;}
.link-tab.active svg path,.link-tab:hover svg path{
 fill: #fff;
}
.link-tab svg path {
    fill: #000;
}
.state-search-header {
    position: sticky;
    top: 82px;
    z-index: 4;
    background: #fff;
    padding-top: 4px;
    padding-bottom: 4px;
}
@media(min-width:768px){
   .link-tab{
    padding: 16px 16px;
    margin: 0 4px 12px 0;
    font-size: 13px;
   } 
   .state-search-header {
    top: 0;

}
}


.link-tab.active,.link-tab:hover{background: #1B57B1;color: #fff;border: 1px solid #1B57B1;}
.skeleton-card {
    padding: 8px;
    border-radius: 12px;
    background: #fff;
    max-height: 68px;
    margin-bottom: 10px;
}
.skeleton-rank {
    width: 52px;
    height: 33px;
    border-radius: 4px;
    margin-right: 4px;
    background: #f0f1f4;
    animation: shimmer 1.5s infinite;
}

.skeleton-content {
    flex: 1;
}

.skeleton {
    border-radius: 4px;

    background: linear-gradient(
        90deg,
        #eef0f3 25%,
        #f8f9fa 50%,
        #eef0f3 75%
    );

    background-size: 200% 100%;
    animation: shimmer 1.5s infinite;
}

.skeleton-title {
    width: 220px;
    height: 18px;
    margin-bottom: 12px;
}

.skeleton-subtitle {
    width: 180px;
    height: 12px;
    margin-bottom: 8px;
}

@keyframes shimmer {
    0% {
        background-position: 200% 0;
    }

    100% {
        background-position: -200% 0;
    }
}

.methology-intro p{
    line-height: 1.4;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover{
    color: #fff !important;
}
.rank-label{font-size:12px;font-weight:400;line-height:1.4;color:#656570;margin-top: 2px;}
.rank-divider{font-size:13px;font-weight:600;line-height:1.2;color:#ccc;padding:0 4px}
.pill-rank {
   padding-left: 8px;
   margin-left: 8px;
    font-size: 16px;
    line-height: 16px;
    text-transform: uppercase;
    color:#1B57B1;
    background: transparent;
    font-weight: 600; 
    display: inline-flex;
    min-width: 100px;
}
.pill-rank.pill-unlisted{color: #752473;} 
.sector-info{font-size: 12px;color: #f1f1f1;margin-bottom: 6px;}
.band-text,.note-text{
    font-size: 13px;
    color: #f1f1f1;
    font-weight: 400;
    line-height: 1.6;
}
.district-img{
    max-width: 100%;
    height: 100%;
    background: #fff;
    border-radius: 12px;
    margin-bottom: 24px;
    overflow: hidden;

}
.district-img img{
    border-radius: 12px;
}

.manufacturing-info,.manufacturing-info p{
    font-size: 16px;
    line-height: 1.6;
}

.arrow-btn {
    width: 36px;
    height: 36px;
    border: 1px solid #d9dce3;
    border-radius: 50%;
    background: #fff;
    position: relative;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 10px;
}

/* Arrow line */
.arrow-btn span {
    width: 15px;
    height: 1.5px;
    background: #6b7280;
    position: relative;
    display: block;
}

/* Arrow head */
.arrow-btn span::after {
    content: "";
    position: absolute;
    width: 7px;
    height: 7px;
    border-top: 1.5px solid #6b7280;
    border-right: 1.5px solid #6b7280;
    transform: rotate(45deg);
    right: 0;
    top: -3px;
}
.report-sec-inner{
    background: #171526;
    padding: 0 24px 40px 24px;
}
.methodology-inner{
    background:#F7F9FC;
    padding: 24px 24px 40px 24px;
}
.methodology-info{padding: 24px 0;}
.methodology-info, .methodology-info p{
    font-size: 17px;
    line-height: 1.6;
    color: #000;
}
ul#mainSecTab{
    display: flex;
    justify-content: flex-end;
}
ul#mainSecTab li{
    margin-right: 6px;
    font-weight: 600;
}
ul#mainSecTab li a{
    background: #fff;
    padding: 8px 6px; 
    color: #000;
    border-radius: 9px 9px 0 0;
    display: inline-block;
    white-space: nowrap;
    font-size: 15px;
}
ul#mainSecTab li.active a{background: #E4E8EC;}


.nav.nav-tabs.methodologyTab{border-bottom: 3px solid #1B57B1;}
.methodologyTab.nav-tabs .nav-link{color: #000;font-size: 15px; font-weight: 600;}

.methodologyTab.nav-tabs .nav-link.active,.methodologyTab.nav-tabs .nav-link:hover{background: #1B57B1;color: #fff;border: none;border-bottom-color: #1B57B1}
.methodology-info p{
    margin-bottom: 16px;
}
.methodology-info a{color: #1B57B1}
.methodology-info a:hover{color: #1058c5}
.report-chart .bank-name {
    font-size: 16px;
    font-weight: 500;
    color: #fff;
    line-height: 1.3;
}
@media(min-width:991px){
    ul#mainSecTab li a {
        font-size: 18px;
       padding: 8px 12px; 
    }
 .methodologyTab.nav-tabs .nav-link{font-size: 18px;}   
}
.card-rank-sec{
    width:180px;
    padding:16px 0; 
    text-align: center;
    background: #27253A; 
    border: 1px solid #4B4A60;
    margin-right: 16px;
}
#rankComp-svg {
    background: linear-gradient(135deg,#BBF1FF,#FF92CB);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}
.show-comp-type{background: #1B57B1;border-radius: 16px; padding: 9px 16px;font-weight: 600;color: #fff;font-size: 13px;}
.heading-bg-report{
    padding:0 24px;
    background-image:linear-gradient(to right, #C02571, #000000)
}
#search-comp{padding: 0 8px;}
.card-detail-top-sec{
    border-bottom: none;
    margin-top: 12px;
}
  .logo-svg {
    width: min(90vw, 600px);
    height: auto;
  }

  .logo-svg path {
    fill: #09090b;
  }
  @media(max-width:767px){
      .logo-svg {
    width: min(90vw, 360px);
    height: auto;
  }
  }

  /* Eco-friendly green for the leaves */
  .leaf {
    fill: #2f9e44 !important;
    transform-box: view-box;
    transform-origin: 39px 88px; /* the chimney mouth, shared by all three leaves */
    animation-duration: 6.5s;
    animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
    animation-iteration-count: infinite;
  }

  .leaf-1 { animation-name: leaf1; }
  .leaf-2 { animation-name: leaf2; }
  .leaf-3 { animation-name: leaf3; }

  /* Large leaf emerges first, growing outward from the chimney mouth */
  @keyframes leaf1 {
    0%   { opacity: 0;   transform: scale(0.04); }
    3%   { opacity: 1;   transform: scale(0.04); }
    22%  { opacity: 1;   transform: scale(1); }
    68%  { opacity: 1;   transform: scale(1); }
    86%  { opacity: 0;   transform: scale(1); }
    100% { opacity: 0;   transform: scale(1); }
  }

  /* Left leaf emerges second */
  @keyframes leaf2 {
    0%   { opacity: 0;   transform: scale(0.04); }
    22%  { opacity: 0;   transform: scale(0.04); }
    25%  { opacity: 1;   transform: scale(0.04); }
    42%  { opacity: 1;   transform: scale(1); }
    68%  { opacity: 1;   transform: scale(1); }
    86%  { opacity: 0;   transform: scale(1); }
    100% { opacity: 0;   transform: scale(1); }
  }

  /* Right leaf emerges third */
  @keyframes leaf3 {
    0%   { opacity: 0;   transform: scale(0.04); }
    42%  { opacity: 0;   transform: scale(0.04); }
    45%  { opacity: 1;   transform: scale(0.04); }
    62%  { opacity: 1;   transform: scale(1); }
    68%  { opacity: 1;   transform: scale(1); }
    86%  { opacity: 0;   transform: scale(1); }
    100% { opacity: 0;   transform: scale(1); }
  }

  /* Respect users who prefer reduced motion: show leaves static, no animation */
  @media (prefers-reduced-motion: reduce) {
    .leaf {
      animation: none;
      opacity: 1;
      transform: none;
    }
  }

@media(min-width:991px){
    .card-detail-top-sec{
    border-bottom: 1px solid #4B4A60;
    margin-top: 0;
    
}
.card-rank-sec{
    padding:34px 0; 
    border-bottom: none;
    margin-right: 16px;
}
.card-rank-sec{
    margin-right: 32px;
}
.report-chart .bank-name {
    font-size: 34px;
}
}

@media (max-width: 767px) {
.arrow-btn span {
    width: 10px;
}    
.arrow-btn {
    width: 24px;
    height: 24px;
}
    .dataTables_wrapper .dataTables_paginate .paginate_button{margin:0 3px}
    .pill-rank{display: none;}
    .ranking-sec{
        padding: 32px 12px;
    }
    #select-ranking-sector{width: 100%;min-width:auto;}
    #search-comp{display: flex;flex-direction: column;margin-bottom: 24px;}
    .filter-data-list {
        padding: 4px 2px 16px;
        border: 0;
        gap: 10px;
        background: transparent;
    }
}

/*** map interactive css start here****/

.mono{font-family: Poppins, sans-serif;font-feature-settings:"tnum" 1}
.shell{
    max-width:1560px;
    margin:0 auto;
    /* padding:var(--step) */
}

/* ---------- masthead ---------- */
.masthead{background:var(--rail);color:#fff;border-radius:14px;padding:1.15rem 1.4rem 0;overflow:hidden}
.eyebrow{font-family: Poppins, sans-serif;font-size:.66rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--brass);margin:0 0 .45rem}
.masthead h1{margin:0;font-size:clamp(1.4rem,3.4vw,2.2rem);font-weight:700;
  font-variation-settings:"wdth" 88;letter-spacing:-.015em;line-height:1.1}
.standfirst{margin:.55rem 0 0;max-width:74ch;color:#A9B4C0;font-size:.9rem}

/* ---------- tabs ---------- */
.tabs{display:flex;gap:2px;margin:1.1rem 0 0;list-style:none;padding:0;
    flex-wrap: nowrap;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
}
.tab{
  appearance:none;border:0;background:transparent;color:#8D9AA8;cursor:pointer;
  font:inherit;font-size:.85rem;font-weight:600;letter-spacing:-.005em;
  padding:.62rem 1rem;border-radius:9px 9px 0 0;position:relative;
  display:flex;align-items:center;gap:.5rem;transition:color .16s ease,background .16s ease;
   white-space:nowrap;
}
.tab:hover{color:#D8E0E8;background:rgba(255,255,255,.05)}
.tab[aria-selected="true"]{background:var(--plate);color:var(--ink);}
.tab:focus-visible{outline:2px solid var(--brass);outline-offset:-3px}
.tab .dotrow{display:flex;gap:2px}
.tab .dotrow i{width:7px;height:7px;border-radius:50%;display:block;opacity:.85}
.tab[aria-selected="true"] .dotrow i{opacity:1}

/* ---------- panels ---------- */
.panel{background:var(--card);border-radius:12px;box-shadow:var(--shadow);padding:1rem 1.05rem 1.1rem}
.panel-title{font-family: Poppins, sans-serif;font-size:.64rem;letter-spacing:.15em;
  text-transform:uppercase;color:var(--ink-3);margin:0 0 .7rem;
  display:flex;justify-content:space-between;align-items:baseline;gap:.5rem}
.tabpanel[hidden]{display:none}

/* ---------- highlights ---------- */
.highlights{display:grid;grid-template-columns:repeat(4,1fr);gap:.7rem;margin:var(--step) 0 0}
.hl{background:var(--card);border-radius:11px;box-shadow:var(--shadow);padding:.8rem .9rem}
.hl-v{font-size:1.6rem;font-weight:700;letter-spacing:-.025em;font-variation-settings:"wdth" 90;line-height:1.05}
.hl-k{font-size:.76rem;color:var(--ink-2);margin-top:.2rem}
.hl-b{display:block;height:3px;border-radius:99px;background:var(--brass);width:26px;margin-bottom:.5rem}

/* ---------- frame ---------- */
.frame{display:grid;grid-template-columns:250px minmax(0,1fr) 330px;gap:var(--step);
  margin-top:var(--step);align-items:start}
.frame.pair{grid-template-columns:250px minmax(0,1fr) 320px}

/* ---------- chips ---------- */
.chips{display:flex;flex-direction:column;gap:4px;list-style:none;margin:0;padding:0}
.chip{display:grid;grid-template-columns:13px 1fr auto;align-items:center;gap:.55rem;width:100%;
  text-align:left;cursor:pointer;background:transparent;border:1px solid transparent;border-radius:8px;
  padding:.46rem .55rem;font:inherit;color:var(--ink);
  transition:background .16s ease,border-color .16s ease}
.chip:hover{background:var(--wash)}
.chip:focus-visible{outline:2px solid var(--brass);outline-offset:2px}
.chip[aria-pressed="true"]{background:var(--wash);border-color:var(--hair)}
.chip[aria-pressed="true"] .chip-name{font-weight:700}
.swatch{width:13px;height:13px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.14);flex:none}
.chip-name{font-size:.83rem;line-height:1.25;letter-spacing:-.005em}
.chip-num{font-family: Poppins, sans-serif;font-size:.76rem;color:var(--ink-2);font-weight:500}
.chip[aria-pressed="true"] .chip-num{color:var(--ink)}

.switch{display:flex;align-items:center;gap:.6rem;cursor:pointer;margin-top:.8rem;padding-top:.8rem;
  border-top:1px solid var(--hair);font-size:.8rem;color:var(--ink-2)}
.switch input{appearance:none;width:34px;height:19px;border-radius:99px;background:#CBD2D9;position:relative;
  cursor:pointer;flex:none;transition:background .18s ease;margin:0}
.switch input::after{content:"";position:absolute;top:2px;left:2px;width:15px;height:15px;border-radius:50%;
  background:#fff;transition:transform .18s ease;box-shadow:0 1px 2px rgba(0,0,0,.25)}
.switch input:checked{background:var(--rail-2)}
.switch input:checked::after{transform:translateX(15px)}
.switch input:focus-visible{outline:2px solid var(--brass);outline-offset:2px}

/* ---------- map stage ---------- */
.stage{position:relative;background:var(--card);border-radius:12px;box-shadow:var(--shadow);overflow:hidden}
.stage canvas{display:block;width:100%;touch-action:none;cursor:grab}
.stage canvas.dragging{cursor:grabbing}
.zoomer{position:absolute;top:12px;right:12px;display:flex;flex-direction:column;gap:5px}
.zoomer button{width:31px;height:31px;border-radius:7px;border:1px solid var(--hair);
  background:rgba(255,255,255,.94);color:var(--ink);font:600 15px/1 "IBM Plex Mono",monospace;
  cursor:pointer;display:grid;place-items:center;transition:background .15s ease}
.zoomer button:hover{background:#EDF1F4}
.zoomer button:focus-visible{outline:2px solid var(--brass);outline-offset:2px}
.zoomer button.reset{font-size:10px;letter-spacing:.04em}
.tip{position:absolute;pointer-events:none;opacity:0;transform:translate(-50%,-136%);background:var(--rail);
  color:#fff;border-radius:7px;padding:.4rem .55rem;font-size:.74rem;white-space:nowrap;
  box-shadow:0 6px 18px rgba(18,23,29,.28);transition:opacity .12s ease;z-index:4}
.tip.on{opacity:1}
.tip b{display:block;font-weight:600;font-size:.8rem}
.tip span{color:#A9B4C0;font-family: Poppins, sans-serif;font-size:.66rem;letter-spacing:.06em;text-transform:uppercase}
.stage-foot{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;
  padding:.55rem .95rem .7rem;border-top:1px solid var(--hair);font-size:.72rem;color:var(--ink-3)}
.hint{font-family: Poppins, sans-serif;letter-spacing:.02em}

/* ---------- readout + ladder ---------- */
.readout{display:grid;grid-template-columns:1fr 1fr;gap:.55rem}
.stat{background:var(--wash);border-radius:9px;padding:.6rem .7rem}
.stat-k{font-family: Poppins, sans-serif;font-size:.6rem;letter-spacing:.13em;text-transform:uppercase;
  color:var(--ink-3);display:block;margin-bottom:.15rem}
.stat-v{font-size:1.35rem;font-weight:700;letter-spacing:-.02em;font-variation-settings:"wdth" 92;display:block}
.stat-v small{font-size:.72rem;font-weight:500;color:var(--ink-2);letter-spacing:0}
.ladder{list-style:none;margin:.5rem 0 0;padding:0}
.rung{display:grid;grid-template-columns:1fr auto;gap:.28rem .6rem;padding:.3rem 0}
.rung + .rung{border-top:1px solid #EEF1F4}
.rung-name{font-size:.82rem;letter-spacing:-.005em}
.rung-val{font-family: Poppins, sans-serif;font-size:.78rem;font-weight:500}
.track{grid-column:1/-1;height:5px;border-radius:99px;background:#EBEFF2;overflow:hidden}
.fill{display:block;height:100%;border-radius:99px;width:0;transition:width .62s cubic-bezier(.22,.72,.24,1)}
.rung.rest{opacity:.62}
.rung.rest .rung-name{font-style:italic}

/* ---------- region list (signature, tab 1) ---------- */
.regions{list-style:none;margin:0;padding:0;counter-reset:rg}
.region{border-top:1px solid #EEF1F4}
.regions .region:first-child{border-top:0}
.region-btn{width:100%;display:grid;grid-template-columns:auto 1fr auto;align-items:baseline;gap:.55rem;
  background:transparent;border:0;font:inherit;color:var(--ink);text-align:left;cursor:pointer;
  padding:.5rem .35rem;border-radius:8px;transition:background .15s ease}
.region-btn:hover{background:var(--wash)}
.region-btn:focus-visible{outline:2px solid var(--brass);outline-offset:-2px}
.region-pin{font-family: Poppins, sans-serif;font-size:.62rem;font-weight:600;color:#fff;
  background:var(--rail-2);width:17px;height:17px;border-radius:50%;display:grid;place-items:center;
  align-self:center;flex:none;transition:background .18s ease}
.region[aria-expanded="true"] .region-pin{background:var(--brass)}
.region-name{font-size:.83rem;font-weight:600;letter-spacing:-.005em}
.region-num{font-family: Poppins, sans-serif;font-size:.78rem;color:var(--ink-2)}
.region-bar{grid-column:2/-1;height:4px;border-radius:99px;background:#EBEFF2;overflow:hidden;margin-top:.3rem}
.region-bar i{display:block;height:100%;background:var(--rail-2);border-radius:99px;width:0;
  transition:width .6s cubic-bezier(.22,.72,.24,1)}
.region[aria-expanded="true"] .region-bar i{background:var(--brass)}
.region-body{display:none;padding:.1rem .35rem .75rem 1.4rem}
.region[aria-expanded="true"] .region-body{display:block}
.region-ind{font-size:.78rem;color:var(--ink-2);margin:.1rem 0 .45rem}
.cos{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px}
.cos li{font-size:.72rem;background:var(--wash);border:1px solid var(--hair);border-radius:99px;padding:.16rem .5rem}

/* ---------- charts ---------- */
.charts{display:grid;grid-template-columns:1fr 1fr;gap:var(--step);margin-top:var(--step)}
.charts.three{grid-template-columns:repeat(3,1fr)}
.bars{list-style:none;margin:.3rem 0 0;padding:0}
.bar{display:grid;grid-template-columns:1fr auto;gap:.2rem .6rem;padding:.26rem 0}
.bar + .bar{border-top:1px solid #F1F4F6}
.bar-name{font-size:.8rem;letter-spacing:-.005em}
.bar-name em{font-style:normal;color:var(--ink-3);font-size:.72rem}
.bar-val{font-family: Poppins, sans-serif;font-size:.78rem;font-weight:500}
.bar-track{grid-column:1/-1;height:6px;border-radius:99px;background:#EBEFF2;overflow:hidden}
.bar-track i{display:block;height:100%;border-radius:99px;width:0;
  transition:width .7s cubic-bezier(.22,.72,.24,1)}
.bar.cut{opacity:.55}
.chart-note{font-size:.72rem;color:var(--ink-3);margin:.7rem 0 0;padding-top:.6rem;border-top:1px solid var(--hair)}

/* ---------- district choropleth (tab 3) ---------- */
.statepills{display:flex;gap:6px;margin-bottom:.85rem;flex-wrap:wrap}
.statepill{
  font:inherit;font-size:.8rem;font-weight:600;letter-spacing:-.005em;cursor:pointer;
  background:var(--wash);border:1px solid var(--hair);color:var(--ink-2);
  padding:.4rem .8rem;border-radius:99px;transition:background .16s ease,color .16s ease,border-color .16s ease;
}
.statepill:hover{background:#EAEFF3}
.statepill:focus-visible{outline:2px solid var(--brass);outline-offset:2px}
.statepill[aria-pressed="true"]{background:var(--rail);border-color:var(--rail);color:#fff}
.state-sub{font-size:.82rem;color:var(--ink-2);font-style:italic;margin:0 0 1rem;padding-bottom:.9rem;
  border-bottom:1px solid var(--hair);line-height:1.5}
.state-sub b{font-style:normal;color:var(--ink)}

.svgstage{width:100%;height:auto;display:block;touch-action:none;cursor:grab}
.svgstage.dragging{cursor:grabbing}
.svgstage path{stroke:#fff;stroke-width:1;transition:fill-opacity .18s ease,stroke .18s ease,stroke-width .18s ease;cursor:pointer}
.svgstage path.dim{fill-opacity:.22}
.svgstage path.pop{stroke:#12171D;stroke-width:2}
.svgstage path.hoverpath{stroke:#12171D;stroke-width:1.6}

.dist-chips{list-style:none;margin:.6rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:5px}
.dist-chips li{
  font-size:.74rem;background:var(--wash);border:1px solid var(--hair);border-radius:99px;
  padding:.2rem .55rem;display:flex;align-items:center;gap:.3rem;
}
.dist-chips li i{width:7px;height:7px;border-radius:50%;flex:none}
.dist-chips li em{font-style:normal;color:var(--ink-3);font-size:.66rem}

.scope-note{
  margin-top:.85rem;padding-top:.75rem;border-top:1px solid var(--hair);
  font-size:.74rem;color:var(--ink-3);line-height:1.55;
}
.scope-note b{color:var(--ink-2);font-weight:600}

/* ---------- export champions (tab 4) ---------- */
.lead{
  background:var(--card);border-radius:12px;box-shadow:var(--shadow);
  padding:1rem 1.2rem;margin-top:var(--step);display:flex;gap:.9rem;align-items:flex-start;
}
.lead-mark{
  flex:none;width:34px;height:34px;border-radius:50%;background:var(--wash);border:1px solid var(--hair);
  display:grid;place-items:center;font-family: Poppins, sans-serif;font-size:.7rem;font-weight:600;color:var(--brass);
}
.lead p{margin:0;font-size:.86rem;line-height:1.55;color:var(--ink-2)}
.lead p b{color:var(--ink);font-weight:600}
.lead p em{font-style:normal;color:var(--ink-3)}

.chartstage-svg{width:100%;height:auto;display:block}
.chartstage-svg .grid{stroke:#E7EBEE;stroke-width:1}
.chartstage-svg .refline{stroke:#C9D0D7;stroke-width:1.3;stroke-dasharray:3 4}
.chartstage-svg .refline-label{fill:var(--ink-3);font-family: Poppins, sans-serif;font-size:11px;font-style:italic}
.chartstage-svg .axislabel{fill:var(--ink-3);font-family: Poppins, sans-serif;font-size:11px}
.chartstage-svg .axistitle{fill:var(--ink-2);font-family: Poppins, sans-serif;font-size:12.5px;font-weight:600}
.chartstage-svg circle{cursor:pointer;transition:opacity .18s ease,stroke-width .18s ease}
.chartstage-svg circle.dim{opacity:.25}
.chartstage-svg circle.pop{stroke-width:3.2}
.chartstage-svg text.bubble-label{fill:var(--ink);font-family: Poppins, sans-serif;font-size:12px;
  font-weight:600;pointer-events:none;transition:opacity .18s ease}
.chartstage-svg text.bubble-label.dim{opacity:.25}

.domcard-head{margin:0 0 .8rem}
.domcard-district{font-size:1.05rem;font-weight:700;letter-spacing:-.01em;line-height:1.25}
.domcard-state{font-size:.78rem;color:var(--ink-2);margin-top:.1rem}
.domcard-product{
  display:inline-block;margin-top:.5rem;font-size:.72rem;font-weight:600;letter-spacing:.02em;
  padding:.22rem .6rem;border-radius:99px;color:#fff;
}
.domcard-note{font-size:.82rem;color:var(--ink-2);line-height:1.55;margin:.9rem 0 0;
  padding-top:.8rem;border-top:1px solid var(--hair)}
.domcard-empty{font-size:.85rem;color:var(--ink-3);line-height:1.6;padding:.4rem 0 .2rem}

.footnote{margin:var(--step) 0 0;padding-top:.85rem;border-top:1px solid var(--hair);
  font-size:.72rem;color:var(--ink-3);display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.footnote b{color:var(--ink-2);font-weight:600}

/* ---------- responsive ---------- */
@media (max-width:1180px){
  .frame,.frame.pair{grid-template-columns:minmax(0,1fr) 300px}
  .rail{grid-column:1/-1}
  .rail-inner{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
  .chips{flex-direction:row;overflow-x:auto;padding-bottom:4px;gap:6px;scrollbar-width:thin}
  .chip{grid-template-columns:12px auto;flex:none;white-space:nowrap;border:1px solid var(--hair)}
  .chip-num{display:none}
  .switch{margin:0 0 0 auto;padding:0;border:0}
  .highlights{grid-template-columns:repeat(2,1fr)}
  .statepills{order:-1;width:100%}
  .charts.three{grid-template-columns:1fr 1fr}
}
@media (max-width:860px){
  :root{--step:.9rem}
  .frame,.frame.pair,.charts,.charts.three{grid-template-columns:minmax(0,1fr)}
  .masthead{border-radius:11px}
  .stage-foot .hint{display:none}
  .tab{font-size:.78rem;padding:.55rem .7rem}
  .hl-v{font-size:1.35rem}
}
@media (prefers-reduced-motion:reduce){*{transition-duration:0s !important;animation-duration:0s !important}}

/*** end here ***/