/* Thermo Optimum – Comic-Stil */
@font-face{font-family:Poppins;src:url(../fonts/Poppins-Regular.ttf) format("truetype");font-weight:400;font-display:swap}
@font-face{font-family:Poppins;src:url(../fonts/Poppins-Medium.ttf) format("truetype");font-weight:500 600;font-display:swap}
@font-face{font-family:Poppins;src:url(../fonts/Poppins-Bold.ttf) format("truetype");font-weight:700 900;font-display:swap}

:root{
  --paper:#F3F1EC;
  --card:#FBFAF7;
  --ink:#1A1B1A;
  --grey:#686867;
  --shadow:#CDCBCB;
  --yellow:#FDC717;
  --yellow-dark:#E8AE00;
  --r1:16px 22px 14px 24px/22px 14px 24px 16px;
  --r2:22px 14px 24px 16px/14px 24px 16px 22px;
  --max:1120px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{
  margin:0;font-family:Poppins,system-ui,sans-serif;color:var(--ink);
  font-size:17px;line-height:1.6;
  background:var(--paper);
  background-image:radial-gradient(rgba(0,0,0,.06) 1px,transparent 1.3px);
  background-size:23px 29px;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3{line-height:1.15;margin:0 0 .5em}
h2{font-size:clamp(1.7rem,4vw,2.4rem);font-weight:800}
h3{font-size:1.15rem;font-weight:700}
p{margin:0 0 1em}
.wrap{max-width:var(--max);margin:0 auto;padding:0 20px}
.hl{background:linear-gradient(transparent 55%,#FDC71788 55%)}
.kicker{font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--grey);font-weight:600;margin:0 0 .4em}
.lead{font-size:1.1rem;max-width:720px}
.skip{position:absolute;left:-999px}
.skip:focus{left:10px;top:10px;z-index:99;background:var(--yellow);padding:8px 12px}

/* Header */
.site-header{position:sticky;top:0;z-index:50;background:var(--paper)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:72px;position:relative}
.site-header::after{content:"";display:block;height:6px;border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);background:repeating-linear-gradient(-40deg,var(--yellow) 0 6px,var(--yellow-dark) 6px 8px)}
.brand img{height:52px;width:auto}
.nav{display:flex;align-items:center;gap:22px}
.nav a{text-decoration:none;font-weight:600;font-size:.95rem}
.nav a:not(.btn):hover{background:linear-gradient(transparent 60%,#FDC717aa 60%)}
.nav-toggle{display:none;background:var(--card);border:2px solid var(--ink);border-radius:var(--r1);width:46px;height:42px;cursor:pointer;box-shadow:2px 3px 0 var(--shadow)}
.nav-toggle span{display:block;width:20px;height:2px;background:var(--ink);margin:4px auto;border-radius:2px}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:8px;text-decoration:none;font-weight:700;
  background:var(--yellow);border:2px solid var(--ink);border-radius:var(--r1);
  padding:10px 20px;box-shadow:3px 4px 0 var(--ink);transition:transform .12s,box-shadow .12s;font-size:1rem;cursor:pointer;font-family:inherit;color:var(--ink)}
.btn:hover{transform:translate(-1px,-1px);box-shadow:4px 5px 0 var(--ink)}
.btn:active{transform:translate(2px,3px);box-shadow:1px 1px 0 var(--ink)}
.btn.ghost{background:var(--card)}
.btn-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:22px}

/* Sections */
section{padding:72px 0}
.section-head{margin-bottom:34px}
.divider{height:0;border-top:1.5px dashed var(--shadow);max-width:var(--max);margin:0 auto}

/* Hero */
.hero{padding:56px 0 64px}
.hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:40px}
.hey{font-size:clamp(4.5rem,13vw,9rem);font-weight:900;line-height:.9;margin:0 0 .15em;letter-spacing:-.02em;position:relative;display:inline-block}
.hey::after{content:"";position:absolute;left:4px;right:-6px;bottom:.08em;height:.22em;background:var(--yellow);z-index:-1;border-radius:6px 10px 5px 12px}
.hero h1{font-size:clamp(1.4rem,3vw,1.9rem);font-weight:700;margin:0 0 .6em}
.hero .sub{font-size:1.08rem;color:#333;max-width:540px}
.hero-img{position:relative}
.hero-img img{width:100%;max-width:440px;margin:0 auto;animation:wobble 4s ease-in-out infinite}
.badge{position:absolute;right:4%;top:2%;background:var(--card);border:2px solid var(--ink);border-radius:var(--r2);padding:6px 12px;font-weight:700;font-size:.85rem;box-shadow:3px 4px 0 var(--shadow);transform:rotate(4deg)}
@keyframes wobble{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-6px) rotate(-1deg)}}
@media (prefers-reduced-motion:reduce){.hero-img img{animation:none}html{scroll-behavior:auto}}

/* Cards */
.grid{display:grid;gap:22px}
.grid.c2{grid-template-columns:repeat(2,1fr)}
.grid.c3{grid-template-columns:repeat(3,1fr)}
.grid.c4{grid-template-columns:repeat(4,1fr)}
.card{background:var(--card);border:2px solid var(--ink);border-radius:var(--r1);box-shadow:3px 4px 0 var(--shadow);padding:22px 24px}
.card:nth-child(even){border-radius:var(--r2)}
.card p:last-child{margin-bottom:0}
.card h3{display:flex;gap:10px;align-items:center}
.num{display:inline-grid;place-items:center;width:32px;height:32px;border:2px solid var(--ink);border-radius:50%;background:var(--yellow);font-size:.95rem;font-weight:700;flex:none}
.icon{width:54px;height:54px;border:2px solid var(--ink);border-radius:var(--r2);background:var(--yellow);display:grid;place-items:center;margin-bottom:14px}
.icon svg{width:30px;height:30px}
.card.yellow{background:var(--yellow)}

/* Brands */
.brand-card .tag{display:inline-block;font-size:.78rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;border:2px solid var(--ink);border-radius:999px;padding:2px 10px;margin-bottom:10px;background:var(--paper)}
.brand-card ul{padding-left:1.1em;margin:0 0 1em}
.tool-box{margin-top:26px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px;border-style:dashed}

/* Steps */
.steps{counter-reset:s;display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.steps .card{padding:20px}
.steps h3{flex-direction:column;align-items:flex-start;font-size:1.05rem}
.steps p{font-size:.95rem}

/* FAQ */
.faq{max-width:820px}
.faq details{background:var(--card);border:2px solid var(--ink);border-radius:var(--r1);box-shadow:3px 4px 0 var(--shadow);margin-bottom:14px}
.faq details:nth-child(even){border-radius:var(--r2)}
.faq summary{cursor:pointer;list-style:none;padding:16px 56px 16px 22px;font-weight:700;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:16px;top:50%;transform:translateY(-50%);width:28px;height:28px;border:2px solid var(--ink);border-radius:50%;background:var(--yellow);display:grid;place-items:center;font-size:1.1rem;line-height:1}
.faq details[open] summary::after{content:"–"}
.faq details p{padding:0 22px 18px;margin:0}

/* Contact */
.contact .wrap{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start}
.contact-list{list-style:none;padding:0;margin:0}
.contact-list li{display:flex;gap:12px;align-items:flex-start;margin-bottom:14px}
.contact-list .num{width:36px;height:36px}
.contact-list .num svg{width:18px;height:18px}
.contact-list a{font-weight:600}
.area{font-size:.95rem;color:var(--grey)}

/* Footer */
.site-footer{border-top:2px solid var(--ink);background:var(--card);padding:30px 0 40px;margin-top:40px;font-size:.92rem}
.site-footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px;align-items:center}
.site-footer nav{display:flex;gap:18px}
.site-footer img{height:44px;width:auto}
.slogan{color:var(--yellow-dark);font-weight:700;font-style:italic}

/* Legal pages */
.legal{padding:48px 0 30px}
.legal .card{max-width:860px}
.legal h1{font-size:clamp(1.8rem,4vw,2.4rem);font-weight:800}
.legal h2{font-size:1.25rem;margin-top:1.6em}
.todo{background:#ffe9a6;border:1.5px dashed var(--yellow-dark);padding:0 4px;border-radius:4px}

/* Responsive */
@media (max-width:1000px){
  .steps{grid-template-columns:repeat(2,1fr)}
  .steps .card:last-child{grid-column:1/-1}
  .grid.c4{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:820px){
  .nav-toggle{display:block}
  .nav{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;background:var(--card);border-bottom:2px solid var(--ink);padding:8px 20px 18px}
  .nav.open{display:flex}
  .nav a{padding:12px 0;border-bottom:1.5px dashed var(--shadow)}
  .nav a.btn{margin-top:14px;justify-content:center;border-bottom:2px solid var(--ink)}
  .hero .wrap,.contact .wrap{grid-template-columns:1fr}
  .hero{padding-top:36px}
  .hero-img img{max-width:240px}
  .grid.c2,.grid.c3{grid-template-columns:1fr}
  section{padding:54px 0}
}
@media (max-width:520px){
  body{font-size:16px}
  .grid.c4,.steps{grid-template-columns:1fr}
  .brand img{height:42px}
  .card{padding:18px 18px}
}

/* Wärmepumpen-Rechner */
.hidden{display:none!important}
.calc{display:grid;grid-template-columns:1.05fr .95fr;gap:24px;align-items:start}
.calc form label,.calc-req label{display:block;font-weight:600;font-size:.92rem;margin-bottom:14px}
.calc small{display:block;font-weight:400;color:var(--grey);font-size:.8rem;line-height:1.4}
.calc input,.calc select,.calc-req input,.calc-req textarea{display:block;width:100%;margin-top:6px;font:inherit;font-size:1rem;font-weight:400;
  padding:11px 12px;border:2px solid var(--ink);border-radius:10px 14px 9px 15px/14px 9px 15px 10px;background:#FFFEFB;color:var(--ink)}
.calc input:focus,.calc select:focus,.calc-req input:focus,.calc-req textarea:focus{outline:none;box-shadow:0 0 0 3px #FDC71799}
.calc-in h3,.calc-req h3{margin:6px 0 16px}
.calc-in h3:not(:first-child){margin-top:26px}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.f3{display:grid;grid-template-columns:repeat(3,1fr);gap:0 10px}
.lbl{font-weight:600;font-size:.92rem;margin-bottom:2px;position:relative}
.lbl+select{margin-bottom:14px}
.info{display:inline-grid;place-items:center;width:22px;height:22px;margin-left:6px;padding:0;border:2px solid var(--ink);border-radius:50%;
  background:var(--yellow);font:italic 800 .75rem/1 Poppins,sans-serif;cursor:pointer;vertical-align:middle}
.lbl .tip{display:none;position:absolute;left:0;top:30px;z-index:20;width:min(340px,100%);background:#FFFEFB;border:2px solid var(--ink);
  border-radius:var(--r2);box-shadow:3px 4px 0 var(--shadow);padding:10px 12px;font-weight:400;font-size:.85rem;line-height:1.5}
.lbl.open .tip{display:block}
@media (hover:hover){.lbl .info:hover+.tip{display:block}}
.calc-in .btn{width:100%;justify-content:center;margin-top:8px}
.calc-err{color:#B3261E;font-weight:600;font-size:.92rem;margin:10px 0 0;min-height:1em}
.calc-out{display:grid;gap:18px}
.calc-empty{text-align:center;color:var(--grey)}
.calc-empty img{max-width:200px;margin:0 auto 10px}
.res-main{background:var(--yellow)}
.res-main .kicker{color:var(--ink)}
.big{font-size:clamp(2.4rem,6vw,3.2rem);font-weight:800;line-height:1;margin:.1em 0 .3em}
.big span{font-size:1.2rem}
.small{font-size:.85rem;color:#444;margin:.6em 0 0}
.res-main .small{color:var(--ink)}
.dev{border-top:1.5px dashed var(--shadow);padding:12px 0}
.dev:last-child{padding-bottom:0}
.dev b{display:block;font-size:1.05rem}
.dev span{display:block;font-size:.88rem;color:var(--grey)}
.dev .tag{display:inline-block;font-size:.7rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;border:2px solid var(--ink);
  border-radius:999px;padding:1px 9px;margin-bottom:6px;background:var(--paper);color:var(--ink)}
.dev em{display:block;font-size:.85rem;color:#B3261E}
.kv{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1.5px dashed var(--shadow);font-size:.95rem}
.kv b{white-space:nowrap}
.kv.save{font-size:1.08rem}
.kv.save b{background:linear-gradient(transparent 55%,#FDC717aa 55%)}
.hint{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between}
.hint p{margin:0;flex:1 1 260px;font-size:.92rem}
.calc-req{margin-top:24px;max-width:820px}
.calc-req .btn{margin-top:4px}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
label.check{display:flex!important;gap:10px;align-items:flex-start;font-weight:400!important;font-size:.88rem!important}
label.check input{width:22px;height:22px;flex:none;margin:2px 0 0;accent-color:var(--yellow-dark)}
@media (max-width:820px){
  .calc{grid-template-columns:1fr}
}
@media (max-width:520px){
  .f2{grid-template-columns:1fr}
  .f3{grid-template-columns:1fr}
}
@media (min-width:821px) and (max-width:1080px){.nav{gap:13px}.nav a{font-size:.86rem}.nav a.btn{padding:8px 14px}}

/* Förderrechner (aus TO-Förderrechner.html, eigene Variablen) */
.fr{--paper:#F3F1EC;--surface:#FBFAF7;--field:#FFFEFB;--ink:#1A1B1A;--muted:#686867;--line:#1A1B1A;--line-soft:#CDCBCB;
  --accent:#FDC717;--accent-dark:#E8AE00;--accent-ink:#1A1B1A;
  --r1:16px 22px 14px 24px / 22px 14px 24px 16px;--r2:10px 14px 9px 15px / 14px 9px 15px 10px}
  .fr{
    --gelb:var(--accent);
    --gelb-tief:#8A6600;
    --gelb-glut:rgba(253,199,23,.22);
    --nacht:var(--ink);
    --karte:var(--surface);
    --einsatz:#EEECE6;
    --spur:var(--line-soft);
    --linie:var(--ink);
    --linie-hell:var(--line-soft);
    --tinte:var(--ink);
    --tinte-weich:#3F3F3E;
    --tinte-blass:var(--muted);
    --mono:"Poppins",system-ui,-apple-system,"Segoe UI",sans-serif;
    --sans:"Poppins",system-ui,-apple-system,"Segoe UI",sans-serif;
    color:var(--tinte);font-family:var(--sans);min-height:100vh;padding:0 0 52px;
    -webkit-font-smoothing:antialiased;}
  .fr *,.fr *::before,.fr *::after{box-sizing:border-box;}
  .fr button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit;box-shadow:none;padding:0;border-radius:0;transform:none;}
  .fr button:hover,.fr button:active{transform:none;box-shadow:none;}
  .fr p{margin:0;}
  .fr-shell{max-width:1120px;margin:0 auto;padding:0 16px;}

  /* Kopf */
  .fr-top{max-width:1120px;margin:0 auto 28px;padding:24px 16px 0;}
  .fr-topin{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;
    padding-bottom:20px;position:relative;}
  .fr-topin::after{content:"";position:absolute;left:0;right:0;bottom:0;height:9px;
    border:2px solid var(--ink);border-radius:var(--r2);
    background:repeating-linear-gradient(-40deg,var(--accent) 0 6px,var(--accent-dark) 6px 8px);}
  .fr-topin .logo{order:2;line-height:0;}
  .fr-topin .logo img{height:70px;width:auto;display:block;}
  .fr-stand{order:1;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
    color:var(--ink);border:2px solid var(--ink);padding:5px 12px;border-radius:var(--r2);
    background:var(--field);box-shadow:2px 3px 0 var(--line-soft);}

  .fr-head{margin-bottom:26px;}
  .fr-h1{font-size:30px;line-height:1.15;font-weight:800;letter-spacing:-.01em;margin:0 0 10px;text-wrap:balance;}
  .fr-lede{color:var(--tinte-weich);font-size:14.5px;line-height:1.6;max-width:64ch;}
  .fr-lede b{color:var(--tinte);font-weight:700;}

  .fr-grid{display:grid;grid-template-columns:minmax(290px,352px) 1fr;gap:22px;align-items:start;}
  @media (max-width:880px){.fr-grid{grid-template-columns:1fr;}}

  /* Kästen */
  .fr-panel,.fr-total,.fr-card,.fr-plan{background:var(--surface);border:2px solid var(--line);
    border-radius:var(--r1);box-shadow:4px 5px 0 var(--line-soft);}
  .fr-panel{padding:2px 18px 16px;}
  .fr-group{padding:18px 0;border-bottom:1.5px dashed var(--line-soft);}
  .fr-group:last-child{border-bottom:none;}
  .fr-eyebrow{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
    color:var(--muted);margin-bottom:14px;}

  .fr-field{margin-bottom:18px;}
  .fr-field:last-child{margin-bottom:0;}
  .fr-row{display:flex;align-items:center;justify-content:space-between;gap:14px;}
  .fr-lblock{display:flex;flex-direction:column;gap:3px;}
  .fr-label{font-size:13.5px;font-weight:600;color:var(--tinte);}
  .fr-hint{font-size:12px;color:var(--tinte-blass);line-height:1.45;max-width:34ch;}

  .fr-shead{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:12px;gap:10px;}
  .fr-readout{font-size:14px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums;}
  .fr-range{-webkit-appearance:none;appearance:none;width:100%;height:10px;border-radius:999px;
    outline:none;cursor:pointer;background:var(--spur);border:1.5px solid var(--ink);padding:0;}
  .fr-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:22px;
    border-radius:50%;background:var(--accent);border:2px solid var(--ink);box-shadow:2px 2px 0 var(--ink);}
  .fr-range::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--accent);
    border:2px solid var(--ink);box-shadow:2px 2px 0 var(--ink);}
  .fr-range:focus-visible{outline:3px solid var(--accent);outline-offset:3px;}

  .fr .fr-switch{width:46px;height:26px;border-radius:999px;background:var(--line-soft);border:2px solid var(--ink);
    position:relative;flex:none;transition:background .16s ease;}
  .fr .fr-switch.on{background:repeating-linear-gradient(-40deg,var(--accent) 0 6px,var(--accent-dark) 6px 8px);}
  .fr-knob{position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;
    background:var(--field);border:2px solid var(--ink);transition:left .16s ease;}
  .fr-switch.on .fr-knob{left:22px;}
  .fr-switch:focus-visible{outline:3px solid var(--accent);outline-offset:2px;}

  .fr-step{display:flex;align-items:center;border:2px solid var(--ink);border-radius:var(--r2);
    overflow:hidden;background:var(--field);box-shadow:2px 3px 0 var(--ink);}
  .fr .fr-step button{width:32px;height:32px;font-size:18px;font-weight:800;color:var(--ink);
    display:flex;align-items:center;justify-content:center;}
  .fr .fr-step button:hover{background:var(--gelb-glut);}
  .fr-step button:focus-visible{outline:none;box-shadow:inset 0 0 0 2px var(--accent);}
  .fr-stepnum{font-size:14px;font-weight:800;min-width:38px;text-align:center;font-variant-numeric:tabular-nums;}

  /* Ergebnis */
  .fr-res{display:flex;flex-direction:column;gap:22px;}
  .fr-total{padding:22px 24px;position:relative;overflow:hidden;
    background:repeating-linear-gradient(-40deg,var(--accent) 0 7px,#F5BC0C 7px 9px);
    box-shadow:4px 5px 0 var(--ink);}
  .fr-tlabel{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
    color:var(--ink);margin-bottom:10px;}
  .fr-total .fr-tval{font-size:52px;font-weight:800;letter-spacing:-.03em;line-height:1;
    color:var(--ink);font-variant-numeric:tabular-nums;}
  .fr-tsub{margin-top:12px;font-size:13px;color:var(--ink);line-height:1.55;}
  .fr-tsub b{font-weight:800;}

  .fr-antraege{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
  .fr-antraege.solo{grid-template-columns:1fr;}
  @media (max-width:600px){.fr-antraege{grid-template-columns:1fr;}}
  .fr-card{padding:18px 20px 20px;display:flex;flex-direction:column;}
  .fr-card.zusatz{box-shadow:4px 5px 0 var(--accent);}
  .fr-chead{margin-bottom:14px;}
  .fr-ctitle{font-size:16px;font-weight:800;}
  .fr-cscope{font-size:11px;font-weight:700;letter-spacing:.08em;color:var(--tinte-blass);
    margin-top:3px;text-transform:uppercase;}
  .fr-lines{display:flex;flex-direction:column;gap:9px;flex:1;}
  .fr-line{display:flex;align-items:baseline;gap:6px;}
  .fr-ll{font-size:13px;color:var(--tinte-weich);white-space:nowrap;}
  .fr-dots{flex:1;border-bottom:1.5px dotted var(--line-soft);transform:translateY(-3px);min-width:8px;}
  .fr-lv{font-size:13px;font-weight:700;color:var(--tinte);font-variant-numeric:tabular-nums;white-space:nowrap;}
  .fr-line.muted .fr-ll,.fr-line.muted .fr-lv{color:var(--tinte-blass);font-weight:500;}
  .fr-cap{color:var(--gelb-tief);font-weight:600;font-size:11px;}
  .fr-crule{height:0;border-top:1.5px dashed var(--line-soft);margin:14px 0 12px;}
  .fr-cfoot{display:flex;justify-content:space-between;align-items:baseline;gap:8px;}
  .fr-cfl{font-size:13px;font-weight:700;}
  .fr-cfv{font-size:22px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--tinte);}
  .fr-card.zusatz .fr-cfv{box-shadow:inset 0 -8px 0 var(--accent);}
  .fr-cnote{margin-top:12px;font-size:12px;color:var(--tinte-blass);line-height:1.5;}

  /* Fahrplan */
  .fr-plan{padding:18px 20px 20px;}
  .fr-planhead{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:14px;gap:12px;flex-wrap:wrap;}
  .fr-planhint{font-size:12px;color:var(--tinte-blass);}
  .fr-track{display:grid;gap:4px;}
  .fr .fr-tick{display:grid;grid-template-columns:82px 1fr auto;align-items:center;gap:12px;
    padding:6px 9px;border-radius:var(--r2);text-align:left;width:100%;border:2px solid transparent;}
  .fr .fr-tick:hover{background:var(--einsatz);}
  .fr .fr-tick.now{background:var(--gelb-glut);border-color:var(--ink);}
  .fr-tick:focus-visible{outline:3px solid var(--accent);outline-offset:1px;}
  .fr-tdate{font-size:11px;color:var(--tinte-blass);font-variant-numeric:tabular-nums;white-space:nowrap;}
  .fr-tick.now .fr-tdate{color:var(--tinte);font-weight:700;}
  .fr-tbar{height:14px;background:var(--field);border:1.5px solid var(--ink);border-radius:var(--r2);overflow:hidden;}
  .fr-tfill{display:block;height:100%;background:var(--line-soft);transition:width .3s cubic-bezier(.22,.61,.36,1);min-width:2px;}
  .fr-tick.now .fr-tfill{background:repeating-linear-gradient(-40deg,var(--accent) 0 5px,var(--accent-dark) 5px 7px);}
  .fr-tick .fr-tval{font-size:12px;font-weight:700;color:var(--tinte-weich);font-variant-numeric:tabular-nums;min-width:74px;text-align:right;}
  .fr-tick.now .fr-tval{color:var(--ink);font-weight:800;}

  /* Fuß */
  .fr-foot{margin-top:30px;padding-top:20px;border-top:1.5px dashed var(--line-soft);display:flex;flex-direction:column;gap:12px;}
  .fr-foot p{font-size:12.5px;color:var(--tinte-weich);line-height:1.65;max-width:90ch;}
  .fr-foot strong{color:var(--tinte);font-weight:700;}
  .fr-fine{font-size:11.5px;color:var(--tinte-blass);}
  .fr-foot code{font-size:11px;background:var(--field);padding:1px 5px;border-radius:4px;border:1px solid var(--line-soft);}

  /* Eingabefeld Investitionssumme */
  .fr-shead:has(.fr-numin){align-items:center;}
  .fr-numin{display:inline-flex;align-items:center;gap:3px;cursor:text;border:1.5px solid var(--ink);
    border-radius:var(--r2);background:var(--field);padding:4px 9px;}
  .fr-numin:focus-within{outline:3px solid var(--accent);outline-offset:2px;}
  .fr .fr-num{font-size:14px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums;border:none;
    background:none;outline:none;padding:0;margin:0;width:8.5ch;text-align:right;box-shadow:none;}
  .fr-numcur{font-size:13px;font-weight:800;}

  /* PDF-Button */
  .fr-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
  .fr .fr-pdf{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:800;color:var(--accent-ink);
    padding:10px 18px;border:2px solid var(--ink);border-radius:var(--r2);box-shadow:2px 3px 0 var(--ink);
    background:repeating-linear-gradient(-40deg,var(--accent) 0 7px,#F5BC0C 7px 9px);
    transition:transform .08s ease,box-shadow .08s ease;}
  .fr .fr-pdf:hover{transform:translate(-1px,-1px);box-shadow:3px 4px 0 var(--ink);}
  .fr .fr-pdf:active{transform:translate(1px,2px);box-shadow:0 0 0 var(--ink);}
  .fr-pdf:focus-visible{outline:3px solid var(--accent);outline-offset:2px;}
  .fr-pdf svg{width:15px;height:15px;fill:currentColor;flex:none;}
  .fr-actionhint{font-size:12px;color:var(--tinte-blass);line-height:1.4;}
.fr{min-height:0;padding:0;margin-top:22px}
.fr .fr-panel{padding:2px 18px 16px}
.fr .fr-fine{margin-top:18px;font-size:.8rem;color:var(--grey)}
.fr input[type=text]{border:none}
.preis{max-width:860px}
.preis p{margin:0}
.fr section{padding:0}

/* Förderrechner: Preisband aus den Angeboten (Schieber 25.000 bis 50.000 €) */
.fr-band{position:relative;height:8px;margin:8px 11px 0;border-radius:4px;background:transparent}
.fr-bandzone{position:absolute;top:0;bottom:0;left:8%;width:24%;border:1.5px solid var(--ink);border-radius:4px;
  background:repeating-linear-gradient(-40deg,#FDC717 0 5px,#E8AE00 5px 7px)}
.fr-bandlbl{display:flex;justify-content:space-between;gap:8px;margin-top:6px;font-size:11px;color:var(--muted)}
.fr-bandlbl .z{color:var(--ink);font-weight:600;text-align:center}

/* Preisband mit Verbindungsstrichen zum Schieber */
.fr-bandzone::before,.fr-bandzone::after{content:"";position:absolute;bottom:100%;width:2px;height:12px;margin-bottom:1px;background:var(--ink);border-radius:1px}
.fr-bandzone::before{left:-1px}
.fr-bandzone::after{right:-1px}
.fr-band{margin-top:14px}
/* Gerätebilder */
.brand-img{width:100%;aspect-ratio:4/3;object-fit:cover;border:2px solid var(--ink);border-radius:var(--r2);margin-bottom:14px;background:#fff}
.dev{display:flex;gap:12px;align-items:center}
.dev img{width:84px;height:72px;flex:none;object-fit:cover;border:1.5px solid var(--ink);border-radius:10px 14px 9px 15px/14px 9px 15px 10px;background:#fff}
.dev>div{min-width:0}
html{scroll-padding-top:96px}

/* Freigestellte Produktbilder: ganz zeigen, weißer Grund */
.brand-img{object-fit:contain;padding:10px}
.dev img{object-fit:contain;padding:4px}
.preiszeile{margin-top:12px!important;padding-top:10px;border-top:1.5px dashed var(--shadow);font-size:.95rem}
.preiszeile b{background:linear-gradient(transparent 55%,#FDC71788 55%)}

/* Zwei Säulen: Einbau und Service */
.saeule{display:flex;flex-direction:column;padding:26px 28px}
.saeule h3{font-size:1.35rem}
.saeule .btn{margin-top:auto;align-self:flex-start}
.haken{list-style:none;padding:0;margin:0 0 22px}
.haken li{position:relative;padding-left:32px;margin-bottom:10px}
.haken li::before{content:"";position:absolute;left:0;top:3px;width:20px;height:20px;border:2px solid var(--ink);border-radius:50%;
  background:var(--yellow) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231A1B1A' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/12px no-repeat}
.hero-tel{margin:14px 0 0;font-size:.95rem;color:var(--grey)}
.hero-tel a{font-weight:700;color:var(--ink)}
.saeule-foot{margin-top:auto}
.saeule-foot p{margin:0 0 4px;font-size:.95rem}
.saeule-foot .btn-row{margin-top:12px}
.saeule .saeule-foot .btn{margin-top:0}

/* Kontakt- und Service-Formular */
.to-form label{display:block;font-weight:600;font-size:.92rem;margin-bottom:14px}
.to-form input:not([type=checkbox]):not([type=radio]):not([type=file]),.to-form textarea{display:block;width:100%;margin-top:6px;font:inherit;font-size:1rem;font-weight:400;
  padding:11px 12px;border:2px solid var(--ink);border-radius:10px 14px 9px 15px/14px 9px 15px 10px;background:#FFFEFB;color:var(--ink)}
.to-form textarea{resize:vertical;min-height:110px}
.to-form input:focus,.to-form textarea:focus{outline:none;box-shadow:0 0 0 3px #FDC71799}
.to-form .fehlt{border-color:#B3261E!important;box-shadow:0 0 0 3px #B3261E33!important}
.to-form label.check input.fehlt{outline:3px solid #B3261E;outline-offset:1px}
.to-form h3{margin:0 0 14px}
.to-form .btn[type=submit]{margin-top:4px}
.to-form.gesendet h3{margin:0 0 6px}
.wahl{border:0;padding:0;margin:0 0 16px;display:flex;flex-wrap:wrap;gap:10px}
.wahl legend{font-weight:600;font-size:.92rem;margin-bottom:8px;padding:0}
.wahl label{margin:0;flex:1 1 220px}
.wahl input{position:absolute;opacity:0;width:1px;height:1px}
.wahl span{display:flex;align-items:center;height:100%;padding:10px 14px;border:2px solid var(--ink);border-radius:var(--r2);background:#FFFEFB;cursor:pointer;font-weight:600;box-shadow:2px 3px 0 var(--shadow)}
.wahl input:checked+span{background:var(--yellow);box-shadow:3px 4px 0 var(--ink)}
.wahl input:focus-visible+span{outline:3px solid var(--yellow-dark);outline-offset:2px}
#serviceForm{margin-top:20px;padding-top:18px;border-top:1.5px dashed var(--shadow)}
.contact .wrap>div>.card{margin-top:22px}
/* Foto-Upload nur in der Handy-Ansicht */
.foto-feld{display:none;margin-bottom:14px}
.foto-feld small{display:block;color:var(--grey);font-size:.8rem;margin-top:-6px}
.foto-btn{display:block;text-align:center;padding:12px;border:2px dashed var(--ink)!important;border-radius:var(--r2);background:#FFFEFB;cursor:pointer}
.foto-btn input{display:block;width:100%;margin-top:8px;font:inherit;font-size:.85rem}
.foto-liste{list-style:none;padding:0;margin:6px 0 0;font-size:.85rem;color:var(--grey)}
.foto-liste:empty{display:none}
@media (max-width:820px){.foto-feld{display:block}}
.grid:has(#serviceForm:not(.hidden)){align-items:start}

/* Danke-Meldung nach dem Senden */
.sent{background:var(--yellow)!important;outline:none}
.sent h3{margin-bottom:6px}
.sent p{margin:0}

/* Logo größer (Kai 19.10.) */
.brand img{height:68px}
.site-header .wrap{min-height:88px}
html{scroll-padding-top:110px}
@media (max-width:520px){.brand img{height:54px}.site-header .wrap{min-height:76px}}
/* Danke-Meldung im Service-Formular mit Rand */
.to-form.sent{padding:16px 18px;border:2px solid var(--ink);border-radius:10px 14px 9px 15px/14px 9px 15px 10px;margin-top:14px}

/* Markenauswahl Bosch / Vaillant */
.wahl.marke label{flex:1 1 110px}
.wahl.marke span{justify-content:center}