.elementor-10639 .elementor-element.elementor-element-5a71419{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--background-transition:0.3s;}.elementor-10639 .elementor-element.elementor-element-4b0398f{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--background-transition:0.3s;--padding-top:80px;--padding-bottom:80px;--padding-left:0px;--padding-right:0px;}.elementor-10639 .elementor-element.elementor-element-5e13dd1{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--background-transition:0.3s;}.elementor-10639 .elementor-element.elementor-element-f8c47ff > .elementor-widget-container{padding:9px 9px 9px 9px;border-style:solid;border-width:1px 1px 1px 1px;border-radius:30px 30px 30px 30px;}.elementor-10639 .elementor-element.elementor-element-0e680c3{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--background-transition:0.3s;}.elementor-10639 .elementor-element.elementor-element-a20f59e{--display:flex;--background-transition:0.3s;}.elementor-10639 .elementor-element.elementor-element-21ab1f2{--display:flex;--background-transition:0.3s;border-style:solid;--border-style:solid;border-width:1px 1px 1px 1px;--border-top-width:1px;--border-right-width:1px;--border-bottom-width:1px;--border-left-width:1px;border-color:#DFDFDF;--border-color:#DFDFDF;--border-radius:10px 10px 0px 0px;}.elementor-10639 .elementor-element.elementor-element-21ab1f2, .elementor-10639 .elementor-element.elementor-element-21ab1f2::before{--border-transition:0.3s;}.elementor-10639 .elementor-element.elementor-element-b48a9ce{--display:flex;--background-transition:0.3s;border-style:solid;--border-style:solid;border-width:1px 1px 1px 1px;--border-top-width:1px;--border-right-width:1px;--border-bottom-width:1px;--border-left-width:1px;border-color:#DFDFDF;--border-color:#DFDFDF;}.elementor-10639 .elementor-element.elementor-element-b48a9ce, .elementor-10639 .elementor-element.elementor-element-b48a9ce::before{--border-transition:0.3s;}.elementor-10639 .elementor-element.elementor-element-ebf908b{--display:flex;--background-transition:0.3s;border-style:solid;--border-style:solid;border-width:1px 1px 1px 1px;--border-top-width:1px;--border-right-width:1px;--border-bottom-width:1px;--border-left-width:1px;border-color:#DFDFDF;--border-color:#DFDFDF;}.elementor-10639 .elementor-element.elementor-element-ebf908b, .elementor-10639 .elementor-element.elementor-element-ebf908b::before{--border-transition:0.3s;}.elementor-10639 .elementor-element.elementor-element-32e5fe8{--display:flex;--background-transition:0.3s;border-style:solid;--border-style:solid;border-width:1px 1px 1px 1px;--border-top-width:1px;--border-right-width:1px;--border-bottom-width:1px;--border-left-width:1px;border-color:#DFDFDF;--border-color:#DFDFDF;}.elementor-10639 .elementor-element.elementor-element-32e5fe8, .elementor-10639 .elementor-element.elementor-element-32e5fe8::before{--border-transition:0.3s;}.elementor-10639 .elementor-element.elementor-element-020dfc4{--display:flex;--background-transition:0.3s;border-style:solid;--border-style:solid;border-width:1px 1px 1px 1px;--border-top-width:1px;--border-right-width:1px;--border-bottom-width:1px;--border-left-width:1px;border-color:#DFDFDF;--border-color:#DFDFDF;}.elementor-10639 .elementor-element.elementor-element-020dfc4, .elementor-10639 .elementor-element.elementor-element-020dfc4::before{--border-transition:0.3s;}.elementor-10639 .elementor-element.elementor-element-3da3621{--display:flex;--background-transition:0.3s;border-style:solid;--border-style:solid;border-width:1px 1px 1px 1px;--border-top-width:1px;--border-right-width:1px;--border-bottom-width:1px;--border-left-width:1px;border-color:#DFDFDF;--border-color:#DFDFDF;}.elementor-10639 .elementor-element.elementor-element-3da3621, .elementor-10639 .elementor-element.elementor-element-3da3621::before{--border-transition:0.3s;}.elementor-10639 .elementor-element.elementor-element-0cd6b89{--display:flex;--background-transition:0.3s;border-style:solid;--border-style:solid;border-width:1px 1px 1px 1px;--border-top-width:1px;--border-right-width:1px;--border-bottom-width:1px;--border-left-width:1px;border-color:#DFDFDF;--border-color:#DFDFDF;}.elementor-10639 .elementor-element.elementor-element-0cd6b89, .elementor-10639 .elementor-element.elementor-element-0cd6b89::before{--border-transition:0.3s;}.elementor-10639 .elementor-element.elementor-element-510ee5a{--display:flex;--background-transition:0.3s;border-style:solid;--border-style:solid;border-width:1px 1px 1px 1px;--border-top-width:1px;--border-right-width:1px;--border-bottom-width:1px;--border-left-width:1px;border-color:#DFDFDF;--border-color:#DFDFDF;}.elementor-10639 .elementor-element.elementor-element-510ee5a, .elementor-10639 .elementor-element.elementor-element-510ee5a::before{--border-transition:0.3s;}.elementor-10639 .elementor-element.elementor-element-db29b87{--display:flex;--background-transition:0.3s;border-style:solid;--border-style:solid;border-width:1px 1px 1px 1px;--border-top-width:1px;--border-right-width:1px;--border-bottom-width:1px;--border-left-width:1px;border-color:#DFDFDF;--border-color:#DFDFDF;}.elementor-10639 .elementor-element.elementor-element-db29b87, .elementor-10639 .elementor-element.elementor-element-db29b87::before{--border-transition:0.3s;}.breadcrumb-wrap .breadcrumb-overlay, .elementor-page-10639 .breadcrumb-wrap .breadcrumb-overlay{opacity:0.5;}@media(min-width:768px){.elementor-10639 .elementor-element.elementor-element-4b0398f{--width:95%;}.elementor-10639 .elementor-element.elementor-element-5e13dd1{--width:80%;}.elementor-10639 .elementor-element.elementor-element-0e680c3{--width:50%;}}/* Start custom CSS for html, class: .elementor-element-f8c47ff */<style>
    /********************************************************
     * Basic Reset & Body
     ********************************************************/
    body {
      background: #f3f3f3;
      padding: 20px;
      font-family: Arial, sans-serif;
    }
    /********************************************************
     * Container
     ********************************************************/
    .container {
      display: flex;
      flex-wrap: wrap;
      gap: 20px;
      max-width: 1200px;
      margin: 0 auto;
    }
    /********************************************************
     * Calculator Panel (Left)
     ********************************************************/
    .calculator {
      background: #fff;
      flex: 1 1 350px;
      min-width: 300px;
      padding: 20px;
      border-radius: 8px;
      box-shadow: 0 0 5px rgba(0,0,0,0.1);
    }
    .calculator h1 {
      font-size: 1.3rem;
      margin-bottom: 20px;
      text-align: center;
    }
    .input-group {
      margin-bottom: 20px;
    }
    .input-label {
      display: flex;
      justify-content: space-between;
      margin-bottom: 5px;
      font-weight: bold;
      color: #333;
    }
    .input-group input[type="number"],
    .input-group input[type="range"] {
      width: 100%;
      padding: 8px;
      border: 1px solid #ddd;
      border-radius: 4px;
      margin-bottom: 8px;
      box-sizing: border-box;
    }
    /********************************************************
     * Summary Panel (Right)
     ********************************************************/
    .summary {
      background: #fff;
      flex: 1 1 300px;
      min-width: 300px;
      padding: 20px;
      border-radius: 8px;
      box-shadow: 0 0 5px rgba(0,0,0,0.1);
    }
    .summary h2 {
      font-size: 1.2rem;
      margin-bottom: 20px;
      text-align: center;
    }
    .summary-details {
      margin-bottom: 20px;
    }
    .summary-row {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 10px;
      font-size: 0.95rem;
      color: #333;
    }
    /* Updated numbers color to black */
    .summary-row strong {
      font-weight: bold;
      color: #000;
    }
    .chart-container {
      width: 100%;
      max-width: 300px;
      height: auto;
      margin: 20px auto 0;
    }
    /********************************************************
     * Responsive
     ********************************************************/
    @media (max-width: 768px) {
      .container {
        flex-direction: column;
      }
    }
  </style>/* End custom CSS */