.family-planner{--ink:#142d3b;--muted:#64717a;--cream:#f6f4ef;--paper:#fffefa;--line:#dfe4df;--aqua:#ddf1eb;--teal:#08685f;--orange:#ea6b48;--dark:#102b38;--shadow:0 18px 50px rgba(15,42,53,.08)}.family-planner *{box-sizing:border-box}.family-planner{margin:0;background:var(--cream);color:var(--ink);font:16px/1.55 system-ui,sans-serif}.family-planner h1,.family-planner h2,.family-planner h3,.family-planner p{margin-top:0}.family-planner h1,.family-planner h2,.family-planner h3{font-family:system-ui,sans-serif;letter-spacing:-.045em;line-height:1.13}.family-planner a{color:inherit}.family-planner button,.family-planner input,.family-planner select{font:inherit}.family-planner .shell{max-width:1400px;margin:auto;padding-left:clamp(20px,4vw,64px);padding-right:clamp(20px,4vw,64px)}.family-planner a:focus-visible,.family-planner input:focus-visible,.family-planner select:focus-visible{outline:3px solid #e88157;outline-offset:2px}.family-planner .guide-card a:hover{color:var(--teal)}.family-planner .hero-section{padding:76px 0 52px;background:radial-gradient(circle at 77% 9%,#e5eee8 0,transparent 35%),var(--cream)}.family-planner .hero-top{display:grid;grid-template-columns:minmax(0,1fr) 245px;align-items:end;gap:68px;margin-bottom:45px}.family-planner .eyebrow,.family-planner .panel-kicker{font-size:11px;letter-spacing:.16em;font-weight:800;color:var(--teal)}.family-planner .hero-top h1{font-size:clamp(40px,5vw,74px);margin:14px 0 22px;max-width:900px}.family-planner .hero-top h1 em{font-style:normal;color:var(--teal)}.family-planner .hero-copy{font-size:17px;max-width:750px;line-height:1.65;color:#4d626a;margin:0}.family-planner .hero-aside{border-left:2px solid var(--orange);padding-left:23px;color:#38535e;font-size:14px;margin-bottom:4px}.family-planner .hero-aside strong{display:block;font-family:system-ui;font-size:15px;color:var(--ink)}.family-planner .hero-aside p{margin:8px 0 12px}.family-planner .hero-aside a{font-weight:700;color:var(--teal);text-decoration:none}.family-planner .small-rule{display:none}.family-planner .calculator{display:grid;grid-template-columns:minmax(0,1.06fr) minmax(350px,.94fr);align-items:start;gap:20px}.family-planner .input-panel,.family-planner .result-panel{border:1px solid #e0e5df;border-radius:20px;box-shadow:var(--shadow);overflow:hidden}.family-planner .input-panel{background:var(--paper);padding:28px clamp(20px,3vw,38px) 32px}.family-planner .result-panel{position:sticky;top:18px;background:var(--dark);color:white;padding:29px clamp(20px,3vw,36px) 31px}.family-planner .panel-heading,.family-planner .result-heading{display:flex;justify-content:space-between;align-items:start;gap:12px;margin-bottom:21px}.family-planner .panel-heading h2,.family-planner .result-heading h2{font-size:26px;margin:8px 0 0}.family-planner .live-dot{display:inline-flex;gap:8px;align-items:center;background:#edf8f2;border-radius:30px;padding:6px 10px;font-size:11px;color:#16705d;font-weight:700;white-space:nowrap}.family-planner .live-dot i{width:7px;height:7px;background:#38a688;border-radius:50%}.family-planner .plane-mark{font-size:35px;color:#80c4b4;line-height:1}.family-planner .result-heading .panel-kicker{color:#93cfbf}.family-planner .result-heading p{margin:5px 0 0;color:#b8d0d2;font-size:13px}.family-planner .mobile-status{display:none}.family-planner .field-grid{display:grid;gap:15px;margin-bottom:17px}.family-planner .field-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.family-planner .field-grid.thirds{grid-template-columns:repeat(3,minmax(0,1fr))}.family-planner label{display:block;position:relative;font-size:13px;font-weight:700;color:#253c47;min-width:0}.family-planner input,.family-planner select{display:block;width:100%;height:47px;margin-top:8px;border:1px solid #cdd9d7;border-radius:9px;background:#fff;color:var(--ink);padding:0 12px;font-weight:600;min-width:0}.family-planner input:hover,.family-planner select:hover{border-color:#6eaaa0}.family-planner label small{display:block;color:#72818a;font-weight:400;line-height:1.3;margin-top:6px;font-size:11px}.family-planner .unit{color:var(--muted)}.family-planner .subhead{border-top:1px solid var(--line);padding-top:23px;margin:25px 0 18px}.family-planner .subhead h2{font-size:21px;margin:6px 0 5px}.family-planner .subhead p{font-size:12px;color:#6b7b80;margin:0}.family-planner .input-error{padding:12px;background:#f9e6e2;border-radius:8px;color:#962c2c;font-size:13px;margin:18px 0 0}.family-planner .focus-result{background:#e0f3eb;color:#0e5548;border-radius:14px;padding:19px 22px;margin:0 0 18px}.family-planner .focus-result .overline{font-size:11px;font-weight:800;letter-spacing:.12em}.family-planner .focus-result strong{display:block;font:800 clamp(30px,3vw,40px) system-ui,sans-serif;letter-spacing:-.07em;line-height:1.15;margin:4px 0}.family-planner .focus-result p{font-size:12px;margin:0}.family-planner .metric-line{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:20px}.family-planner .metric{border:1px solid #3b5862;border-radius:10px;padding:11px;min-width:0}.family-planner .metric span{display:block;color:#a6bec3;font-size:11px}.family-planner .metric strong{display:block;font:800 17px system-ui,sans-serif;letter-spacing:-.04em;margin-top:4px;overflow-wrap:anywhere}.family-planner .scenario-heading{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:8px}.family-planner .scenario-heading h3{font-size:16px;margin:0}.family-planner .scenario-heading small{color:#a9c4c7}.family-planner .scenario-card{border:1px solid #405c63;background:#193b48;border-radius:12px;padding:15px;margin-bottom:9px}.family-planner .scenario-card.selected{border-color:#8cd6bb;background:#204952}.family-planner .scenario-top{display:flex;justify-content:space-between;gap:8px;align-items:start}.family-planner .scenario-top strong{font:800 15px system-ui,sans-serif}.family-planner .scenario-top small{display:block;color:#a9c3c6;font-size:11px;margin-top:2px}.family-planner .light{font-size:11px;font-weight:800;border-radius:50px;padding:5px 8px;line-height:1.25;white-space:nowrap}.family-planner .light.green{background:#d6f4de;color:#17603d}.family-planner .light.amber{background:#fff0c6;color:#775212}.family-planner .light.red{background:#ffdcd5;color:#9a352b}.family-planner .scenario-stats{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:10px;border-top:1px solid #41616b;margin-top:13px;padding-top:12px}.family-planner .scenario-stats span{display:block;color:#b2cacb;font-size:11px}.family-planner .scenario-stats b{font:800 16px system-ui,sans-serif;letter-spacing:-.04em;white-space:nowrap}.family-planner .scenario-card p{margin:10px 0 0;color:#d2e0df;font-size:11px}.family-planner .deal-box{border-top:1px solid #45606a;padding-top:18px;margin-top:18px}.family-planner .deal-box h3{font-size:16px;margin:0 0 9px}.family-planner .deal-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.family-planner .deal-grid>div{background:#254653;border-radius:9px;padding:12px}.family-planner .deal-grid span{display:block;color:#b4c8ca;font-size:11px}.family-planner .deal-grid strong{display:block;font:800 20px system-ui,sans-serif;letter-spacing:-.04em}.family-planner .deal-box p,.family-planner .result-foot{font-size:11px;color:#b9cdd0;line-height:1.5;margin:12px 0 0}.family-planner .result-foot{border-top:1px solid #45606a;padding-top:15px}.family-planner .result-foot strong{color:#fff}.family-planner .under-calculator{display:flex;gap:30px;flex-wrap:wrap;color:#6c797a;font-size:11px;padding-top:20px}.family-planner .info-section{background:#e7efe9;padding:87px 0 94px}.family-planner .section-intro{max-width:720px;margin-bottom:35px}.family-planner .section-intro h2{font-size:clamp(32px,3.4vw,49px);margin:9px 0 15px}.family-planner .section-intro>p:last-child{color:#526a6f;font-size:16px;line-height:1.65}.family-planner .program-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}.family-planner .program-card{background:#fffefa;border:1px solid #d5e1d9;border-radius:13px;padding:23px 19px;min-width:0}.family-planner .program-card.active{border-color:#168074;box-shadow:0 0 0 2px #16807422}.family-planner .program-card .program-kicker{font-size:10px;letter-spacing:.12em;font-weight:800;color:var(--teal)}.family-planner .program-card h3{font-size:20px;margin:16px 0 9px}.family-planner .program-ratio{font:800 25px system-ui;letter-spacing:-.05em;margin-bottom:5px}.family-planner .program-card p{font-size:12px;color:#697b7e;margin:0}.family-planner .program-card button{cursor:pointer;margin-top:18px;background:none;border:none;color:var(--teal);font-weight:800;font-size:12px;padding:0;text-align:left}.family-planner .program-card button:hover{text-decoration:underline}.family-planner .source-note{font-size:12px;color:#65797a;margin:22px 0 0}.family-planner .source-note a{font-weight:700}.family-planner .guide-section{background:var(--cream);padding:90px 0 85px}.family-planner .guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.family-planner .guide-card{background:var(--paper);border:1px solid var(--line);padding:28px 25px 24px;border-radius:13px;display:flex;flex-direction:column}.family-planner .guide-card>span{font-size:11px;color:var(--teal);font-weight:800;letter-spacing:.1em}.family-planner .guide-card h3{font-size:23px;margin:25px 0 12px}.family-planner .guide-card p{font-size:14px;line-height:1.6;color:#60717a;flex:1}.family-planner .guide-card a{font-size:13px;font-weight:800;text-decoration:none;color:var(--teal);margin-top:18px}.family-planner .guide-foot{margin-top:26px;font-size:13px;color:#64757a}.family-planner .guide-foot p{margin:5px 0}.family-planner .guide-foot a{color:var(--teal);font-weight:700}@media (max-width:1100px){.family-planner .calculator{grid-template-columns:minmax(0,1fr) minmax(330px,.9fr)}.family-planner .program-grid{grid-template-columns:repeat(2,1fr)}.family-planner .hero-top{gap:25px}.family-planner .hero-top h1{font-size:54px}.family-planner .scenario-stats{grid-template-columns:repeat(3,minmax(0,1fr))}.family-planner .scenario-stats b{font-size:14px}}@media (max-width:820px){.family-planner .hero-section{padding-top:43px}.family-planner .hero-top{grid-template-columns:1fr;margin-bottom:25px}.family-planner .hero-aside{display:none}.family-planner .hero-top h1{font-size:clamp(39px,7vw,58px)}.family-planner .calculator{grid-template-columns:1fr}.family-planner .result-panel{position:static}.family-planner .input-panel{padding:25px}.family-planner .guide-grid{grid-template-columns:1fr 1fr}.family-planner .mobile-status{display:flex;position:sticky;top:0;z-index:4;align-items:center;justify-content:space-between;gap:10px;background:#e0f3eb;border:1px solid #b5ddcf;border-radius:12px;color:#134d45;padding-top:9px;padding-bottom:9px;margin-bottom:13px;box-shadow:0 8px 20px #183e351b}.family-planner .mobile-status small{display:block;font-size:9px;letter-spacing:.1em;font-weight:800}.family-planner .mobile-status strong{display:block;font:800 15px system-ui,sans-serif}.family-planner .mobile-status a{font-size:11px;font-weight:800;white-space:nowrap;text-decoration:none}}@media (max-width:590px){.family-planner .hero-top h1{font-size:39px}.family-planner .hero-copy{font-size:15px}.family-planner .calculator{gap:14px}.family-planner .input-panel,.family-planner .result-panel{border-radius:15px;padding:22px 18px}.family-planner .panel-heading{align-items:start}.family-planner .panel-heading h2{font-size:23px}.family-planner .live-dot{font-size:10px}.family-planner .field-grid.two,.family-planner .field-grid.thirds{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.family-planner .field-grid.two label:nth-child(n),.family-planner .field-grid.thirds label:nth-child(3){min-width:0}.family-planner .field-grid label{font-size:12px}.family-planner .field-grid input,.family-planner .field-grid select{font-size:15px}.family-planner .field-grid.thirds label:nth-child(3){grid-column:1/-1}.family-planner .metric-line{gap:6px}.family-planner .metric{padding:8px}.family-planner .metric strong{font-size:14px}.family-planner .scenario-stats{gap:6px}.family-planner .scenario-stats b{font-size:14px}.family-planner .scenario-card{padding:13px}.family-planner .info-section,.family-planner .guide-section{padding:65px 0}.family-planner .program-grid,.family-planner .guide-grid{grid-template-columns:1fr}.family-planner .program-card{padding:20px}.family-planner .guide-card h3{margin-top:15px}.family-planner .under-calculator{gap:9px 18px}}@media (max-width:360px){.family-planner .field-grid.two,.family-planner .field-grid.thirds{grid-template-columns:1fr}.family-planner .field-grid.thirds label:nth-child(3){grid-column:auto}.family-planner .scenario-stats{grid-template-columns:1fr 1fr}.family-planner .scenario-stats>div:last-child{grid-column:1/-1}}@media (prefers-reduced-motion:reduce){}
/* Photo and colors match the site's existing calculator hero. */
.family-planner{background:#f6f4ef;color:#142d3b;display:flow-root}
.family-planner .hero-section{background:#f6f4ef;padding-top:26px}
.family-planner .hero-top{background-image:linear-gradient(90deg,rgba(7,17,31,.96),rgba(7,17,31,.86) 52%,rgba(7,17,31,.52)),url('/assets/hero/rechner.webp');background-size:cover;background-position:center;color:#fff;border-radius:18px;padding-top:35px;padding-bottom:35px;min-height:290px;align-items:center;margin-bottom:24px}
.family-planner .hero-top .eyebrow{color:#adf0df}
.family-planner .hero-top h1 em{color:#93e4c6}
.family-planner .hero-top .hero-copy,.family-planner .hero-top .hero-aside{color:#e4ebec}
.family-planner .hero-top .hero-aside strong{color:#fff}
.family-planner .hero-top .hero-aside a{color:#b8f1e1}
.family-planner #planen,.family-planner #ergebnis{scroll-margin-top:20px}
.family-planner .field-grid label{font-size:14px}
.family-planner .field-grid label small,.family-planner .subhead p,.family-planner .result-foot,.family-planner .deal-box p,.family-planner .scenario-card p{font-size:12px}
.family-planner .input-error[hidden]{display:none}
@media(max-width:820px){.family-planner .hero-top{background-image:linear-gradient(180deg,rgba(7,17,31,.92),rgba(7,17,31,.74)),url('/assets/hero/rechner.webp');background-position:center top;min-height:0}.family-planner .mobile-status{top:8px}}
@media(max-width:590px){.family-planner .hero-top{border-radius:12px;padding-top:30px;padding-bottom:30px}.family-planner .hero-top h1{font-size:clamp(32px,9vw,39px)}.family-planner .hero-top .hero-copy{font-size:15px}.family-planner .result-panel,.family-planner .input-panel{padding:22px 18px}}

.family-planner .chart-note{font-size:12px;line-height:1.55;color:#cde1e2;margin:6px 0 14px}

.family-planner .context-hint{font-size:13px;line-height:1.5;background:#edf7f2;color:#125447;border:1px solid #c3e4d7;border-radius:9px;padding:11px 13px;margin-bottom:18px}
.family-planner .context-hint[hidden]{display:none}