/* Funnel planner — reuses tokens and fonts from ../../styles.css */
.planner-hero{padding:70px 0 44px;border-bottom:1px solid var(--line)}
.planner-hero h1{font-size:clamp(40px,5vw,64px);max-width:900px}
.planner-hero p{margin-top:24px;max-width:700px;font-size:16px;line-height:1.85}
.planner{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:60px;padding-block:56px;align-items:start}
.planner-form{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:30px}
.field+.field{margin-top:24px}
.field label,.summary label{display:block;font-size:14px;font-weight:700;color:var(--navy);line-height:1.5;margin-bottom:9px}
.field input,.summary textarea{width:100%;font:inherit;font-size:16px;color:var(--navy);background:#fff;border:1px solid #b9cad8;border-radius:7px;padding:12px 14px}
.field input:focus-visible,.summary textarea:focus-visible{outline:3px solid var(--teal);outline-offset:2px}
.field input[aria-invalid=true]{border-color:#b3412e}
.percent-input{position:relative}
.percent-input input{padding-right:38px}
.percent-input span{position:absolute;right:14px;top:50%;transform:translateY(-50%);color:var(--muted);font-weight:700}
.field-help{font-size:12px;margin-top:7px}
.field-error{font-size:12px;margin-top:7px;color:#b3412e;font-weight:700}
.planner-output{min-width:0}
.planner-prompt{border:1px dashed #b5d2d1;border-radius:12px;padding:40px 30px;font:500 22px/1.35 Space,Arial,sans-serif;letter-spacing:-.03em;color:#46637a}
.result-headline{font:500 clamp(22px,2.3vw,28px)/1.3 Space,Arial,sans-serif;letter-spacing:-.035em;color:var(--navy);overflow-wrap:anywhere}
.funnel{list-style:none;margin:30px 0 0;padding:0;display:flex;flex-direction:column;align-items:center}
.funnel-row{display:flex;justify-content:space-between;align-items:baseline;gap:6px 16px;flex-wrap:wrap;padding:16px 22px;border-radius:8px;color:#fff;font-size:12px;min-width:0}
.funnel-row strong{font:500 20px/1.2 Space,Arial,sans-serif;letter-spacing:-.03em;overflow-wrap:anywhere}
.funnel-row>span{color:#c9e3ec;overflow-wrap:anywhere}
.funnel-visits{width:100%;background:var(--navy)}
.funnel-signups{width:78%;background:var(--blue)}
.funnel-customers{width:56%;background:#0c7f84}
.funnel-step{padding:8px 0;font-size:12px;font-weight:700;color:#267d7e}
.result-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 28px;margin:34px 0 0}
.result-grid>div{border-top:1px solid var(--line);padding:16px 0 18px;min-width:0}
.result-grid dt{font-size:12px;font-weight:700;color:var(--muted)}
.result-grid dd{margin:0}
.result-grid dd[data-out]{font:500 30px/1.2 Space,Arial,sans-serif;letter-spacing:-.04em;color:var(--navy);margin-top:4px;overflow-wrap:anywhere}
.result-grid .explain{font-size:12px;line-height:1.7;color:var(--muted);margin-top:6px}
.summary{margin-top:26px;padding-top:26px;border-top:1px solid var(--line)}
.summary textarea{font-size:14px;line-height:1.7;resize:vertical}
.summary .button{margin-top:12px;border:0}
.result-caveat{margin-top:24px;font-size:13px;line-height:1.8;background:#eaf5f1;border:1px solid #d5e9e1;border-radius:10px;padding:16px 20px;color:#3c5a55}
.planner-cta{display:flex;align-items:center;justify-content:space-between;gap:20px 40px;flex-wrap:wrap;padding:34px 40px;background:#eaf5f1;border:1px solid #d5e9e1;border-radius:12px}
.planner-cta p{font:500 clamp(22px,2.4vw,30px)/1.25 Space,Arial,sans-serif;letter-spacing:-.035em;color:var(--navy);max-width:620px}
.planner-explainer{padding-top:70px;max-width:none}
.planner-explainer h2{font-size:clamp(28px,3vw,38px)}
.planner-explainer p{margin-top:20px;max-width:720px;font-size:15px;line-height:1.85}
.planner-explainer+.faq{margin-top:70px}
@media(max-width:900px){.planner{grid-template-columns:1fr;gap:36px}}
@media(max-width:720px){.planner-hero{padding:44px 0 34px}.planner-hero p{font-size:15px}.planner{padding-block:36px}.planner-form{padding:22px}.planner-prompt{padding:28px 22px;font-size:19px}.funnel-signups,.funnel-customers{width:100%}.funnel-row{padding:14px 16px}.result-grid{grid-template-columns:1fr}.result-grid dd[data-out]{font-size:26px}.planner-cta{padding:26px 22px}.planner-explainer{padding-top:50px}.planner-explainer+.faq{margin-top:40px}}