body{background:white;}
.profit-calculator-section{ padding: 10px 0 50px;}

.calculator-wrapper{ display:grid; grid-template-columns:1fr 1fr; gap:30px; max-width: 1500px; margin: 0 auto; }
.calculator-wrapper .calculator-form,
.calculator-wrapper .calculator-result{ overflow: hidden;  background:#fff; border-radius:12px; box-shadow:0 5px 20px rgba(0,0,0,.08); }
.calculator-wrapper .calculator-form h2,
.calculator-wrapper .calculator-result h3{ background: #1761A0; color: white; margin: 0; text-align: center; font-size: 20px; padding: 10px 0; }
.calculator-wrapper .form-group{margin-bottom:0; width: calc(50% - 10px);}
.calculator-wrapper .form-group label{ display:block; margin-bottom:6px; font-weight:700; font-size: 17px;}
.calculator-wrapper .form-group input,
.calculator-wrapper .form-group select{ width:100%; height:50px; border:1px solid #ddd; border-radius:8px; padding:0 15px; }
.calculator-wrapper .calculator-form button{ width:100%; height:55px; border:none; background:#21891e; color:#fff; border-radius:8px; font-size:16px; font-weight:600; cursor:pointer; }
.calculator-wrapper .calculator-form button:hover{ opacity:.9;}
.calculator-wrapper .result-item{ display:flex; justify-content:space-between; padding: 0 0 14px 0; border-bottom:1px solid #eee; font-size: 17px; align-items: center;}
.calculator-wrapper .result-item strong{color:#1761A0;}
.calculator-wrapper .form_inner{ padding: 30px; display: flex; flex-wrap: wrap; gap: 15px;}
.calculator-wrapper .calculator-result .form_inner{ flex-direction: column;}
.calculator-wrapper .button_inner{padding:0 30px;}
.calculator-wrapper .result-item p{display: flex; align-items: center; gap: 10px; margin:0;}
.calculator-wrapper .result-item p span{background: #EAF0FC; display: flex; max-width: max-content; padding: 10px; border-radius: 16px;}
.calculator-wrapper .result-item p span svg{ fill: #1761A0;}
.calculator-wrapper .result-item strong.color_red{color:red;}
.calculator-wrapper .result-item strong.color_green{color:green;}

.rate_section{ padding: 40px 0;}
.rate_section .rate_inner .rate_block{border: 1px solid #e3e3e3; box-shadow: rgba(0, 0, 0, .15) 4px 4px 10px; border-radius: 10px; display: flex; flex-wrap: nowrap; gap:25px; max-width: 1500px;     margin: 0 auto;}
.rate_section .rate_inner .rate_block .rate_data:hover{transform: translateY(-2px); box-shadow: 0 12px 40px -8px hsl(201 73% 36% / .15);}
.rate_section .rate_inner .rate_block .rate_data{ transition: all 0.3s ease;  width: calc(50% - 12.5px); text-align: center; padding: 25px;}
.rate_section .rate_inner .rate_block .rate_data img{width: 100%; max-width: 100px; margin: 0 auto;}
.rate_section .rate_inner .rate_block .rate_data h3{color: #08468f; font-weight: 700; font-size: 36px;}
.rate_section .rate_inner .rate_block .rate_data p{color: black; margin:0; font-size: 14px;}
.rate_section .rate_inner .rate_block .rate_data span{background: #e7f2f9; display: flex; align-items: center; max-width: max-content; padding: 20px; border-radius: 50%; margin: 0 auto;}
.rate_section .rate_inner .rate_block .rate_data span svg{ stroke: #08468f; fill:#08468f;}
.rate_section .rate_inner .rate_block .rate_data .data_inner{display: flex; gap: 10px; text-align: left;}
.rate_section .rate_inner .rate_block .rate_data .image_desc{text-align: left; margin-top: 20px; margin-left: 0;}
.rate_section .rate_inner .rate_block .rate_data .image_desc li{list-style-type: none; display: flex; align-items: center; gap: 10px; margin-top: 15px;}
.rate_section .rate_inner .rate_block .rate_data .data_inner h3{color: black; font-weight: 700; font-size: 20px; margin-top: 0; text-transform: capitalize;}
.rate_section .rate_inner .rate_block .data_inner span{ border-radius: 50%;}
.rate_section.list_block .rate_inner .rate_block .rate_data{ width: calc(33.33% - 16.66px); display: flex!important; gap: 20px; align-items: flex-start; text-align:left;}
.rate_section.list_block .rate_inner .rate_block .rate_data h3{ font-size: 20px; margin-top: 0;}

.profit_block .profit_inner{display: flex; gap: 30px; max-width: 1500px; margin: 0 auto;}
.profit_block .profit_inner .margin_blocks,
.profit_block .profit_inner .increase_block{width: calc(50% - 15px); border: 1px solid #e3e3e3; box-shadow: rgba(0, 0, 0, .15) 4px 4px 10px; border-radius: 10px; padding: 20px;}
.profit_block .profit_inner .increase_block .increase_inner{display: flex; gap: 20px; align-items: end;}
.profit_block .profit_inner .increase_block .increase_inner .text_inner{width: calc(60% - 10px);}
.profit_block .profit_inner .increase_block .increase_inner .image_side{width: calc(40% - 10px);}
.profit_block .profit_inner .margin_blocks ul{ margin: 20px 0 0;}
.profit_block .profit_inner .margin_blocks ul li{display: flex; justify-content: space-between; list-style-type: none; border-top: 1px solid lightgray;}
.profit_block .profit_inner h2{font-size: 25px; margin-top: 20px; color: #08468f; text-transform: capitalize;}
.profit_block .profit_inner .increase_block .increase_inner .text_inner ul li{list-style-type: none; display: flex; align-items: center; gap: 10px; margin-bottom: 10px;}
.profit_block .profit_inner .increase_block .increase_inner .text_inner ul{ margin: 20px 0;}
.profit_block .profit_inner .increase_block .increase_inner .text_inner ul li svg{stroke: green;}
.profit_block .profit_inner .margin_blocks ul li p:last-child{border-radius: 10px; padding: 5px 10px; text-transform: capitalize;}
.profit_block .profit_inner .margin_blocks ul li:nth-child(1) p:last-child{background: #FEF8F7; color: red;}
.profit_block .profit_inner .margin_blocks ul li:nth-child(2) p:last-child{background: #FCF7F2; color: orange;}
.profit_block .profit_inner .margin_blocks ul li:nth-child(3) p:last-child{background: #F6FCF8; color: green;}
.profit_block .profit_inner .margin_blocks ul li:nth-child(4) p:last-child{background: #EEF8F3; color: darkgreen;}

.profit-calculator-section .tab_section .slide_up_down{display: flex; gap: 20px; flex-wrap: wrap;}
.profit-calculator-section .tab_section .slide_up_down .slide{width: calc(50% - 10px);}
.profit-calculator-section .tab_section{background: unset; max-width: 1500px; margin: 0 auto; padding: 20px 0;}

       @media (min-width: 768px) and (max-width:1440px) {
        .calculator-wrapper,
        .rate_section .rate_card,
        .profit_block,
        .profit-calculator-section .tab_section{ padding: 0 20px;}
       }

 @media(max-width: 767px) {

    .profit-calculator-section{padding: 10px 0;}

    .calculator-wrapper{grid-template-columns: 1fr; padding: 0 20px;}
    .calculator-wrapper .form-group label{font-size: 15px;}

    .rate_section{margin: 0 20px;}
    .rate_section .rate_inner .rate_block{overflow: scroll; padding: 15px; gap: 10px;}
    .rate_section.list_block .rate_inner .rate_block .rate_data{min-width: 85%; padding: 0; flex-direction: column; text-align: center;}
    .profit_block .profit_inner{flex-direction: column; padding:0 20px;}
    .profit_block .profit_inner .margin_blocks, 
    .profit_block .profit_inner .increase_block{width:100%;}
    .profit_block .profit_inner .increase_block .increase_inner{ flex-direction: column;}
    .profit_block .profit_inner .increase_block .increase_inner .text_inner,
    .profit_block .profit_inner .increase_block .increase_inner .image_side{ width: 100%;}
    .profit-calculator-section .tab_section .slide_up_down{flex-direction: column; margin-top: 20px;}
    .profit-calculator-section .tab_section .slide_up_down .slide{width: 100%;}
    .profit-calculator-section .tab_section .tab__main{ padding: 0 20px;}
 }