/* Default design. Elementor ke Style tab ki settings in sab ko override karti hain. */
.roic{
  --roic-navy:#0b2a5b;--roic-fill:#6fcf3f;--roic-track:#e3e8ef;--roic-line:#eef1f5;
  --roic-left:65%;--roic-label-w:150px;--roic-box-w:90px;
  --roic-track-h:3px;--roic-track-r:3px;
  --roic-thumb:14px;--roic-thumb-bg:#fff;--roic-thumb-border:var(--roic-navy);--roic-thumb-bw:2px;--roic-thumb-r:50%;
  display:grid;grid-template-columns:minmax(0,var(--roic-left)) minmax(0,1fr);gap:18px;
  font-family:'Montserrat',sans-serif;color:var(--roic-navy);box-sizing:border-box;margin:0 auto}
.roic *{box-sizing:border-box}

/* Cards */
.roic .roic-card{background-color:#fff;border-radius:14px;padding:22px}

/* Rows */
.roic .roic-row{display:grid;grid-template-columns:var(--roic-label-w) minmax(0,1fr) var(--roic-box-w);
  align-items:center;column-gap:14px;row-gap:8px;padding:11px 0;border-bottom:1px solid var(--roic-line)}
.roic .roic-row:last-child{border-bottom:0}
.roic .roic-row label{font-size:12px;font-weight:600;line-height:1.3;margin:0;color:inherit}

/* Value boxes */
.roic input.roic-box{width:100%;height:28px;min-height:0;margin:0;border:1px solid var(--roic-line);border-radius:5px;
  text-align:right;padding:0 8px;font-family:inherit;font-size:12px;font-weight:700;color:var(--roic-navy);
  background-color:#fff;outline:none;box-shadow:none}
.roic input.roic-box:focus{border-color:var(--roic-fill)}

/* Slider */
.roic input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:var(--roic-track-h);
  border-radius:var(--roic-track-r);background:var(--roic-track);outline:none;margin:0;padding:0;border:0;cursor:pointer}
.roic input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;
  width:var(--roic-thumb);height:var(--roic-thumb);border-radius:var(--roic-thumb-r);
  background:var(--roic-thumb-bg);border:var(--roic-thumb-bw) solid var(--roic-thumb-border);cursor:pointer}
.roic input[type=range]::-moz-range-thumb{box-sizing:border-box;width:var(--roic-thumb);height:var(--roic-thumb);
  border-radius:var(--roic-thumb-r);background:var(--roic-thumb-bg);border:var(--roic-thumb-bw) solid var(--roic-thumb-border);cursor:pointer}
.roic input[type=range]::-moz-range-track{background:transparent;border:0}

/* Result card */
.roic .roic-result{display:flex;flex-direction:column}
.roic .roic-big{font-size:38px;font-weight:800;line-height:1.1;margin:0;color:inherit;word-break:break-word}
.roic .roic-sub{font-size:12px;font-weight:700;margin:10px 0 12px}
.roic .roic-line{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:13px 0;
  border-top:1px solid var(--roic-line)}
.roic .roic-line span{font-size:11px;font-weight:500}
.roic .roic-line strong{font-size:15px;font-weight:800}

/* Button */
.roic a.roic-btn{margin-top:auto;display:block;text-align:center;background-color:var(--roic-fill);color:var(--roic-navy);
  font-family:inherit;font-weight:700;font-size:12px;padding:11px 20px;border-radius:30px;text-decoration:none;
  transition:background-color .2s,color .2s,border-color .2s,filter .2s}
.roic a.roic-btn:hover{filter:brightness(.96)}

/* Mobile */
@media(max-width:767px){
  .roic{grid-template-columns:minmax(0,1fr)}
  .roic .roic-row{grid-template-columns:minmax(0,1fr) var(--roic-box-w)}
  .roic .roic-row label{grid-column:1/-1}
  .roic a.roic-btn{margin-top:20px}
}