/* Savings fee-impact calculator — page styles (editorial cream/ink/gold) */
.tool-head{padding:40px 0 8px}
.tool-head .eyebrow{font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);font-weight:600;margin-bottom:10px}
.tool-head h1{font-family:var(--font-head);font-weight:600;font-size:clamp(1.9rem,3.6vw,2.7rem);line-height:1.1;color:var(--ink);margin:0 0 8px}
.tool-head .sub{font-size:1.02rem;max-width:54ch}
.tool{display:grid;grid-template-columns:320px 1fr;gap:28px;align-items:start;padding:26px 0 8px}
.controls{background:var(--warm-white,#FFFDF8);border:1px solid var(--hair);border-radius:8px;padding:18px 18px 6px}
.ctl{margin-bottom:16px}
.ctl label{display:flex;justify-content:space-between;font-size:.82rem;font-weight:600;color:var(--ink);margin-bottom:6px}
.ctl label .val{color:var(--gold);font-variant-numeric:tabular-nums}
.ctl input[type=range]{width:100%;accent-color:var(--gold)}
.assum{border-top:1px solid var(--hair);margin-top:6px;padding-top:12px}
.assum .lab{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:600;margin-bottom:10px}
.chart-wrap{position:relative;width:100%;background:var(--warm-white,#FFFDF8);border:1px solid var(--hair);border-radius:8px;padding:10px 12px}
.legend{display:flex;gap:16px;flex-wrap:wrap;font-size:.78rem;color:var(--text);margin:2px 4px 6px}
.legend i{display:inline-block;width:12px;height:3px;border-radius:2px;margin-right:6px;vertical-align:middle}
#chart{display:block;width:100%;height:auto}
.grid{stroke:var(--hair);stroke-width:1}
.axis{fill:var(--muted);font-size:11px}
.lineLow{fill:none;stroke:var(--gold-2);stroke-width:2.5}
.lineHigh{fill:none;stroke:var(--ink);stroke-width:2}
.gap{fill:var(--gold);opacity:.13}
.endlab{font-family:var(--font-head);font-size:13px}
.cross{stroke:var(--muted);stroke-dasharray:3 3;stroke-width:1}
.tip{font-size:11.5px}
.results{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:14px}
.card{background:var(--warm-white,#FFFDF8);border:1px solid var(--hair);border-radius:8px;padding:12px 14px}
.card .k{font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:600}
.card .n{font-family:var(--font-head);font-size:1.5rem;color:var(--ink);margin-top:4px;font-variant-numeric:tabular-nums}
.card.hl{background:#1c1a14;border-color:#1c1a14}
.card.hl .k{color:#C9A24A}.card.hl .n{color:var(--cream-text,#F1ECDE)}
.headline{font-size:1.02rem;margin:18px 0 0;color:var(--ink)}.headline b{color:var(--gold)}
.cta{margin:22px 0 6px;background:var(--surface,#EFEADD);border:1px solid var(--hair);border-radius:8px;padding:18px;display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.cta p{margin:0;flex:1;min-width:220px;font-size:.92rem}
.cta form{display:flex;gap:8px}
.cta input{border:1px solid var(--ink);background:var(--warm-white,#FFFDF8);border-radius:4px;padding:10px 13px;font:inherit;font-size:.88rem}
.disclaimer{font-size:.74rem;color:var(--muted);margin:14px 0 60px;max-width:70ch}
@media (max-width:820px){ .tool{grid-template-columns:1fr} }
.tool-teaser{display:block;background:#1c1a14;border-radius:10px;padding:30px 32px;color:var(--cream-text,#F1ECDE)}
.tool-teaser h3{font-family:var(--font-head);font-weight:600;font-size:1.5rem;color:#fff;margin:.3rem 0 .4rem}
.tool-teaser p{margin:0;max-width:60ch;color:#d8d2c4}
.tool-teaser .eyebrow-gold{color:#C9A24A}
/* MailerLite signup: honeypot + status message */
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.ml-status{margin-top:10px;font-size:.85rem;font-weight:600}
.ml-status.ok{color:var(--gold)}
.ml-status.err{color:#9a3b2e}
/* 50/30/20 budget calculator — stacked bar + AI prompt box */
.bbar{display:flex;width:100%;height:48px;border-radius:8px;overflow:hidden;border:1px solid var(--hair);margin:6px 0 8px}
.bseg{display:flex;align-items:center;justify-content:center;color:#fff;font-weight:600;font-size:.8rem;font-variant-numeric:tabular-nums;min-width:0;white-space:nowrap;transition:width .15s ease}
.bseg.needs{background:#16140F}
.bseg.wants{background:#6b5e44}
.bseg.savings{background:var(--gold,#B8923E);color:#16140F}
.blabels{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:.78rem;color:var(--muted);margin-bottom:8px}
.blabels b{color:var(--ink);font-weight:600}
.ai-prompt-box{margin:20px 0 6px;background:#1c1a14;border-radius:8px;padding:14px 16px}
.ai-prompt-box .lab{font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:#C9A24A;font-weight:600;margin-bottom:8px}
.ai-prompt-box textarea{width:100%;box-sizing:border-box;background:#26231b;color:#F1ECDE;border:1px solid #3a3526;border-radius:6px;padding:10px 12px;font:inherit;font-size:.82rem;line-height:1.45;resize:vertical;min-height:96px}
.ai-prompt-box .row{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:10px;flex-wrap:wrap}
.ai-prompt-box .row a{color:#C9A24A;font-size:.82rem}
.btn-copy{background:var(--gold,#B8923E);color:#16140F;border:0;border-radius:5px;padding:9px 16px;font:inherit;font-weight:600;font-size:.82rem;cursor:pointer}
.ctl select{width:100%;border:1px solid var(--ink);background:var(--warm-white,#FFFDF8);border-radius:4px;padding:9px 11px;font:inherit;font-size:.86rem;color:var(--ink)}