/* marktmiete.de – CI nach moovin Design System, Signalfarbe orange (nur Kauf-CTA). Conversion-Redesign 12.11.2026 */
@font-face{font-family:Poppins;font-weight:300;font-style:normal;font-display:swap;src:url(/assets/fonts/poppins-300.woff2) format("woff2")}
@font-face{font-family:Poppins;font-weight:500;font-style:normal;font-display:swap;src:url(/assets/fonts/poppins-500.woff2) format("woff2")}
@font-face{font-family:Poppins;font-weight:700;font-style:normal;font-display:swap;src:url(/assets/fonts/poppins-700.woff2) format("woff2")}
:root{
  --dunkelblau:#141964; --tiefblau:#001e46; --hellblau:#0069ff; --hellblau-10:#e6f0ff; --orange:#e35205; --weiss:#fff;
  --grau:#b4b4b4; --line:#c9d3e3; --ink-2:#3a4a63; --signal-gruen:#46a028;
  --radius:11px; --max:1248px;
  --sans:"Poppins",Calibri,Arial,sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
html,body{margin:0}
html{scroll-padding-top:80px}
body{background:var(--weiss);color:var(--tiefblau);font:300 16px/24px var(--sans);-webkit-font-smoothing:antialiased}
[hidden]{display:none!important}
a{color:var(--hellblau)}
b,strong{font-weight:700}
img{max-width:100%}
:focus-visible{outline:2px solid var(--hellblau);outline-offset:2px}
.wrap{max-width:var(--max);margin:0 auto;padding-inline:16px}
h1,h2,h3{font-weight:700;margin:0;text-wrap:balance;color:var(--tiefblau)}
h1{font-size:clamp(32px,4.4vw,56px);line-height:1.15}
h2{font-size:clamp(24px,3vw,32px);line-height:1.25}
h3{font-size:20px;line-height:28px}
p{margin:0}
.lead{font-size:18px;line-height:27px;color:var(--ink-2);max-width:62ch}
.overline{font-size:14px;line-height:20px;font-weight:500;color:var(--hellblau)}
.num{font-variant-numeric:tabular-nums}
.muted{color:var(--ink-2)}
.small{font-size:14px;line-height:22px}
.xs{font-size:12px;line-height:18px}

/* ---------- Kopf: Serviceleiste + Header ---------- */
.util{background:var(--dunkelblau);color:var(--weiss);font-size:12px;line-height:18px}
.util .wrap{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:36px}
.util a{color:var(--weiss);text-decoration:none;font-weight:700}
.util nav{display:flex;gap:24px}
.top{position:sticky;top:0;z-index:30;background:var(--weiss);border-bottom:1px solid var(--line)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:64px}
.brand{display:block;flex:none;width:204px;height:46px;overflow:hidden;line-height:0}
.brand img{display:block;height:80px;width:auto;max-width:none;margin:-17px 0 0 -17px}
.nav{display:flex;align-items:center;gap:28px;font-size:14px;line-height:22px;font-weight:700}
.nav a{color:var(--tiefblau);text-decoration:none;white-space:nowrap}
.nav .btn{color:var(--weiss)}
.tag{display:inline-flex;align-items:center;height:24px;padding:0 8px;border-radius:6px;background:var(--hellblau-10);color:var(--tiefblau);font-size:12px;line-height:18px;font-weight:700;white-space:nowrap}
.tag--line{background:var(--weiss);border:1px solid var(--tiefblau)}
.nav .tag{margin-left:6px}
.menu{display:none;position:relative}
.menu summary{list-style:none;cursor:pointer;display:grid;place-content:center;width:44px;height:44px;border:0;padding:0}
.menu summary::-webkit-details-marker{display:none}
.menu summary::after{content:none}
.menu[open] .menu-panel{display:flex}
.menu-panel{display:none;position:absolute;right:0;top:48px;flex-direction:column;gap:4px;min-width:240px;padding:12px;background:var(--weiss);border:1px solid var(--tiefblau);border-radius:var(--radius)}
.menu-panel a{padding:10px 12px;color:var(--tiefblau);text-decoration:none;font-weight:700}
details.menu{border:0;padding:0}
@media (max-width:1080px){.nav .hide-md{display:none}}
@media (max-width:760px){.util{display:none}.brand{width:154px;height:35px}.brand img{height:60px;margin:-12.8px 0 0 -12.8px}.nav{gap:8px}.nav .btn{padding:8px 14px}.nav .hide-sm{display:none}.menu{display:block}.top .wrap{min-height:56px}}

/* ---------- Bühne / Hero ---------- */
.hero{padding-block:32px}
.stage{background:var(--hellblau-10);border-radius:var(--radius);padding:40px}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:start}
.hero-grid>*{min-width:0}
.hero h1{margin-block:8px 16px}
.hero .stage .overline{color:var(--dunkelblau)}
@media (max-width:960px){.hero-grid{grid-template-columns:1fr;gap:24px}.stage{padding:24px 16px}.hero{padding-block:16px}}
.hero2{padding-block:24px 0}
.hero2 .stage{padding:56px 48px}
.hero2-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:48px;align-items:start}
.hero2 h1{font-size:clamp(34px,4.6vw,60px);line-height:1.13;margin-block:12px 20px}
.hero2 .lead{margin-bottom:24px}
.trustline{display:flex;flex-wrap:wrap;gap:8px 24px;margin-top:20px;font-size:14px;line-height:22px}
.trustline span{display:inline-flex;align-items:center;gap:8px}
.trustline span::before{content:"";width:16px;height:16px;flex:none;background:var(--signal-gruen);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
@media (max-width:960px){.hero2 .stage{padding:24px 16px}.hero2-grid{grid-template-columns:minmax(0,1fr);gap:32px}}
.trust{display:flex;flex-wrap:wrap;gap:8px 24px;margin-top:24px;font-size:14px}
.trust span::before{content:"✓ ";color:var(--dunkelblau);font-weight:700}
.highlight{display:inline-block;background:var(--orange);color:var(--weiss);font-weight:700;font-size:14px;line-height:20px;padding:4px 12px;border-radius:var(--radius) 0 var(--radius) var(--radius)}

/* ---------- Karten, Rechner ---------- */
.card{background:var(--weiss);border:1px solid var(--line);border-radius:var(--radius);padding:24px}
.card--line{border-color:var(--tiefblau)}
.teaser h2{font-size:24px;line-height:30px;margin-bottom:16px}
.seg{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:16px}
.seg button{border:1px solid var(--tiefblau);background:var(--weiss);color:var(--tiefblau);border-radius:var(--radius);min-height:44px;padding:6px 8px;font:700 14px/18px var(--sans);cursor:pointer}
.seg button small{display:block;font-weight:300;font-size:12px;line-height:16px}
.seg button[aria-pressed="true"]{background:var(--dunkelblau);border-color:var(--dunkelblau);color:var(--weiss)}
.field{display:grid;gap:4px;margin-bottom:16px;position:relative}
.field label,.ql{font-size:14px;line-height:22px;font-weight:700}
.field input,.field select{font:300 16px/22px var(--sans);height:48px;padding:8px 14px;border:.5px solid var(--tiefblau);border-radius:var(--radius);background:var(--weiss);color:var(--tiefblau);width:100%}
.field input:focus{background:var(--hellblau-10);outline:2px solid var(--hellblau);outline-offset:0}
.field input::placeholder{color:#6b7a90}
.field .hint{font-size:12px;line-height:18px;color:var(--ink-2)}
.sugg{position:absolute;top:100%;left:0;right:0;z-index:5;background:var(--weiss);border:1px solid var(--tiefblau);border-radius:var(--radius);margin-top:4px;max-height:300px;overflow:auto}
.sugg button{display:flex;justify-content:space-between;gap:12px;width:100%;text-align:left;border:0;background:transparent;padding:10px 14px;font:300 14px/22px var(--sans);color:var(--tiefblau);cursor:pointer}
.sugg button small{color:var(--ink-2)}
.sugg button.on{background:var(--hellblau-10)}
.t-row{display:grid;grid-template-columns:minmax(0,1fr);gap:0}
.teaser--bar{border-color:var(--tiefblau)}
.teaser--bar .t-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.teaser--bar .seg{display:inline-flex;gap:0;margin:0;border:1px solid var(--tiefblau);border-radius:var(--radius);overflow:hidden}
.teaser--bar .seg button{border:0;border-radius:0;min-height:38px;padding:0 16px}
.teaser--bar .seg button+button{border-left:1px solid var(--tiefblau)}
.teaser--bar .seg button small{display:none}
.teaser--bar .t-row{grid-template-columns:minmax(0,1fr) 150px;gap:12px;align-items:end}
.teaser--bar #t-go{grid-column:1/-1}
.teaser--bar .t-row .field{margin:0}
@media (max-width:640px){.teaser--bar .t-row{grid-template-columns:minmax(0,1fr)}}
.t-msg{font-size:14px;line-height:22px;color:#c80000;font-weight:700;margin-top:8px}
.result{border-top:1px solid var(--line);padding-top:16px;margin-top:16px}
.result .overline{color:var(--ink-2)}
.result .big{font-size:40px;line-height:48px;font-weight:700;font-variant-numeric:tabular-nums;margin-top:4px}
.result .big small{font-size:16px;font-weight:300}
.result .sub{font-size:14px;line-height:22px;margin-top:4px}
@media (max-width:640px){.result .big{font-size:30px;line-height:38px}.hero2 .lead{font-size:16px;line-height:24px}}
.legal-s{font-size:12px;line-height:18px;color:var(--tiefblau);margin-top:12px}

/* Mietspanne */
.span{position:relative;height:12px;border-radius:6px;background:var(--hellblau-10);margin:40px 0 8px}
.result .span{height:16px;border-radius:8px}
.span .band{position:absolute;top:0;bottom:0;background:var(--dunkelblau);border-radius:inherit}
.span .med{position:absolute;top:2px;bottom:2px;width:2px;margin-left:-1px;background:var(--weiss)}
.span .house{position:absolute;bottom:16px;width:20px;height:20px;transform:translateX(-50%)}
.span-l{display:flex;justify-content:space-between;font-size:12px;line-height:18px;color:var(--ink-2)}
.rng{display:flex;flex-direction:column;gap:8px}
.rng-track{position:relative;height:28px;border-radius:var(--radius);background:var(--hellblau-10)}
.rng-band{position:absolute;top:0;bottom:0;border-radius:var(--radius);background:var(--dunkelblau)}
.rng-med{position:absolute;top:5px;bottom:5px;width:2px;margin-left:-1px;background:var(--weiss)}
.rng-you{position:absolute;top:-11px;width:0;height:0;margin-left:-7px;border-left:7px solid transparent;border-right:7px solid transparent;border-top:9px solid var(--tiefblau)}
.rng-scale{display:flex;justify-content:space-between;font-size:12px;line-height:18px;font-variant-numeric:tabular-nums}

/* Gesperrte Vorschau + Kauf im Ergebnis */
.t-buy{margin-top:16px;border:1px solid var(--tiefblau);border-radius:var(--radius);overflow:hidden}
.t-buy .rows{padding:4px 16px}
.t-buy-foot{display:flex;flex-direction:column;gap:10px;padding:16px;background:var(--hellblau-10)}
.rows{display:flex;flex-direction:column}
.row{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:10px 0;border-bottom:1px solid var(--line);font-size:14px;line-height:22px}
.row:last-child{border-bottom:0}
.blur{filter:blur(5px);user-select:none;font-weight:700;letter-spacing:2px;white-space:nowrap}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:8px 24px;border-radius:var(--radius);font:700 16px/22px var(--sans);text-decoration:none;cursor:pointer;border:1px solid transparent;white-space:nowrap}
.btn.l{min-height:52px}
.btn.primary{background:var(--dunkelblau);color:var(--weiss)}
.btn.secondary{background:var(--weiss);color:var(--tiefblau);border-color:var(--tiefblau)}
.btn.ghost{background:transparent;color:var(--weiss);border-color:var(--weiss)}
.btn.white{background:var(--weiss);color:var(--tiefblau)}
.btn.block{width:100%;margin-top:16px}
.btn.buy{position:relative;isolation:isolate;background:transparent;color:var(--weiss);min-height:52px;padding:8px 48px 8px 24px;border:0;border-radius:0}
.btn.buy::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--orange);border-radius:var(--radius) 0 0 var(--radius);
  -webkit-mask:linear-gradient(#000 0 0) left/calc(100% - 25px) 100% no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 52'%3E%3Cpath d='M0 0h2a8 8 0 0 1 5.7 2.4l16 18.2a8.4 8.4 0 0 1 0 10.8l-16 18.2A8 8 0 0 1 2 52H0z'/%3E%3C/svg%3E") right/26px 100% no-repeat;
  mask:linear-gradient(#000 0 0) left/calc(100% - 25px) 100% no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 52'%3E%3Cpath d='M0 0h2a8 8 0 0 1 5.7 2.4l16 18.2a8.4 8.4 0 0 1 0 10.8l-16 18.2A8 8 0 0 1 2 52H0z'/%3E%3C/svg%3E") right/26px 100% no-repeat}
.btn.buy.block{margin-top:0}
.linkbtn{font-weight:700;color:var(--tiefblau);text-decoration:underline;text-underline-offset:3px}
.btns{display:flex;flex-wrap:wrap;gap:12px;align-items:center}

/* ---------- Abschnitte ---------- */
section.s{padding-block:88px}
section.s.alt{background:var(--hellblau-10)}
section.s.alt .overline{color:var(--dunkelblau)}
section.s.dark{background:var(--dunkelblau);color:var(--weiss)}
section.s.dark h2,section.s.dark h3,section.s.dark .overline,section.s.dark .lead{color:var(--weiss)}
section.s h2{margin-bottom:16px}
.sec-head{display:flex;flex-direction:column;gap:12px;margin-bottom:40px;max-width:780px}
.sec-head h2{margin:0;font-size:clamp(28px,3.4vw,40px);line-height:1.2}
.head-row{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px 32px;margin-bottom:40px}
.head-row .sec-head{margin:0}
@media (max-width:860px){section.s{padding-block:56px}}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:32px}
.grid3>*{min-width:0}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px;align-items:start}
@media (max-width:860px){.grid3{grid-template-columns:1fr;gap:24px}.grid2{grid-template-columns:minmax(0,1fr);gap:32px}}
.feat .n,.n{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--radius);background:var(--dunkelblau);color:var(--weiss);font-weight:700;margin-bottom:12px;flex:none}
.feat h3{margin-bottom:4px}
.icon{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--radius);background:var(--dunkelblau);color:var(--weiss);flex:none}
.icon svg{width:22px;height:22px}
.icon.inv{background:var(--weiss);color:var(--dunkelblau)}

/* Kennzahlenleiste */
.stats{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px;padding-block:48px;border-bottom:1px solid var(--line)}
.stats div{display:flex;flex-direction:column;gap:4px;padding-left:16px;border-left:2px solid var(--dunkelblau)}
.stats b{font-size:34px;line-height:42px;font-variant-numeric:tabular-nums}
.stats span{font-size:14px;line-height:22px;color:var(--ink-2)}
@media (max-width:960px){.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.stats b{font-size:26px;line-height:34px}}

/* Schritte */
.step{display:flex;flex-direction:column;gap:12px}
.step-top{display:flex;align-items:center;justify-content:space-between}
.step .n{margin:0}
.big{font-size:44px;line-height:52px;font-weight:700;color:var(--dunkelblau);font-variant-numeric:tabular-nums}
.big small{font-size:18px;font-weight:300;color:var(--tiefblau)}
.msg{display:flex;flex-direction:column;gap:10px}

/* Dokument-Vorschau (Musteranalyse) */
.doc{background:var(--weiss);color:var(--tiefblau);border-radius:var(--radius);padding:28px;display:flex;flex-direction:column;gap:18px;border:1px solid var(--tiefblau)}
.doc-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;padding-bottom:14px;border-bottom:2px solid var(--tiefblau)}
.doc-head .brand{width:154px;height:35px}
.doc-head .brand img{height:60px;margin:-12.8px 0 0 -12.8px}
.doc-meta{font-size:11px;line-height:16px;text-align:right}
.doc h3{font-size:26px;line-height:32px}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chips span{display:inline-flex;align-items:center;height:26px;padding:0 10px;border:1px solid var(--tiefblau);border-radius:13px;font-size:12px;line-height:18px}
.chips span:first-child{background:var(--dunkelblau);border-color:var(--dunkelblau);color:var(--weiss);font-weight:700}
.doc-res{background:var(--hellblau-10);border-radius:var(--radius);padding:18px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px}
.doc-res .v{font-size:30px;line-height:36px;font-weight:700;font-variant-numeric:tabular-nums}
.doc-res .v small{font-size:14px;font-weight:300}
.doc-res aside{border-left:1px solid var(--tiefblau);padding-left:16px;font-size:12px;line-height:18px}
.doc-res aside b{display:block;font-size:18px;line-height:24px}
.doc-res .rng{grid-column:1/-1}
.doc-foot{display:flex;justify-content:space-between;gap:12px;font-size:11px;line-height:16px;border-top:1px solid var(--line);padding-top:10px}
.doc-foot span:last-child{white-space:nowrap}
section.s.dark .doc h3{color:var(--tiefblau)}
section.s.dark .doc .overline{color:var(--hellblau)}
.preview{position:relative}
.preview-badge{position:absolute;right:-12px;bottom:-18px;background:var(--weiss);border:1px solid var(--tiefblau);border-radius:var(--radius);padding:10px 14px;font-size:12px;line-height:18px}
.preview-badge b{display:block;font-size:14px}
@media (max-width:760px){.preview-badge{position:static;margin-top:12px;display:inline-block}.doc{padding:18px}.doc-res{grid-template-columns:minmax(0,1fr)}.doc-res aside{border-left:0;padding-left:0;border-top:1px solid var(--tiefblau);padding-top:10px}}
.anno{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:18px}
.anno li{display:grid;grid-template-columns:32px minmax(0,1fr);gap:14px;align-items:start}
.anno .pin{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:var(--weiss);color:var(--dunkelblau);font-weight:700;font-size:14px}
.anno b{display:block}
.anno span{font-size:14px;line-height:22px}
.sample{display:grid;grid-template-columns:minmax(0,560px) minmax(0,1fr);gap:64px;align-items:start}
@media (max-width:960px){.sample{grid-template-columns:minmax(0,1fr);gap:40px}}
.seals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:56px;padding-top:40px;border-top:1px solid rgba(255,255,255,.4)}
.seals div{display:flex;gap:16px;align-items:flex-start;font-size:14px;line-height:22px}
@media (max-width:860px){.seals{grid-template-columns:minmax(0,1fr)}}

/* Anlässe */
.uses{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.use{display:flex;flex-direction:column;gap:12px;padding:28px;border:1px solid var(--line);border-radius:var(--radius);background:var(--weiss);text-decoration:none;color:var(--tiefblau)}
.use h3{font-size:18px;line-height:26px}
.use p{font-size:14px;line-height:22px;color:var(--ink-2)}
.use .linkbtn{margin-top:auto;font-size:14px}
@media (max-width:960px){.uses{grid-template-columns:minmax(0,1fr)}}

/* Mietpreis-Atlas */
.atlas{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:56px;align-items:start}
.rank{display:flex;flex-direction:column;gap:12px}
.rank-row{display:grid;grid-template-columns:28px 180px minmax(0,1fr) 84px;gap:12px;align-items:center;font-size:14px;line-height:22px;text-decoration:none;color:var(--tiefblau)}
.rank-row .n0{color:var(--ink-2);font-variant-numeric:tabular-nums}
.rank-row .trk{position:relative;height:20px}
.rank-row .nb{position:absolute;top:0;bottom:0;left:0;background:var(--hellblau-10);border:1px solid var(--tiefblau);border-radius:0 6px 6px 0}
.rank-row .bs{position:absolute;top:0;bottom:0;left:0;background:var(--dunkelblau);border-radius:0 6px 6px 0}
.rank-row .avg{position:absolute;top:-6px;bottom:-6px;width:0;border-left:1px dashed var(--tiefblau)}
.rank-row .v{text-align:right;font-weight:700;font-variant-numeric:tabular-nums}
.legend{display:flex;flex-wrap:wrap;gap:4px 16px;font-size:12px;line-height:18px}
.legend span{display:inline-flex;align-items:center;gap:6px}
.legend i{display:inline-block;width:12px;height:12px;border-radius:3px;background:var(--dunkelblau)}
.legend i.l{background:var(--hellblau-10);border:1px solid var(--tiefblau)}
.facts{display:flex;flex-direction:column}
.facts div{padding:16px 0;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:2px}
.facts div:first-child{padding-top:0}
.facts b{font-size:24px;line-height:30px;font-variant-numeric:tabular-nums}
.facts span{font-size:14px;line-height:22px;color:var(--ink-2)}
.az{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:24px;margin-top:48px;padding-top:40px;border-top:1px solid var(--line)}
.az div{display:flex;flex-direction:column;gap:4px;font-size:14px;line-height:22px}
.az b{font-size:16px;margin-top:12px}
.az b:first-child{margin-top:0}
.az a{color:var(--tiefblau);text-decoration:none}
@media (max-width:960px){.atlas{grid-template-columns:minmax(0,1fr)}.az{grid-template-columns:repeat(2,minmax(0,1fr))}.rank-row{grid-template-columns:22px 110px minmax(0,1fr) 64px}}

/* Methodik */
.pipe{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.pipe div{background:var(--weiss);border:1px solid var(--tiefblau);border-radius:var(--radius);padding:24px;display:flex;flex-direction:column;gap:8px}
.pipe .n{margin-bottom:4px}
.pipe h3{font-size:18px;line-height:26px}
.pipe p{font-size:14px;line-height:22px;color:var(--ink-2)}
.pipe .last{background:var(--dunkelblau);border-color:var(--dunkelblau);color:var(--weiss)}
.pipe .last h3,.pipe .last p{color:var(--weiss)}
.pipe .last .n{background:var(--weiss);color:var(--dunkelblau)}
@media (max-width:860px){.pipe{grid-template-columns:minmax(0,1fr)}}

/* Über moovin */
.about{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:center}
.about-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.about-stats div{border-radius:var(--radius);border:1px solid rgba(255,255,255,.4);padding:24px;display:flex;flex-direction:column;gap:4px}
.about-stats b{font-size:36px;line-height:44px;font-variant-numeric:tabular-nums}
.about-stats span{font-size:14px;line-height:22px}
@media (max-width:860px){.about{grid-template-columns:minmax(0,1fr);gap:32px}}

/* Ratgeber-Teaser */
.rg-feat{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:32px}
.rg-big{display:flex;flex-direction:column;justify-content:flex-end;gap:12px;min-height:380px;padding:40px;border-radius:var(--radius);background:var(--dunkelblau);color:var(--weiss);text-decoration:none}
.rg-big h3{color:var(--weiss);font-size:30px;line-height:38px}
.rg-big .tag{align-self:flex-start}
.rg-list{display:flex;flex-direction:column}
.rg-list a{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line);text-decoration:none;color:var(--tiefblau);font-weight:700}
.rg-list a:first-child{padding-top:0}
.rg-list small{display:block;font-weight:300;font-size:12px;line-height:18px;color:var(--ink-2)}
.rg-list a::after{content:"→";font-weight:700}
@media (max-width:860px){.rg-feat{grid-template-columns:minmax(0,1fr)}.rg-big{min-height:0}}
.faq2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 56px}
@media (max-width:860px){.faq2{grid-template-columns:minmax(0,1fr)}}
.cta-band{background:var(--dunkelblau);color:var(--weiss);border-radius:var(--radius);padding:48px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px}
.cta-band h2{color:var(--weiss);margin:0}
@media (max-width:760px){.cta-band{padding:28px 20px}}

/* Analyse-Angebot (alle Seiten) */
.offer{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:56px;align-items:start}
.offer-card{background:var(--weiss);border:1px solid var(--tiefblau);border-radius:var(--radius);padding:28px;display:flex;flex-direction:column;gap:14px}
.offer-card .amt{font-size:52px;line-height:60px;font-weight:700;font-variant-numeric:tabular-nums}
@media (max-width:960px){.offer{grid-template-columns:minmax(0,1fr);gap:32px}}

/* Stadtseiten */
.subnav{position:sticky;top:64px;z-index:20;background:var(--weiss);border-bottom:1px solid var(--line)}
.subnav .wrap{display:flex;gap:28px;min-height:52px;align-items:center;font-size:14px;font-weight:700;overflow-x:auto}
.subnav a{color:var(--tiefblau);text-decoration:none;white-space:nowrap}
@media (max-width:760px){.subnav{top:56px}}
.kpis--s .v{font-size:18px!important;line-height:26px!important}
.plzbars{display:flex;flex-direction:column;gap:10px}
.plzbar{display:grid;grid-template-columns:170px minmax(0,1fr) 72px;gap:14px;align-items:center;font-size:14px;line-height:22px;text-decoration:none;color:var(--tiefblau)}
.plzbar .trk{position:relative;height:16px;border-radius:8px;background:var(--hellblau-10)}
.plzbar .bnd{position:absolute;top:0;bottom:0;border-radius:8px;background:var(--dunkelblau)}
.plzbar .md{position:absolute;top:3px;bottom:3px;width:2px;margin-left:-1px;background:var(--weiss)}
.plzbar .ref{position:absolute;top:-4px;bottom:-4px;width:0;border-left:1px dashed var(--tiefblau)}
.plzbar .v{text-align:right;font-weight:700;font-variant-numeric:tabular-nums}
@media (max-width:760px){.plzbar{grid-template-columns:96px minmax(0,1fr) 60px;gap:8px}}
details.all{border:1px solid var(--line);border-radius:var(--radius);padding:0;margin-top:32px}
details.all>summary{padding:16px 20px}
details.all .tbl{margin:0;border:0;border-top:1px solid var(--line);border-radius:0}
.factbox{border:1px solid var(--tiefblau);border-radius:var(--radius);padding:20px 24px;background:var(--weiss)}
.factbox h3{margin-bottom:8px}
.factbox dl{margin:0;display:grid;grid-template-columns:max-content 1fr;gap:6px 24px;font-size:14px;line-height:22px}
.factbox dt{font-weight:700}
.factbox dd{margin:0}

/* Bestellformular /analyse/ */
.order{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:48px;align-items:start}
.order aside{position:sticky;top:88px}
@media (max-width:960px){.order{grid-template-columns:minmax(0,1fr)}.order aside{position:static}}
.fs{padding:0 0 32px;display:flex;flex-direction:column;gap:20px}
.fs+.fs{border-top:1px solid var(--line);padding-top:32px}
.fs h2{font-size:24px;line-height:30px;margin:0}
.q{display:flex;flex-direction:column;gap:8px}
.opts{display:flex;flex-wrap:wrap;gap:8px}
.opt{position:relative;display:inline-flex}
.opt input{position:absolute;opacity:0;width:1px;height:1px}
.opt span{display:inline-flex;align-items:center;min-height:40px;padding:6px 16px;border:1px solid var(--tiefblau);border-radius:var(--radius);font-size:14px;line-height:20px;font-weight:700;cursor:pointer;background:var(--weiss)}
.opt input:checked+span{background:var(--dunkelblau);border-color:var(--dunkelblau);color:var(--weiss)}
.opt input:focus-visible+span{outline:2px solid var(--hellblau);outline-offset:2px}
.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.two .field{margin:0}
@media (max-width:640px){.two{grid-template-columns:minmax(0,1fr)}}
.check-l{display:flex;gap:12px;align-items:flex-start;font-size:14px;line-height:22px}
.check-l input{width:20px;height:20px;margin:1px 0 0;flex:none;accent-color:var(--dunkelblau)}
.steps-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;font-size:14px;line-height:22px;font-weight:700}
.steps-bar span{display:inline-flex;align-items:center;gap:8px}
.steps-bar i{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:6px;border:1px solid var(--tiefblau);font-style:normal;font-size:12px}
.steps-bar .on i{background:var(--dunkelblau);border-color:var(--dunkelblau);color:var(--weiss)}
.steps-bar .sep{width:32px;height:1px;background:var(--line)}
.sumbox{border:1px solid var(--tiefblau);border-radius:var(--radius);padding:24px;display:flex;flex-direction:column;gap:14px;background:var(--weiss)}
.sumbox h2{font-size:24px;line-height:30px;margin:0}
.loc{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 20px;border:1px solid var(--line);border-radius:var(--radius)}

/* Listen, Tabellen, FAQ */
.price{display:grid;grid-template-columns:auto 1fr;gap:40px;align-items:start}
@media (max-width:760px){.price{grid-template-columns:1fr;gap:16px}}
.price .amt{font-size:56px;line-height:64px;font-weight:700}
.price .amt small{display:block;font-size:14px;line-height:22px;font-weight:300}
ul.check{list-style:none;padding:0;margin:16px 0 0;display:grid;gap:8px}
ul.check li{padding-left:28px;position:relative}
ul.check li::before{content:"✓";position:absolute;left:0;color:var(--dunkelblau);font-weight:700}
section.s.dark ul.check li::before{color:var(--weiss)}
.cities{columns:4 200px;column-gap:32px;margin-top:16px;padding:0;list-style:none}
.cities li{break-inside:avoid;padding:4px 0}
.cities a{color:var(--tiefblau);text-decoration:none;font-weight:700}
.cities small{color:var(--ink-2);font-weight:300}
details{border-bottom:1px solid var(--line);padding:16px 0}
details summary{cursor:pointer;font-weight:700;list-style:none;display:flex;justify-content:space-between;gap:16px}
details summary::-webkit-details-marker{display:none}
details summary::after{content:"+";font-weight:700}
details[open] summary::after{content:"–"}
details p{margin-top:8px;max-width:72ch}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:24px}
.kpis>div{background:var(--weiss);border:1px solid var(--line);border-radius:var(--radius);padding:16px;min-width:0}
.kpis .k{font-size:12px;line-height:18px;font-weight:700}
.kpis .v{font-size:24px;line-height:30px;font-weight:700;font-variant-numeric:tabular-nums;margin-top:4px}
.kpis .h{font-size:12px;line-height:18px;color:var(--ink-2)}
@media (max-width:860px){.kpis{grid-template-columns:repeat(2,1fr);gap:8px}}
.tbl{overflow-x:auto;margin-top:16px;border:1px solid var(--line);border-radius:var(--radius)}
table{border-collapse:collapse;width:100%;font-size:14px;line-height:22px}
th,td{padding:8px 12px;text-align:left;border-bottom:1px solid var(--line);white-space:nowrap}
th{font-weight:700;background:var(--hellblau-10)}
td.r,th.r{text-align:right;font-variant-numeric:tabular-nums}
td a{color:var(--tiefblau);font-weight:700}
tr:last-child td{border-bottom:0}
.crumb{font-size:12px;line-height:18px;margin-bottom:8px}
.crumb a{color:var(--tiefblau)}
.prose{max-width:72ch}
.prose p+p{margin-top:12px}
.prose h2{margin-top:32px;margin-bottom:8px;font-size:24px;line-height:30px}
.note{background:#faf0d2;border:1px solid #ffaa00;border-radius:var(--radius);padding:12px 16px;font-size:14px;line-height:22px}

/* ---------- Footer ---------- */
footer{background:var(--dunkelblau);color:var(--weiss);padding-block:56px 40px;margin-top:64px;font-size:14px;line-height:22px}
footer .wrap{display:grid;gap:20px}
footer a{color:var(--weiss);text-decoration:none}
footer .row{display:flex;flex-wrap:wrap;gap:8px 24px;font-weight:700}
footer .legal{font-size:12px;line-height:18px;opacity:.9}
footer .legal b{opacity:1}
.mega{display:grid;grid-template-columns:1.4fr repeat(4,minmax(0,1fr));gap:32px;padding-bottom:32px;border-bottom:1px solid rgba(255,255,255,.4)}
.mega h3{color:var(--weiss);font-size:14px;line-height:22px;margin-bottom:12px}
.mega ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.mega .brand{width:204px;height:46px}
@media (max-width:860px){.mega{grid-template-columns:repeat(2,minmax(0,1fr))}.mega>div:first-child{grid-column:1/-1}}

/* ---------- Ratgeber ---------- */
.fine{font-size:12px;line-height:18px;color:var(--tiefblau);margin-top:8px}
.rg-hero{padding-block:40px 8px}
.rg-hero .lead{margin-top:8px}
.meta{font-size:14px;line-height:22px;color:var(--ink-2);margin-top:16px}
.rg-body{padding-block:24px 64px}
.rg-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:64px;align-items:start}
.rg-aside{position:sticky;top:88px}
@media (max-width:960px){.rg-grid{grid-template-columns:minmax(0,1fr);gap:32px}.rg-aside{position:static}.rg-hero{padding-block:24px 0}}
.kurz{background:var(--hellblau-10);border-radius:var(--radius);padding:16px 24px;margin-bottom:24px}
.kurz p{margin-top:8px}
.prose ul,.prose ol{padding-left:24px;margin:12px 0}
.prose li+li{margin-top:8px}
.prose h3{margin-top:24px;margin-bottom:8px}
.prose .tbl{margin:16px 0 8px}
.prose .note{margin:16px 0}
.prose th,.prose td{white-space:normal;vertical-align:top}
.prose .fine{margin:0 0 12px}
.src{font-size:14px;line-height:22px;color:var(--ink-2)}
.rg-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:24px}
.rg-cards>*{min-width:0}
.rg-card{display:block;text-decoration:none;color:var(--tiefblau);background:var(--weiss);border:1px solid var(--line);border-radius:var(--radius);padding:24px}
.rg-card h3{font-size:20px;line-height:28px;margin:8px 0 4px}
.rg-card p{font-size:14px;line-height:22px}
@media (max-width:860px){.rg-cards{grid-template-columns:1fr;gap:16px}}
@media (max-width:440px){.nav .hide-xs{display:none}}
@media (max-width:400px){.top .brand{width:128px;height:29px}.top .brand img{height:50px;margin:-10.7px 0 0 -10.7px}}
@media (max-width:960px){.nav .btn .hide-sm{display:none}}
@media (max-width:350px){.nav .btn{display:none}.stats b{font-size:22px;line-height:30px}.about-stats b{font-size:28px;line-height:36px}}

/* Stadtseiten und Mietreport */
.vt li+li{margin-top:12px}
.grid2r{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px}
@media (max-width:860px){.grid2r{grid-template-columns:minmax(0,1fr);gap:32px}}