/* ROI workbench: isolated to the new homepage section. */
.roi { background:#eef1ef; border-top:1px solid var(--line); }
.roi .section-label { margin-bottom:42px; }
.roi-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:40px; margin-bottom:44px; }
.roi-heading h2 { font-size:clamp(44px,5.3vw,78px); }
.roi-heading h2 em { color:#277d96; }
.roi-heading>div { max-width:405px; font-size:14px; color:#4f5d60; }
.roi-heading>div p+p { margin-top:12px; }
.roi-example-note { display:block; font-size:9px; font-weight:650; letter-spacing:.1em; margin-top:20px; color:#305563; }
.roi-workbench { display:grid; grid-template-columns:1.08fr 1fr; border:1px solid #c8d3d2; }
.roi-assumptions { padding:34px 38px 22px; background:var(--paper); min-width:0; }
.roi-tabs { display:flex; gap:0; border-bottom:1px solid var(--line); margin-bottom:28px; }
.roi-tabs button { display:flex; flex:1; justify-content:space-between; align-items:center; gap:10px; color:#5b6b70; padding:14px 0 17px; border:0; border-bottom:3px solid transparent; background:none; font-size:14px; font-weight:600; text-align:left; }
.roi-tabs button+button { margin-left:25px; }
.roi-tabs button span { font-size:20px; font-weight:400; }
.roi-tabs button[aria-selected="true"] { border-bottom-color:var(--cyan); color:var(--ink); }
.roi-tabs button:disabled { cursor:default; }
.roi-panel-intro { color:#526368; font-size:13px; line-height:1.65; margin-bottom:22px; min-height:44px; }
.roi [hidden] { display:none!important; }
.roi-fields { padding:0; margin:0; border:0; min-width:0; }
.roi-field { margin-bottom:22px; min-width:0; }
.roi-field label { display:block; font-size:12px; font-weight:600; line-height:1.45; margin-bottom:8px; }
.roi-field small,.roi-shared-help { display:block; color:#617074; font-size:10px; line-height:1.6; margin-top:7px; }
.roi-field-pair { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.roi-number { display:flex; align-items:center; gap:8px; border-bottom:1px solid #a7b9bd; padding:5px 0 8px; }
.roi-number>span { white-space:nowrap; font-size:10px; color:#607075; }
.roi-number>span:first-child:not(:last-child) { font-size:17px; color:#456b78; }
.roi-number input { border:0; border-radius:0; color:var(--ink); background:transparent; width:100%; min-width:0; padding:0; font-size:24px; font-family:var(--display); font-weight:600; letter-spacing:-.04em; line-height:1.5; }
.roi-number input[aria-invalid="true"] { color:#a14037; }
.roi-number:focus-within { border-color:#277d96; }
.roi-number input:focus-visible { outline-offset:3px; }
.roi-range-line { display:flex; align-items:center; gap:24px; }
.roi-percent { width:85px; flex-shrink:0; }
.roi-range-line input[type="range"] { flex:1; min-width:0; width:100%; appearance:none; -webkit-appearance:none; background:transparent; accent-color:var(--cyan); height:28px; cursor:pointer; }
.roi-range-line input[type="range"]::-webkit-slider-runnable-track { height:3px; background:#b2c8cd; }
.roi-range-line input[type="range"]::-webkit-slider-thumb { -webkit-appearance:none; width:17px; height:17px; margin-top:-7px; border:3px solid var(--paper); background:#277d96; border-radius:50%; box-shadow:0 0 0 1px #277d96; }
.roi-range-line input[type="range"]::-moz-range-track { height:3px; background:#b2c8cd; }
.roi-range-line input[type="range"]::-moz-range-thumb { width:12px; height:12px; background:#277d96; border:3px solid var(--paper); border-radius:50%; box-shadow:0 0 0 1px #277d96; }
.roi-shared-help { margin-top:-15px; margin-bottom:20px; }
.roi-costs { border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.roi-costs summary,.roi-method summary { display:flex; align-items:center; justify-content:space-between; gap:20px; list-style:none; padding:14px 0; font-size:12px; font-weight:600; }
.roi-costs summary::-webkit-details-marker,.roi-method summary::-webkit-details-marker { display:none; }
.roi-costs summary span,.roi-method summary span { font-size:23px; font-weight:400; line-height:1; transition:transform .2s; }
.roi-costs[open] summary span,.roi-method[open] summary span { transform:rotate(45deg); }
.roi-costs>p { font-size:10px; margin-bottom:18px; color:#617074; }
.roi-costs .roi-field { margin-bottom:18px; }
.roi-costs .roi-number input { font-size:21px; }
.roi-input-foot { display:flex; align-items:center; justify-content:space-between; gap:15px; padding-top:15px; }
.roi-input-foot>span { font-size:8px; letter-spacing:.1em; color:#617074; }
.roi-reset { background:none; border:0; border-bottom:1px solid #a2b5bc; padding:3px 0; font-size:10px; color:#356272; }
.roi-reset span { margin-left:6px; font-size:15px; }
.roi-input-error { min-height:16px; font-size:11px; color:#a14037; margin-top:12px!important; }
.roi-result { color:var(--paper); position:relative; overflow:hidden; background:var(--ink); padding:42px 38px 28px; min-width:0; }
.roi-current-lines { position:absolute; width:115%; height:auto; top:0; left:0; pointer-events:none; opacity:.18; fill:none; stroke:var(--cyan); stroke-width:1; }
.roi-result>*:not(svg) { position:relative; }
.roi-result-top { display:flex; justify-content:space-between; gap:12px; align-items:center; font-size:9px; letter-spacing:.12em; margin-bottom:48px; color:#bfd2d7; }
.roi-live-dot { height:6px; width:6px; border-radius:50%; background:var(--cyan); box-shadow:0 0 0 4px #3fa0bd20; flex-shrink:0; }
.roi-result-label { font-size:12px; color:#c4d5d9; margin-bottom:12px; }
.roi-net { display:block; font-family:var(--display); font-size:clamp(34px,4.2vw,67px); font-weight:600; line-height:1.05; letter-spacing:-.065em; overflow-wrap:anywhere; color:#6bc0d6; font-variant-numeric:tabular-nums; }
.roi-is-negative .roi-net { color:#ecc3a9; }
.roi-result-caption { font-size:11px; line-height:1.7; color:#aebfc4; max-width:350px; min-height:38px; margin-top:16px!important; }
.roi-metrics { display:grid; grid-template-columns:1fr 1fr; gap:24px; padding:26px 0; margin-top:24px; border-top:1px solid #ffffff24; border-bottom:1px solid #ffffff24; }
.roi-metrics>div { min-width:0; }
.roi-metrics span { display:block; font-size:10px; color:#c4d5d9; margin-bottom:9px; }
.roi-metrics output { display:block; font-family:var(--display); font-weight:500; font-size:clamp(19px,2vw,29px); line-height:1.35; letter-spacing:-.045em; overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }
.roi-metrics small { display:block; font-size:9px; line-height:1.65; color:#a8bcc2; margin-top:7px; letter-spacing:0; }
.roi-metrics output small { display:inline; font-size:14px; color:var(--paper); }
.roi-breakdown { padding:20px 0 0; }
.roi-breakdown>div { display:flex; justify-content:space-between; gap:22px; margin-bottom:10px; font-size:11px; }
.roi-breakdown span { color:#aebfc4; }
.roi-breakdown output { text-align:right; white-space:nowrap; font-weight:500; font-variant-numeric:tabular-nums; }
.roi-outcome { padding:16px 0 0; font-size:11px; line-height:1.75; color:#d3e0e4; min-height:54px; }
.roi-inquire { margin-top:24px; width:100%; font-size:12px; color:var(--ink); }
.roi-inquire[aria-disabled="true"] { opacity:.5; cursor:not-allowed; }
.roi-privacy { font-size:9px; line-height:1.75; color:#aebfc4; margin-top:13px!important; }
.roi-method { border-bottom:1px solid #c8d3d2; padding:9px 0; margin-top:14px; }
.roi-method summary { font-size:11px; }
.roi-method-copy { display:grid; grid-template-columns:1fr 1fr; gap:18px 36px; padding:8px 0 20px; }
.roi-method-copy p { font-size:11px; line-height:1.8; color:#556469; margin:0; }
.roi-method-copy strong { color:var(--ink); font-weight:650; }
.roi-nojs { font-size:13px; margin-top:20px; }
.roi-nojs a { text-decoration:underline; }
@media(max-width:1050px) {
  .roi-assumptions,.roi-result { padding-left:25px; padding-right:25px; }
  .roi-field-pair { gap:15px; }
  .roi-tabs button { font-size:12px; }
  .roi-tabs button+button { margin-left:15px; }
}
@media(max-width:760px) {
  .roi-heading { display:block; margin-bottom:30px; }
  .roi-heading h2 { font-size:52px; }
  .roi-heading>div { margin-top:22px; max-width:none; font-size:13px; }
  .roi .section-label { margin-bottom:30px; }
  .roi .section-label>span:last-child { display:none; }
  .roi-workbench { display:block; }
  .roi-assumptions { padding:20px 22px 16px; }
  .roi-tabs { margin-bottom:22px; }
  .roi-tabs button { font-size:13px; }
  .roi-result { padding:29px 24px 25px; }
  .roi-result-top { margin-bottom:34px; font-size:8px; }
  .roi-net { font-size:clamp(36px,10vw,60px); }
  .roi-metrics output { font-size:25px; }
  .roi-result-caption { max-width:none; min-height:0; }
  .roi-outcome { min-height:0; }
  .roi-method-copy { display:block; }
  .roi-method-copy p+p { margin-top:16px; }
}
@media(max-width:370px) {
  .roi-assumptions,.roi-result { padding-left:16px; padding-right:16px; }
  .roi-field-pair { gap:12px; }
  .roi-field label { font-size:11px; }
  .roi-number input { font-size:21px; }
  .roi-number>span { font-size:8px; }
  .roi-tabs button { font-size:11px; }
  .roi-range-line { gap:12px; }
  .roi-metrics { gap:14px; }
  .roi-metrics output { font-size:22px; }
  .roi-breakdown>div { gap:12px; font-size:10px; }
}
@media(prefers-reduced-motion:reduce) {
  .roi-costs summary span,.roi-method summary span,.roi .button { transition:none; }
}

/* Interactive examples and the first-year value current. */
.roi-scenario-tools { margin:0 0 25px; }
.roi-presets-heading { display:flex; justify-content:space-between; gap:10px; font-size:8px; letter-spacing:.09em; color:#617074; margin-bottom:10px; }
.roi-presets-heading span:last-child { color:#356272; text-align:right; }
.roi-presets { display:flex; gap:8px; }
.roi-presets button { flex:1; min-width:0; padding:10px 5px; border:1px solid #c4d1d3; background:transparent; color:#536b73; font-size:11px; font-weight:550; transition:background .18s,border-color .18s,color .18s; }
.roi-presets button:hover:not(:disabled) { border-color:#277d96; background:#3fa0bd0d; }
.roi-presets button[aria-pressed="true"] { background:#173e4b; border-color:#173e4b; color:#fff; }
.roi-presets button[aria-pressed="true"]:hover { background:#1f5669; border-color:#1f5669; color:#fff; }
.roi-presets button:disabled { cursor:not-allowed; opacity:.5; }
.roi-scenario-tools>p { color:#617074; font-size:10px; line-height:1.65; margin-top:9px; }
.roi-break-even { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:12px 15px; margin-top:18px; padding:17px 0; border-top:1px solid #ffffff24; }
.roi-break-even>div { min-width:0; }
.roi-break-even>div>span { display:block; color:#aebfc4; font-size:8px; letter-spacing:.09em; }
.roi-break-even output { display:block; font-size:14px; color:#d4edf2; font-weight:550; margin-top:4px; }
.roi-break-even button { border:1px solid #6ea5b5; background:transparent; color:#c8e9f0; font-size:10px; line-height:1.6; padding:8px 11px; transition:background .18s; }
.roi-break-even button span { font-size:15px; margin-left:6px; }
.roi-break-even button:hover:not(:disabled) { background:#3fa0bd24; }
.roi-break-even button:disabled { opacity:.45; cursor:not-allowed; }
.roi-break-even>p { width:100%; color:#aebfc4; font-size:9px; line-height:1.65; margin:0; }
.roi-projection { border-top:1px solid #ffffff24; border-bottom:1px solid #ffffff24; padding:0 0 10px; }
.roi-projection summary { display:flex; align-items:center; justify-content:space-between; list-style:none; padding:14px 0; font-size:11px; color:#d4e7ec; font-weight:500; }
.roi-projection summary::-webkit-details-marker { display:none; }
.roi-projection summary span { font-size:20px; line-height:1; transition:transform .18s; }
.roi-projection[open] summary span { transform:rotate(45deg); }
.roi-month-readout { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:baseline; gap:6px 15px; }
.roi-month-readout>span { font-size:8px; letter-spacing:.07em; color:#aebfc4; }
.roi-month-readout output { font-family:var(--display); font-size:19px; line-height:1.5; letter-spacing:-.04em; color:#9fdbea; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.roi-chart { width:100%; height:auto; display:block; margin:8px 0 0; touch-action:pan-y; overflow:visible; }
.roi-chart-zero { stroke:#ffffff40; stroke-width:1; stroke-dasharray:4 4; }
.roi-chart text { fill:#aebfc4; font-family:var(--sans); font-size:10px; }
.roi-curve { fill:none; stroke:#6bc0d6; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:1; stroke-dashoffset:0; }
.roi-is-negative .roi-curve { stroke:#ecc3a9; }
.roi-chart-marker { fill:var(--ink); stroke:#d3edf3; stroke-width:2.5; }
.roi-chart-crossing { fill:var(--ink); stroke:#6bc0d6; stroke-width:1.5; }
.roi-chart-axis { display:flex; justify-content:space-between; font-size:8px; letter-spacing:.08em; color:#aebfc4; }
.roi-month-slider { width:100%; display:block; margin:13px 0 9px; accent-color:#6bc0d6; height:22px; cursor:pointer; }
.roi-projection>p { font-size:9px; color:#aebfc4; line-height:1.65; margin:7px 0 0; }
.roi-result-top { margin-bottom:34px; }
@media(max-width:760px) {
  .roi-presets button { padding:11px 4px; }
  .roi-break-even output { font-size:14px; }
  .roi-chart { max-height:190px; }
}
@media(max-width:370px) {
  .roi-presets { gap:5px; }
  .roi-presets button { font-size:10px; }
  .roi-presets-heading { font-size:7px; }
  .roi-month-readout { display:block; }
  .roi-month-readout output { display:block; }
}
@media(prefers-reduced-motion:reduce) {
  .roi-presets button,.roi-break-even button,.roi-projection summary span { transition:none; }
}
