/* fallsmorgen.de/ruhestand · Rechner „Sie gehen in Rente. Ihre Krankenkasse nicht.“
   Ergänzt styles.css (Hauptseite, dunkel). Regler, große Zahlen und Vergleich aus der Kampagne, in Orange statt Rot. Mobile first. */
.rh{--rh-ink:var(--ink,#0B1020);--rh-sig:var(--signal,#ff6b00);--rh-line:var(--line,rgba(255,255,255,.1));--rh-mute:var(--text-muted,#9aa3b5);--rh-faint:var(--text-faint,#6b7384);--rh-white:var(--white,#fff);--rh-track:rgba(255,255,255,.12)}
.rh [hidden]{display:none!important}
.rh .rh-s{display:grid;gap:18px;max-width:720px}
.rh .rh-s>.eyebrow{margin-bottom:0}
.rh .rh-s h2{margin-bottom:0}
.rh .rh-s>p{margin-bottom:0}
.rh .rh-s .btn{justify-self:start;margin-top:6px}
/* große Zahlen */
.rh .n{font-variant-numeric:tabular-nums;letter-spacing:-.05em;line-height:.95;font-weight:800;color:var(--rh-white)}
.rh .h-xxl{font-size:clamp(4.2rem,20vw,9rem);line-height:.9;letter-spacing:-.06em}
.rh .h-l{font-size:clamp(1.55rem,6.4vw,2.6rem);line-height:1.05;letter-spacing:-.03em;font-weight:700;color:var(--rh-white);margin:0}
.rh .tiny{font-size:12.5px;color:var(--rh-faint);line-height:1.5;max-width:52ch;margin:0}
/* Regler */
.rh input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:56px;background:transparent;margin:0;cursor:pointer;touch-action:pan-y}
.rh input[type=range]::-webkit-slider-runnable-track{height:8px;border-radius:4px;background:linear-gradient(90deg,var(--rh-sig) 0,var(--rh-sig) var(--p,50%),var(--rh-track) var(--p,50%))}
.rh input[type=range]::-moz-range-track{height:8px;border-radius:4px;background:var(--rh-track)}
.rh input[type=range]::-moz-range-progress{height:8px;border-radius:4px;background:var(--rh-sig)}
.rh input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:40px;height:40px;border-radius:50%;background:var(--rh-white);border:3px solid var(--rh-ink);margin-top:-16px;box-shadow:0 6px 18px rgba(0,0,0,.45)}
.rh input[type=range]::-moz-range-thumb{width:40px;height:40px;border-radius:50%;background:var(--rh-white);border:3px solid var(--rh-ink);box-shadow:0 6px 18px rgba(0,0,0,.45)}
.rh input[type=range]:focus-visible{outline:3px solid var(--rh-sig);outline-offset:4px;border-radius:6px}
/* Spielzeug */
.rh .toy{display:grid;gap:16px;width:100%;max-width:640px;padding:22px 0 0;border-top:1px solid var(--rh-line)}
.rh .toy>.eyebrow{margin-bottom:0}
.rh .sl{display:grid;gap:6px}
.rh .sl label{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;font-weight:600;color:var(--rh-mute)}
.rh .sl label>span{flex:1;min-width:0}
.rh .sl output{white-space:nowrap;flex:none;font-size:22px;letter-spacing:-.02em;font-weight:700;color:var(--rh-white);text-transform:none;font-variant-numeric:tabular-nums}
.rh .sl.num .in{display:flex;align-items:center;gap:10px;border-bottom:2px solid var(--rh-white);padding:4px 0}
.rh .sl.num input{flex:1;min-width:0;border:0;background:none;font:inherit;font-size:clamp(2rem,9vw,3rem);font-weight:800;letter-spacing:-.04em;color:var(--rh-white);padding:4px 0;font-variant-numeric:tabular-nums}
.rh .sl.num input:focus{outline:none}
.rh .sl.num i{font-style:normal;color:var(--rh-mute);font-size:14px;white-space:nowrap}
.rh .link{color:var(--rh-sig);font-weight:600;font-size:15px;justify-self:start;padding:8px 0;min-height:44px;display:inline-flex;align-items:center;background:none;border:0;cursor:pointer;font-family:inherit}
.rh .res{display:grid;gap:4px;padding-top:16px;border-top:1px solid var(--rh-line)}
.rh .res .n{font-size:clamp(3.4rem,17vw,7rem);line-height:.92;letter-spacing:-.06em;font-weight:800}
.rh .res>span{font-size:14.5px;color:var(--rh-mute);line-height:1.4}
.rh .res>span b{color:var(--rh-white);font-weight:600}
.rh .res>.eyebrow{margin-bottom:4px}
.rh .res small{font-size:12.5px;color:var(--rh-faint)}
.rh .row{display:flex;align-items:center;gap:12px}
.rh .kids{display:inline-flex;gap:6px}
.rh .kids button{font:inherit;font-size:13px;font-weight:600;padding:8px 14px;border-radius:999px;border:1.5px solid var(--rh-line);background:none;color:var(--rh-mute);min-height:40px;cursor:pointer}
.rh .kids button[aria-pressed=true]{border-color:var(--rh-white);color:var(--rh-white)}
.rh .i{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;border:1.5px solid var(--rh-faint);background:none;color:var(--rh-mute);font:inherit;font-size:13px;font-weight:700;font-style:italic;cursor:pointer}
.rh .i[aria-expanded=true]{border-color:var(--rh-sig);color:var(--rh-sig)}
.rh .ibox{font-size:13.5px;color:var(--rh-mute);line-height:1.55;background:rgba(255,255,255,.04);border:1px solid var(--rh-line);border-radius:14px;padding:14px 16px}
/* Tipp und Vergleich */
.rh .ziel{display:grid;gap:14px;width:100%;max-width:720px}
.rh .ziel .n{transition:transform .25s cubic-bezier(.2,.7,.2,1),color .25s}
.rh .ziel .n.o{color:var(--rh-sig)}
.rh .ziel .n.pop{animation:rh-pop .5s cubic-bezier(.2,.9,.2,1.2)}
@keyframes rh-pop{0%{transform:scale(.92)}60%{transform:scale(1.06)}100%{transform:scale(1)}}
.rh .ziel>.eyebrow{margin:-6px 0 0}
.rh .ziel input[type=range]{height:72px}
.rh .ziel input[type=range]::-webkit-slider-runnable-track{height:14px;border-radius:7px;background:linear-gradient(90deg,var(--rh-sig) 0,var(--rh-sig) var(--p,50%),var(--rh-track) var(--p,50%))}
.rh .ziel input[type=range]::-moz-range-track{height:14px;border-radius:7px}
.rh .ziel input[type=range]::-moz-range-progress{height:14px;border-radius:7px}
.rh .ziel input[type=range]::-webkit-slider-thumb{width:52px;height:52px;margin-top:-19px;border-width:4px}
.rh .ziel input[type=range]::-moz-range-thumb{width:52px;height:52px;border-width:4px}
.rh .marks{display:flex;justify-content:space-between;font-size:12.5px;font-weight:600;color:var(--rh-faint);margin-top:-6px}
.rh .vs{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%;max-width:640px}
.rh .vs>div{display:grid;gap:4px;padding:14px 16px;border:1.5px solid var(--rh-line);border-radius:16px}
.rh .vs>div span{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--rh-mute)}
.rh .vs>div b{font-size:clamp(1.9rem,9vw,3.2rem);font-weight:800;letter-spacing:-.05em;line-height:1;font-variant-numeric:tabular-nums;color:var(--rh-white)}
.rh .vs>div.hit{border-color:var(--rh-sig)}
.rh .vs>div.hit b{color:var(--rh-sig)}
.rh .spar{display:grid;gap:4px;padding-top:16px;border-top:1px solid var(--rh-line)}
.rh .spar>.eyebrow{margin-bottom:2px}
.rh .spar .h-l{font-size:clamp(2.2rem,10vw,4rem);letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.rh .spar .p{font-size:16px;color:var(--rh-mute);margin:0}
.rh .zero{display:grid;gap:10px;padding:18px 0 4px;border-top:1px solid var(--rh-line);animation:rh-rise .5s cubic-bezier(.2,.7,.2,1) both}
.rh .zero p{margin:0}
@keyframes rh-rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.rh .plan{display:grid;gap:16px;padding-top:26px;margin-top:10px;border-top:1px solid var(--rh-line);max-width:640px}
.rh .plan p{margin:0}
/* Anfrage, Portrait, Annahmen */
.rh .rh-check>p{max-width:56ch}
.rh .rh-check .anam-ok{margin-bottom:26px}
.rh .rh-form{max-width:640px}
.rh .about{display:grid;gap:28px}
@media(min-width:820px){.rh .about{grid-template-columns:360px 1fr;gap:48px}}
.rh .how summary{cursor:pointer;font-weight:600;color:var(--rh-mute);font-size:14px;padding:8px 0;min-height:44px;display:flex;align-items:center;list-style:none}
.rh .how summary::-webkit-details-marker{display:none}
.rh .how summary::before{content:"+";display:inline-grid;place-items:center;width:22px;height:22px;border:1px solid var(--rh-line);border-radius:50%;margin-right:10px;font-weight:600}
.rh .how[open] summary::before{content:"–"}
.rh .how p{font-size:13.5px;color:var(--rh-faint);line-height:1.6;max-width:72ch;margin:8px 0 0}
.rh .rh-how{padding-top:24px;padding-bottom:24px}
/* Teaser-Kasten auf den Kapitelseiten */
.rh-teaser{display:grid;gap:14px;max-width:720px}
.rh-teaser .btn{justify-self:start;margin-top:4px}
@media(prefers-reduced-motion:reduce){.rh .ziel .n.pop,.rh .zero{animation:none}}
@media(min-width:900px){.rh .h-xxl{font-size:clamp(6rem,11vw,10rem)}.rh .rh-s{gap:22px}}
