/* Tools index + SROI wizard — Tammy UX sketch 16 Oct 2026 */
.tools-lead{font-family:var(--sans);font-size:17px;color:var(--muted);max-width:36rem;margin:0 0 28px}
.tools-privacy{font-family:var(--sans);font-size:14px;color:var(--muted);margin-top:32px;padding-top:16px;border-top:1px solid var(--line)}

.tools-cards{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:8px 0 24px;list-style:none;padding:0}
@media (max-width:767px){.tools-cards{grid-template-columns:1fr}}

.tool-card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:22px 22px 18px;display:flex;flex-direction:column;min-height:200px}
.tool-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:8px}
.tool-card h2{font-family:var(--serif);font-size:24px;margin:0;letter-spacing:-.02em;border:0;padding:0}
.tool-card p{font-family:var(--sans);font-size:15px;line-height:1.45;color:var(--muted);margin:0 0 16px;flex:1}
.tool-badge{font-family:var(--sans);font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:none;color:var(--warm);background:#faf4ef;border:1px solid #e8d5c4;border-radius:999px;padding:4px 10px;white-space:nowrap;flex-shrink:0}
.tool-card .tool-cta{align-self:flex-end;margin-top:auto}
@media (max-width:767px){.tool-card .tool-cta{align-self:stretch;width:100%;text-align:center}}

/* Buttons — readiness pattern */
.btn{appearance:none;box-sizing:border-box;border-radius:.5rem;padding:.7rem 1.15rem;font-family:var(--sans);font-weight:600;font-size:15px;line-height:1.25;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;text-decoration:none;min-height:44px}
.btn svg{width:15px;height:15px;flex-shrink:0;display:block}
.btn-primary{background:var(--accent);color:#fff;border:1.5px solid var(--accent)}
.btn-primary:hover{background:#154e55;color:#fff}
.btn-outline{background:transparent;color:var(--accent);border:1.5px solid var(--accent)}
.btn-outline:hover{background:var(--accent-soft)}
.btn-ghost{background:transparent;color:var(--muted);border:1.5px solid transparent}
.btn-ghost:hover{color:var(--accent);background:var(--accent-soft)}
.btn[disabled]{opacity:.45;cursor:not-allowed}

/* SROI root */
#sroi-root{max-width:var(--narrow);margin:0;font-family:var(--sans);color:var(--ink);text-align:left}
#sroi-root h1,#sroi-root h2,#sroi-root h3{font-family:var(--serif)}
#sroi-root .step-label{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--warm);margin:0 0 8px}
#sroi-root .banner-warn{background:#faf4ef;border-left:3px solid var(--warm);padding:12px 14px;margin:0 0 20px;font-size:15px;color:var(--ink)}
#sroi-root .banner-info{background:var(--accent-soft);border-left:3px solid var(--accent);padding:12px 14px;margin:0 0 20px;font-size:15px}
#sroi-root .muted{color:var(--muted);font-size:15px}
#sroi-root .soft-cta{margin:18px 0;padding:14px 16px;border:1px dashed var(--line);border-radius:8px;background:var(--card);font-size:15px}
#sroi-root .soft-cta strong{display:block;margin-bottom:4px;font-family:var(--serif);font-size:17px}

.sroi-progress{font-size:13px;color:var(--muted);margin:0 0 6px}
.sroi-nav{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;margin-top:1.5rem;padding-top:1rem;border-top:1px solid var(--line)}
.sroi-nav-right{display:flex;gap:.5rem;align-items:center;margin-left:auto;flex-wrap:wrap}

.sroi-field{margin:0 0 16px}
.sroi-field label{display:block;font-weight:600;font-size:14px;margin:0 0 6px}
.sroi-field .hint{display:block;font-weight:400;font-size:13px;color:var(--muted);margin-top:4px}
.sroi-field input[type=text],
.sroi-field input[type=number],
.sroi-field select,
.sroi-field textarea{
  width:100%;max-width:100%;padding:.65rem .75rem;border:1px solid var(--line);border-radius:8px;
  font:inherit;font-size:15px;background:#fff;color:var(--ink)
}
.sroi-field textarea{min-height:72px;resize:vertical}
.sroi-field sup.req{color:#b42318;font-weight:700;margin-left:1px}
.sroi-field.need input,
.sroi-field.need select,
.sroi-field.need textarea,
.sroi-unit-check.need{
  border-color:#b42318;
  outline:2px solid #b42318;
  outline-offset:1px;
}
.sroi-field.need input:focus,
.sroi-field.need input:focus-visible,
.sroi-field.need select:focus,
.sroi-field.need select:focus-visible,
.sroi-field.need textarea:focus,
.sroi-field.need textarea:focus-visible{
  border-color:#b42318;
  outline:2px solid #b42318;
  outline-offset:1px;
}
.sroi-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:560px){.sroi-row{grid-template-columns:1fr}}
.sroi-split{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
@media (min-width:560px){.sroi-split{grid-template-columns:repeat(4,1fr)}}

.chip-row{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0}
.chip{appearance:none;border:1.5px solid var(--line);background:var(--card);border-radius:999px;padding:8px 14px;font-family:var(--sans);font-size:13px;font-weight:600;cursor:pointer;color:var(--ink);min-height:44px}
.chip[aria-pressed=true],.chip.is-on{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}

.outcome-card{border:1px solid var(--line);border-radius:10px;padding:14px;margin:0 0 12px;background:var(--card)}
.outcome-card-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px}
.outcome-card-head strong{font-size:14px}
#sroi-status{margin:-8px 0 16px;font-size:15px;line-height:1.45}
#sroi-status.is-ready{font-weight:600;color:var(--ink)}
#sroi-status.is-wait{font-weight:500;color:var(--muted)}
details.sroi-adjust{margin:4px 0 12px;border:1px solid var(--line);border-radius:10px;background:#fff;padding:0}
details.sroi-adjust[hidden]{display:none}
details.sroi-adjust summary{cursor:pointer;padding:10px 12px;font-weight:600;font-size:14px;list-style:none}
details.sroi-adjust summary::-webkit-details-marker{display:none}
details.sroi-adjust[open] summary{border-bottom:1px solid var(--line)}
.sroi-adjust-body{padding:12px 12px 4px}
.sroi-unit-check{margin:0 0 12px}
.sroi-unit-check[hidden]{display:none}
.sroi-unit-check .check{font-weight:600;font-size:14px}
.proxy-meta{font-size:12px;color:var(--muted);margin:6px 0 12px;line-height:1.45}
.proxy-meta p{margin:0 0 4px}
.proxy-meta a{word-break:break-all}
.verify-flag{color:var(--warm);font-weight:700}

.result-hero{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:16px 0 20px}
@media (max-width:560px){.result-hero{grid-template-columns:1fr}}
.result-stat{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:16px}
.result-stat .lbl{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:0 0 6px}
.result-stat .val{font-family:var(--serif);font-size:clamp(22px,5.2vw,28px);font-weight:600;letter-spacing:-.02em;margin:0;color:var(--ink);font-variant-numeric:tabular-nums;overflow-wrap:anywhere;line-height:1.15}
.result-stat .sub{font-size:13px;color:var(--muted);margin:6px 0 0}

details.trail{margin:20px 0;border:1px solid var(--line);border-radius:10px;background:var(--card);padding:0}
details.trail summary{cursor:pointer;padding:14px 16px;font-weight:700;font-size:15px;list-style:none}
details.trail summary::-webkit-details-marker{display:none}
details.trail[open] summary{border-bottom:1px solid var(--line)}
.trail-body{padding:12px 16px 16px;font-size:14px}
.trail-body table{width:100%;border-collapse:collapse;font-size:13px}
.trail-body th,.trail-body td{text-align:left;padding:6px 8px 6px 0;border-bottom:1px solid var(--line);vertical-align:top}
.trail-body th{color:var(--muted);font-size:11px;letter-spacing:.06em;text-transform:uppercase}

.disclaimer-block{margin:24px 0 0;padding:14px 16px;background:#faf4ef;border-radius:8px;font-size:14px;color:var(--ink)}
.disclaimer-block ul{margin:8px 0 0;padding-left:1.2em}
.disclaimer-block li{margin:4px 0}
.method-links{font-size:14px;margin:16px 0;color:var(--muted)}

.landing-actions{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.25rem;align-items:center}

#sroi-root .sroi-print-footer,
#sroi-root .sroi-print-record{display:none}

@media print{
  body.page-tools-sroi,
  body.page-tools-sroi main.wrap{
    display:block!important;
    margin:0!important;
    padding:0!important;
    height:auto!important;
    max-width:none!important;
    width:auto!important;
  }
  #sroi-root{
    display:block!important;
    visibility:visible!important;
    position:static!important;
    max-width:none!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    height:auto!important;
    overflow:visible!important;
    font-family:var(--sans),system-ui,sans-serif;
    font-size:10.5pt;
    line-height:1.4;
    color:#17202e!important;
    text-align:left;
    background:#fff!important;
  }
  #sroi-root .sroi-nav,
  #sroi-root .sroi-progress,
  #sroi-root .sroi-screen,
  #sroi-root > h1,
  #sroi-root .sroi-lead,
  #sroi-root .sroi-privacy,
  #sroi-root .no-print{
    display:none!important;
  }
  #sroi-root .sroi-section{margin:0}
  #sroi-root .step-label{
    display:block!important;
    font-size:9pt;
    font-weight:700;
    letter-spacing:.12em;
    text-transform:uppercase;
    color:#4e5868!important;
    margin:0 0 4pt;
  }
  #sroi-root #sroi-result h2{
    font-family:var(--serif),Georgia,serif;
    font-size:18pt;
    line-height:1.2;
    letter-spacing:-.02em;
    margin:0 0 6pt;
    color:#17202e;
    font-weight:600;
  }
  #sroi-root h3{
    font-family:var(--serif),Georgia,serif;
    font-size:12pt;
    margin:12pt 0 4pt;
    page-break-after:avoid;
    break-after:avoid;
  }
  #sroi-root .muted,
  #sroi-root .sroi-qa-meta,
  #sroi-root .sroi-qa-intro{
    color:#4e5868!important;
    font-size:9pt;
  }
  #sroi-root .banner-warn{
    background:#faf4ef!important;
    border-left:3px solid var(--warm,#8d4b2a);
    font-size:9pt;
    padding:8pt 10pt;
    margin:0 0 10pt;
    -webkit-print-color-adjust:exact;
    print-color-adjust:exact;
    break-inside:avoid;
    page-break-inside:avoid;
  }
  #sroi-root .banner-info{
    background:#eef3f8!important;
    border-left:3px solid #3d5a80;
    font-size:9.5pt;
    padding:8pt 10pt;
    margin:0 0 10pt;
    -webkit-print-color-adjust:exact;
    print-color-adjust:exact;
    break-inside:avoid;
    page-break-inside:avoid;
  }
  #sroi-root .result-hero,
  #sroi-root .result-hero.wide{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:8pt;
    margin:8pt 0 10pt;
  }
  #sroi-root .result-stat{
    padding:8pt 10pt;
    border:1px solid #d4cec3;
    border-radius:6pt;
    background:#fffcf8!important;
    break-inside:avoid;
    page-break-inside:avoid;
    -webkit-print-color-adjust:exact;
    print-color-adjust:exact;
  }
  #sroi-root .result-stat .lbl{font-size:8pt;color:#4e5868!important;margin:0 0 3pt}
  #sroi-root .result-stat .val{font-size:14pt;line-height:1.15}
  #sroi-root .result-stat .sub{font-size:8pt;color:#4e5868!important}
  #sroi-root .live-block{margin:8pt 0}
  #sroi-root .bar-line{
    display:grid!important;
    grid-template-columns:32mm minmax(0,1fr) auto!important;
    gap:6pt;
    break-inside:avoid;
    page-break-inside:avoid;
    font-size:9pt;
    margin:3pt 0;
  }
  #sroi-root .bar-track{
    height:7pt;
    background:#e8e2d8!important;
    -webkit-print-color-adjust:exact;
    print-color-adjust:exact;
  }
  #sroi-root .bar-fill{
    background:var(--accent,#1a5f68)!important;
    -webkit-print-color-adjust:exact!important;
    print-color-adjust:exact!important;
  }
  #sroi-root .bar-fill.alt{background:var(--warm,#8d4b2a)!important}
  #sroi-root .bar-fill.neg{background:#8a3a3a!important}
  #sroi-root .sens-table{font-size:9pt;width:100%}
  #sroi-root .sens-table th,
  #sroi-root .sens-table td{padding:3pt 6pt 3pt 0;overflow-wrap:anywhere}
  #sroi-root .sens-table tr,
  #sroi-root .sens-table thead{break-inside:avoid;page-break-inside:avoid}
  #sroi-root .sens-table thead{display:table-header-group}
  #sroi-root .disclaimer-block{
    background:#faf4ef!important;
    font-size:9pt;
    margin:12pt 0 0;
    break-inside:avoid;
    page-break-inside:avoid;
    -webkit-print-color-adjust:exact;
    print-color-adjust:exact;
  }
  #sroi-root .disclaimer-block ul{font-size:9pt;margin:4pt 0 0}
  #sroi-root .method-links{font-size:9pt;color:#4e5868!important}
  #sroi-root .sroi-print-footer{
    display:block!important;
    visibility:visible!important;
    position:static!important;
    margin:14pt 0 0!important;
    padding:6pt 0 0!important;
    border-top:1px solid #cfc8bc;
    font-family:var(--sans),system-ui,sans-serif;
    font-size:8.5pt;
    color:#4e5868!important;
    background:transparent!important;
    text-align:left;
  }
  #sroi-root .sroi-print-record{
    display:block!important;
    visibility:visible!important;
    break-before:page;
    page-break-before:always;
    margin:0!important;
    padding:0!important;
  }
  #sroi-root .sroi-print-record h2{
    font-family:var(--serif),Georgia,serif;
    font-size:16pt;
    margin:0 0 4pt;
  }
  #sroi-root .sroi-qa{
    break-inside:avoid;
    page-break-inside:avoid;
    margin:0 0 7pt;
    padding:0 0 6pt;
    border-bottom:1px solid #e4ddd2;
  }
  #sroi-root .sroi-qa-q{
    font-family:var(--sans),system-ui,sans-serif;
    font-weight:600;
    font-size:10pt;
    line-height:1.35;
    margin:0 0 2pt!important;
    color:#17202e!important;
  }
  #sroi-root .sroi-qa-n{font-weight:700;color:#4e5868}
  #sroi-root .sroi-qa-a{
    font-family:var(--sans),system-ui,sans-serif;
    font-size:9.5pt;
    line-height:1.35;
    margin:0!important;
    padding:3pt 8pt;
    border-left:2.5pt solid var(--accent,#1a5f68);
    background:#f6f3ec!important;
    color:#17202e!important;
    -webkit-print-color-adjust:exact;
    print-color-adjust:exact;
  }
}

@media (max-width:400px){
  .tool-card-top{flex-wrap:wrap}
  .tool-badge{white-space:normal}
  .chip{padding:8px 12px;font-size:12px}
}

/* Impact map */
#sroi-root{max-width:none}
.sroi-section{margin:28px 0 8px}
.sroi-section h2{font-size:28px;margin:0 0 8px}
.sroi-section h3{font-size:20px;margin:16px 0 8px}
.preset-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:8px 0}
.sroi-grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.check{display:flex;align-items:center;gap:8px;font-weight:600;min-height:44px}
.check input{width:18px;height:18px;flex:0 0 auto}
.row-meta{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.pill{font-family:var(--sans);font-size:11px;font-weight:700;border-radius:999px;padding:3px 8px;border:1px solid var(--line);color:var(--muted)}
.pill.on{color:var(--accent);border-color:var(--accent);background:var(--accent-soft)}
.pill.warn{color:var(--warm);border-color:#e8d5c4;background:#faf4ef}
.live-block{margin:18px 0}
.bar-line{display:grid;grid-template-columns:minmax(8rem,13rem) minmax(0,1fr) auto;gap:8px;align-items:center;margin:5px 0;font-size:13px}
.bar-line span:first-child{line-height:1.3}
.bar-track{background:#f3f0ea;border-radius:4px;height:8px}
.bar-fill{height:8px;border-radius:4px;background:var(--accent);max-width:100%}
.bar-fill.alt{background:var(--warm)}
.bar-fill.neg{background:#8a3a3a}
.year-pair{display:flex;flex-direction:column;gap:3px}
.sens-table{width:100%;border-collapse:collapse;font-size:14px}
.sens-table th,.sens-table td{text-align:left;padding:6px 10px 6px 0;border-bottom:1px solid var(--line);vertical-align:top}
.sens-table th{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.result-hero.wide{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:900px){
  .sroi-grid-3,.result-hero.wide{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .sroi-grid-3,.result-hero.wide,.bar-line{grid-template-columns:1fr}
}