:root { color-scheme:light; --paper:#f4f5f0; --white:#fff; --ink:#192a2e; --muted:#59676a; --line:#dce2dd; --green:#1b624b; --pale:#e8efe8; --orange:#e59166; --navy:#152c31; --bg:var(--paper); --panel:var(--white); --border:var(--line); --text:var(--ink); --dim:var(--muted); --accent:#a9d7bd; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:24px; }
body { margin:0; font:15px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; color:var(--ink); background:var(--paper); }
a { color:inherit; text-decoration-thickness:1px; text-underline-offset:4px; }
button,input,select { font:inherit; }
a,button,input,select { -webkit-tap-highlight-color:transparent; }
:focus-visible { outline:3px solid #e59166; outline-offset:4px; }
button { cursor:pointer; }
.container { max-width:1240px; margin:0 auto; padding:0 40px; }
.site-header { border-bottom:1px solid var(--line); }
.header-inner { min-height:88px; display:flex; justify-content:space-between; align-items:center; gap:24px; }
.brand { display:inline-flex; align-items:center; gap:10px; text-decoration:none; font-size:23px; font-weight:760; letter-spacing:-.8px; }
.brand svg { width:30px; height:30px; }
.site-nav { display:flex; flex-wrap:wrap; gap:28px; align-items:center; font-size:13px; }
.site-nav a { text-decoration:none; }
.site-nav a[aria-current="page"] { color:var(--green); font-weight:700; }
.hero { display:grid; grid-template-columns:1.5fr 1fr; gap:60px; padding-top:64px; padding-bottom:44px; align-items:end; }
.eyebrow { font-size:11px; letter-spacing:.13em; text-transform:uppercase; font-weight:750; color:var(--green); margin:0 0 16px; }
.eyebrow::before { content:""; display:inline-block; width:7px; height:7px; background:var(--green); border-radius:50%; margin-right:9px; }
h1 { font-size:clamp(36px,4.6vw,58px); line-height:1.09; letter-spacing:-2.4px; font-weight:650; margin:0; max-width:740px; }
h1 span { color:var(--green); }
.hero-copy { color:var(--muted); font-size:15px; max-width:340px; padding-bottom:4px; }
.hero-copy p { margin:0 0 18px; }
.hero-copy a { color:var(--green); font-size:13px; font-weight:650; }
.workflow { display:flex; align-items:center; gap:24px; padding-bottom:25px; font-size:12px; color:var(--muted); }
.workflow span { display:flex; align-items:center; gap:8px; }
.workflow b { width:21px; height:21px; display:grid; place-items:center; font-size:10px; color:var(--green); background:var(--pale); border-radius:50%; }
.workspace { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); border:1px solid var(--line); border-radius:18px; background:white; overflow:hidden; box-shadow:0 14px 34px #233c3210; }
.input-panel { padding:30px; }
.panel-heading { display:flex; gap:12px; align-items:center; justify-content:space-between; margin-bottom:8px; }
h2 { font-size:22px; letter-spacing:-.6px; line-height:1.25; margin:0; font-weight:650; }
.badge { color:var(--green); background:var(--pale); border-radius:4px; padding:4px 7px; font-size:10px; letter-spacing:.04em; white-space:nowrap; }
.sub { color:var(--muted); font-size:12px; margin:0 0 23px; }
.row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.field { min-width:0; margin-bottom:17px; }
label { display:block; font-size:12px; font-weight:650; margin-bottom:6px; }
.field-wrap { position:relative; }
input,select { width:100%; min-height:45px; padding:9px 12px; color:var(--ink); border:1px solid #cbd5ce; background:#fcfdfb; border-radius:7px; font-size:14px; }
input { font-variant-numeric:tabular-nums; }
.suffix { position:absolute; top:11px; right:12px; font-size:12px; color:var(--muted); pointer-events:none; }
.has-suffix input { padding-right:57px; }
input[type=number] { appearance:textfield; -moz-appearance:textfield; }
input::-webkit-inner-spin-button,input::-webkit-outer-spin-button { -webkit-appearance:none; margin:0; }
.field-help { display:block; margin-top:5px; font-size:10px; color:var(--muted); }
fieldset { border:0; border-top:1px solid var(--line); padding:18px 0 0; margin:0 0 1px; min-width:0; }
legend { padding:0 9px 0 0; font-size:10px; font-weight:750; color:var(--muted); letter-spacing:.08em; text-transform:uppercase; }
.funding-fields { grid-template-columns:1.2fr 1fr 1fr; gap:12px; }
.funding-explanation { margin:-3px 0 18px; color:var(--muted); font-size:11px; }
.form-end { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.primary { border:0; background:var(--green); color:white; padding:12px 19px; border-radius:7px; font-size:12px; font-weight:650; min-height:44px; }
.primary:hover { background:#144c3a; }
.reset { background:none; border:0; color:var(--muted); text-decoration:underline; text-underline-offset:3px; font-size:11px; min-height:44px; }
.error { background:#fff1e9; border:1px solid #ebb899; padding:10px; border-radius:6px; color:#7f3819; font-size:12px; margin:0 0 16px; }
[hidden] { display:none!important; }
.results { background:var(--navy); color:#f6f8f4; padding:31px 32px 25px; display:flex; flex-direction:column; }
.result-top { display:flex; justify-content:space-between; align-items:center; gap:14px; font-size:10px; letter-spacing:.1em; color:#bed0c7; text-transform:uppercase; }
.scenario-mark { display:inline-flex; gap:6px; align-items:center; letter-spacing:0; font-size:10px; text-transform:none; color:#cad9d2; }
.scenario-mark::before { content:""; width:5px; height:5px; border:1px solid #cad9d2; border-radius:50%; }
.result-number { display:flex; flex-wrap:wrap; gap:9px; align-items:baseline; margin-top:30px; }
#total { font-size:clamp(38px,4vw,55px); line-height:1.1; letter-spacing:-2px; font-weight:600; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.currency { font-size:12px; color:#becdc5; }
#net-label { margin:7px 0 3px; font-size:13px; }
#cost-share { font-size:11px; color:#bed0c7; margin:0; }
.breakdown { margin:26px 0 0; }
.breakdown>div { display:flex; justify-content:space-between; gap:18px; padding:13px 0; border-bottom:1px solid #ffffff1e; }
.breakdown dt { font-size:12px; color:#d0ddd6; }
.breakdown dt small { display:block; color:#9bb1a7; font-size:10px; margin-top:2px; }
.breakdown dd { margin:0; text-align:right; font-size:14px; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; min-width:0; }
.funding-value { color:#f3b08b; }
.result-note { margin:19px 0 16px; padding:13px; background:#ffffff08; border:1px solid #ffffff12; border-radius:7px; color:#c9d8cf; font-size:11px; }
.result-note strong { color:#f3f6f0; font-weight:600; }
.exclusions { margin-top:auto; font-size:10px; line-height:1.7; color:#adc0b6; padding-top:12px; }
.pending { padding:40px 0; color:#d0ddd6; }
.method { display:grid; grid-template-columns:1fr 2fr; gap:45px; padding:31px 0 38px; border-bottom:1px solid var(--line); }
.method h2 { font-size:14px; letter-spacing:0; margin-bottom:7px; }
.method p { font-size:11px; color:var(--muted); margin:0; }
.method-details { font-size:12px; color:var(--muted); }
.formula { font-family:ui-monospace,SFMono-Regular,Consolas,monospace; color:var(--ink); font-size:11px; margin:0 0 9px!important; background:#e9ede7; padding:10px 12px; border-radius:5px; }
.explore { padding:39px 0 54px; }
.section-heading { display:flex; justify-content:space-between; align-items:baseline; gap:20px; margin-bottom:22px; }
.section-heading h2 { font-size:22px; }
.section-heading span { color:var(--muted); font-size:11px; }
.cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.card { border:1px solid var(--line); border-radius:11px; padding:22px; background:#f9faf6; }
.card-number { font-family:ui-monospace,monospace; color:var(--green); font-size:11px; display:block; margin-bottom:20px; }
.card h3 { font-size:17px; font-weight:650; letter-spacing:-.3px; margin:0 0 8px; }
.card p { color:var(--muted); font-size:12px; margin:0 0 19px; }
.card-state { font-size:10px; color:var(--green); border-top:1px solid var(--line); padding-top:13px; }
footer { border-top:1px solid var(--line); padding:24px 0 32px; }
.footer-inner { display:flex; justify-content:space-between; gap:24px; font-size:10px; color:var(--muted); }
.footer-inner strong { color:var(--ink); font-size:12px; }
.footer-inner p { margin:0; max-width:580px; }
@media(max-width:900px) {
  .container { padding:0 25px; }
  .hero { gap:30px; padding-top:44px; }
  .hero-copy { font-size:13px; }
  .input-panel { padding:24px; }
  .results { padding:25px; }
  .workspace { grid-template-columns:1.25fr 1fr; }
  .funding-fields { grid-template-columns:1fr 1fr; }
  .funding-fields .field:first-child { grid-column:1/-1; }
}
@media(max-width:680px) {
  .container { padding:0 18px; }
  .header-inner { min-height:77px; flex-wrap:wrap; gap:12px; padding-top:16px; padding-bottom:16px; }
  .brand { font-size:21px; }
  .site-nav { gap:18px; font-size:11px; }
  .hero { grid-template-columns:1fr; gap:21px; padding-top:35px; padding-bottom:27px; }
  h1 { font-size:42px; letter-spacing:-1.7px; }
  .hero-copy { max-width:none; font-size:14px; }
  .hero-copy p { margin-bottom:11px; }
  .eyebrow { font-size:10px; margin-bottom:13px; }
  .workflow { gap:13px; font-size:10px; flex-wrap:wrap; padding-bottom:18px; }
  .workflow span { gap:5px; }
  .workspace { grid-template-columns:1fr; border-radius:13px; }
  .input-panel { padding:23px 19px; }
  h2 { font-size:20px; }
  .badge { font-size:9px; }
  .row { gap:12px; }
  .results { padding:26px 23px; }
  #total { font-size:51px; }
  .method { grid-template-columns:1fr; gap:15px; padding:25px 0; }
  .formula { overflow-wrap:anywhere; }
  .section-heading { display:block; }
  .section-heading span { display:block; margin-top:8px; }
  .cards { grid-template-columns:1fr; gap:13px; }
  .card { padding:21px; }
  .card-number { margin-bottom:13px; }
  .footer-inner { display:block; }
  .footer-inner p { margin-top:10px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }

/* Shared public navigation, links and article callouts. */
.brand::before { content:"↗"; display:grid; place-items:center; width:30px; height:30px; border-radius:8px; background:var(--green); color:var(--paper); font-size:21px; }
.skip-link { position:absolute; left:16px; top:-80px; z-index:10; padding:10px 16px; background:var(--navy); color:white; }
.skip-link:focus { top:10px; }
.primary:disabled { cursor:wait; opacity:.65; }
.primary { display:inline-flex; align-items:center; gap:8px; text-decoration:none; }
.card a { color:var(--green); }
.card-state { display:block; text-decoration:none; font-size:12px; font-weight:650; }
.card-state:hover { text-decoration:underline; }
.method-details p + p { margin-top:10px; }
.worked-example { border-left:2px solid var(--green); padding-left:12px; }
.reading-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; margin-top:26px; }
.reading-list a { font-size:12px; color:var(--green); }
.faq { padding-top:30px; }
.faq h2 { margin-bottom:20px; }
.faq h3 { margin:0 0 7px; font-size:14px; }
.faq p { color:var(--muted); margin:0; font-size:12px; }
.faq article { border-top:1px solid var(--line); padding:17px 0; }
.footer-inner a { color:var(--green); }
@media(max-width:680px) {
  .site-nav { width:100%; gap:10px 18px; }
  .site-nav a { min-height:28px; display:inline-flex; align-items:center; }
  .reading-list { grid-template-columns:1fr; gap:14px; }
}
