/* Preise: Tarifkarten, Vergleichstabelle, Grenzen, Weg zu Pro */
.pr-tarife{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;max-width:960px;margin:40px 0 0}
.pr-tarif{background:#1E1E1E;border:2px solid transparent;border-radius:12px;padding:32px 30px;display:flex;flex-direction:column;gap:18px}
.pr-tarif.pro{background:linear-gradient(#1E1E1E,#1E1E1E) padding-box,linear-gradient(135deg,#E0246B,#FF8A5C) border-box}
.pr-name{font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-text)}
.pr-betrag{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.pr-betrag b{font-family:var(--f-display);font-size:60px;line-height:1;letter-spacing:-.04em;color:#fff}
.pr-betrag span{color:#A3A3A3;font-size:15px}
.pr-kont{background:#161616;border:1px solid #2A2A2A;border-radius:8px;padding:12px 14px}
.pr-kont .zeile{display:flex;justify-content:space-between;font-size:13px;color:#A3A3A3;margin-bottom:8px}
.pr-kont .zeile b{color:#fff}
.pr-kont .balken{height:8px;border-radius:4px;background:#333;overflow:hidden}
.pr-kont .balken i{display:block;height:100%;width:50%;border-radius:4px;background:linear-gradient(90deg,#E0246B,#FF8A5C);animation:pr-fuellen 5s ease-in-out infinite}
.pro .pr-kont .balken i{width:20%;animation-name:pr-fuellen-pro}
@keyframes pr-fuellen{0%,70%{width:50%}82%{width:0}100%{width:50%}}
@keyframes pr-fuellen-pro{0%,70%{width:20%}82%{width:0}100%{width:20%}}
.pr-tarif ul{list-style:none;margin:0;padding:0;display:grid;gap:10px;font-size:15.5px;color:#D6D6D6}
.pr-tarif li{padding-left:26px;position:relative}
.pr-tarif li::before{content:"";position:absolute;left:3px;top:4px;width:7px;height:12px;border:solid #FF6E9E;border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}
.pr-tarif .btn{align-self:flex-start;margin-top:auto}
.pr-klein{font-size:13px;color:#9A9A9A}
.pr-tab{max-width:960px;margin:36px 0 0;overflow-x:auto}
.pr-tab .cmp{width:100%;border-collapse:collapse;font-size:15px;color:#D6D6D6;background:none}
.pr-tab .cmp th,.pr-tab .cmp td{padding:14px 16px;border:0;border-bottom:1px solid #2A2A2A;text-align:center;background:none}
.pr-tab .cmp td:first-child,.pr-tab .cmp th:first-child{text-align:left}
.pr-tab .cmp thead th{color:#fff;font-size:15px;font-weight:800;padding-bottom:16px}
.pr-tab .cmp .ib{background:rgba(224,36,107,.10)!important;color:#fff}
.pr-tab .cmp thead th.ib{color:var(--accent-text);border-radius:8px 8px 0 0}
.pr-tab .cmp tr.gruppe td{color:var(--accent-text);font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding-top:30px;font-family:inherit}
.pr-tab .cmp .nein{color:#666}
.pr-grenzen{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;max-width:1080px;margin:36px 0 0}
.pr-grenzen div{background:#1E1E1E;border-radius:8px;padding:28px}
.pr-grenzen b{display:block;font-family:var(--f-display);font-size:64px;line-height:1;letter-spacing:-.04em;background:linear-gradient(135deg,#E0246B,#FF8A5C);-webkit-background-clip:text;background-clip:text;color:transparent}
.pr-grenzen span{display:block;font-weight:800;color:#fff;margin-top:12px}
.pr-grenzen p{font-size:15px;color:#A3A3A3;margin-top:8px}
.pr-weg{display:grid;grid-template-columns:1.5fr 1fr;gap:40px;align-items:center;margin-top:36px}
.pr-schritte{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.pr-schritte li{background:#1E1E1E;border-radius:8px;padding:24px}
.pr-schritte .n{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-text)}
.pr-schritte h3{font-size:19px;color:#fff;margin:10px 0 8px}
.pr-schritte p{font-size:15px;color:#A3A3A3;margin:0}
.pr-mock{background:#161616;border:1px solid #2A2A2A;border-radius:12px;padding:22px;display:grid;gap:10px;box-shadow:0 30px 60px -30px rgba(0,0,0,.8)}
.pr-mock p{font-size:14.5px;color:#F2F2F2;margin:0}
.pr-mock .mut{font-size:13.5px;color:#A3A3A3}
.pr-mock .knoepfe{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-top:4px}
.pr-mock .knoepfe span{background:linear-gradient(135deg,#E0246B,#FF5A7E);color:#fff;font-weight:800;font-size:14px;border-radius:8px;padding:9px 15px}
.pr-mock .knoepfe u{font-size:13.5px;color:#A3A3A3}
.pr-mock .zaehler{font-size:12.5px;color:#9A9A9A;border-top:1px dashed #3A3A3A;padding-top:10px;margin-top:4px}
html.ani .pr-tarif{opacity:0;transform:translateY(20px);animation:sc-hoch .8s cubic-bezier(.2,.7,.2,1) .25s forwards}
html.ani .pr-tarif.pro{animation-delay:.4s}
@media (prefers-reduced-motion:reduce){html.ani .pr-tarif{opacity:1;transform:none;animation:none}}
@media (max-width:900px){.pr-weg{grid-template-columns:1fr}}
@media (max-width:760px){.pr-tarife,.pr-grenzen{grid-template-columns:1fr}.pr-schritte{grid-template-columns:1fr}.pr-tab .cmp{font-size:13.5px}.pr-tab .cmp th,.pr-tab .cmp td{padding:11px 8px}}
@media (prefers-reduced-motion:reduce){.pr-kont .balken i{animation:none}}
/* Hero wie die alte Seite: ohne Foto, zentriert, Tarife direkt darunter */
.pr-hero{background:transparent!important;text-align:center;padding:72px 0 40px!important}
.pr-hero .crumbs{color:#BDBDBD;font-size:14px;font-weight:600;margin:0 0 20px}
.pr-hero .crumbs a{color:#fff;text-decoration:none}
.pr-hero .sc-titel{max-width:17em!important;margin:0 auto}
.pr-lead{color:#BDBDBD;font-size:18px;line-height:1.6;max-width:44em;margin:26px auto 0}
.pr-hero .pr-tarife{margin:48px auto 0;text-align:left}