/* Paket P1 (Kernseiten) – ergänzende Bausteine im Designsystem.
   Nur Farb-Variablen var(--w-…), damit Hell und Dunkel funktionieren. Stand 25.09.2026 */

/* Karten-Raster */
.p1-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px}
.p1-grid.p1-2{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.p1-card{padding:24px 24px 22px;border-radius:18px;display:flex;flex-direction:column;gap:8px}
.p1-card h3{font-family:var(--w-disp);font-size:18px;line-height:1.3;margin:0;color:var(--w-text)}
.p1-card p{margin:0;color:var(--w-t2);font-size:15px;line-height:1.65}
.p1-card ul{margin:4px 0 0;padding-left:18px;color:var(--w-t2);font-size:14.5px;line-height:1.7}
.p1-card-link{margin-top:auto;padding-top:8px;color:var(--w-link);font-weight:600;font-size:14.5px;text-decoration:none}
.p1-card-link:hover{text-decoration:underline}
.p1-card .p1-price{font-family:var(--w-disp);font-size:24px;font-weight:700;color:var(--w-text)}
.p1-card .p1-tag{align-self:flex-start;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--w-eyebrow);background:rgba(14,165,233,.12);border-radius:99px;padding:4px 12px}

/* Schritte */
.p1-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;counter-reset:none}
.p1-steps li{padding:24px;border-radius:18px;position:relative}
.p1-steps h3{font-family:var(--w-disp);font-size:17px;margin:12px 0 6px;color:var(--w-text)}
.p1-steps p{margin:0;color:var(--w-t2);font-size:14.5px;line-height:1.65}
.p1-step-n{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:var(--w-grad);color:#fff;font-weight:700;font-family:var(--w-disp)}

/* Hinweisbox */
.p1-note{background:var(--w-surf-solid);border:1px solid var(--w-border);border-left:4px solid var(--w-blue);border-radius:14px;padding:18px 22px;margin:22px 0;color:var(--w-t2);font-size:15px;line-height:1.7}
.p1-note strong{color:var(--w-text)}
.p1-note.p1-warn{border-left-color:var(--w-amber)}

/* Tabellen */
.p1-table-wrap{overflow-x:auto;margin:22px 0;border:1px solid var(--w-border);border-radius:14px;background:var(--w-surf-solid)}
.p1-table{width:100%;border-collapse:collapse;font-size:14.5px;min-width:560px}
.p1-table th{background:rgba(14,165,233,.10);color:var(--w-text);text-align:left;padding:13px 16px;font-family:var(--w-disp);font-size:13.5px;border-bottom:1px solid var(--w-border)}
.p1-table td{padding:12px 16px;color:var(--w-t2);line-height:1.6;border-bottom:1px solid var(--w-border);vertical-align:top}
.p1-table tr:last-child td{border-bottom:none}
.p1-table td strong{color:var(--w-text)}

/* Fließtext-Breite in Abschnitten */
.p1-narrow{max-width:860px;margin:0 auto}
.section .ak-prose{max-width:860px;margin-left:auto;margin-right:auto}

/* Store-Badges / App */
.p1-stores{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px}
.p1-store{display:inline-flex;align-items:center;gap:10px;padding:11px 18px;border-radius:14px;border:1px solid var(--w-border-h);background:var(--w-surf-solid);color:var(--w-text);text-decoration:none;font-weight:600;font-size:15px;min-height:48px}
.p1-store:hover{border-color:var(--w-blue)}
.p1-store small{display:block;font-size:11.5px;font-weight:500;color:var(--w-t3)}
.page-hero2 .p1-store{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.28);color:#fff}
.page-hero2 .p1-store small{color:rgba(255,255,255,.75)}

/* Zwei-Spalten Text + Bild */
.p1-split{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center}
.p1-split img{width:100%;height:auto;border-radius:20px;border:1px solid var(--w-border);box-shadow:var(--w-shadow-light)}
@media (max-width:880px){.p1-split{grid-template-columns:1fr;gap:26px}}

/* Kennzahlen */
.p1-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin:6px 0 0}
.p1-stat{background:var(--w-surf-solid);border:1px solid var(--w-border);border-radius:16px;padding:18px}
.p1-stat b{display:block;font-family:var(--w-disp);font-size:24px;color:var(--w-text)}
.p1-stat span{font-size:13.5px;color:var(--w-t2)}

/* Formulare (Angebot, Kontolöschung) */
.p1-form{background:var(--w-surf-solid);border:1px solid var(--w-border);border-radius:22px;padding:clamp(20px,4vw,36px);box-shadow:var(--w-shadow-light);max-width:820px;margin:0 auto}
.p1-form fieldset{border:0;margin:0 0 22px;padding:0}
.p1-form legend{font-family:var(--w-disp);font-weight:700;font-size:17px;color:var(--w-text);margin-bottom:12px;padding:0}
.p1-form .p1-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:640px){.p1-form .p1-row{grid-template-columns:1fr}}
.p1-form label{display:block;font-size:14px;font-weight:600;color:var(--w-text);margin:0 0 6px}
.p1-form .p1-field{margin-bottom:14px}
.p1-form input[type=text],.p1-form input[type=email],.p1-form input[type=tel],.p1-form input[type=number],.p1-form select,.p1-form textarea{width:100%;box-sizing:border-box;padding:12px 14px;border-radius:12px;border:1px solid var(--w-border-h);background:var(--w-bg);color:var(--w-text);font:inherit;font-size:16px;min-height:48px}
.p1-form textarea{min-height:110px;resize:vertical}
.p1-form input:focus,.p1-form select:focus,.p1-form textarea:focus{outline:2px solid var(--w-blue);outline-offset:1px;border-color:var(--w-blue)}
.p1-form .p1-check{display:flex;gap:10px;align-items:flex-start;font-weight:400;color:var(--w-t2);font-size:14px;line-height:1.55}
.p1-form .p1-check input{margin-top:3px;width:18px;height:18px;flex:none;accent-color:var(--w-blue)}
.p1-form .p1-hint{font-size:13px;color:var(--w-t3);margin-top:6px}
.p1-form button[type=submit]{width:100%;justify-content:center;border:0;cursor:pointer;font:inherit}
.p1-chips{display:flex;flex-wrap:wrap;gap:10px}
.p1-chips label{margin:0}
.p1-chips input{position:absolute;opacity:0;width:1px;height:1px}
.p1-chips span{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:99px;border:1px solid var(--w-border-h);background:var(--w-bg);color:var(--w-text);font-weight:600;font-size:14.5px;cursor:pointer;min-height:44px;box-sizing:border-box}
.p1-chips input:checked+span{background:var(--w-blue);border-color:var(--w-blue);color:#fff}
.p1-chips input:focus-visible+span{outline:2px solid var(--w-blue);outline-offset:2px}
.p1-msg{display:none;margin-top:16px;padding:14px 16px;border-radius:12px;font-size:15px;line-height:1.6}
.p1-msg.ok{display:block;background:rgba(16,185,129,.12);color:var(--w-text);border:1px solid rgba(16,185,129,.4)}
.p1-msg.err{display:block;background:rgba(239,68,68,.10);color:var(--w-text);border:1px solid rgba(239,68,68,.4)}
.p1-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}

/* Standorte-Liste */
.p1-orte{display:flex;flex-wrap:wrap;gap:10px;list-style:none;margin:0;padding:0}
.p1-orte a,.p1-orte span{display:inline-block;padding:9px 16px;border-radius:99px;border:1px solid var(--w-border);background:var(--w-surf-solid);color:var(--w-text);text-decoration:none;font-size:14.5px}
.p1-orte a:hover{border-color:var(--w-blue);color:var(--w-link)}

/* Themen-Sprungleiste (FAQ) */
.p1-katnav{padding:26px 0 6px;background:var(--w-bg)}
.p1-katnav .p1-orte{justify-content:center}
.section[id^="kat-"],[id^="q-"]{scroll-margin-top:90px}

/* App-Screenshots / Videos (waagerecht wischbar, nur innerhalb des Rahmens) */
.p1-shots{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(200px,230px);gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 2px 16px;-webkit-overflow-scrolling:touch}
.p1-shots figure{margin:0;scroll-snap-align:start}
.p1-shots img,.p1-shots video{display:block;width:100%;height:auto;border-radius:22px;border:1px solid var(--w-border);background:var(--w-surf-solid);box-shadow:var(--w-shadow-sm)}
.p1-shots figcaption{font-size:13.5px;color:var(--w-t2);margin-top:8px;text-align:center}
.p1-shots figcaption b{display:block;color:var(--w-text);font-size:14.5px}
.p1-hint-c{font-size:13.5px;color:var(--w-t3);text-align:center;margin:6px 0 0}
.p1-video{max-width:900px;margin:0 auto}
.p1-video video{display:block;width:100%;height:auto;border-radius:20px;border:1px solid var(--w-border);background:#000}
.p1-store-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;max-width:900px;margin:0 auto}
.p1-store-card{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:28px 22px;border-radius:20px;text-decoration:none;color:var(--w-text)}
.p1-store-card h2,.p1-store-card h3{font-family:var(--w-disp);font-size:20px;margin:0}
.p1-store-card p{margin:0 0 10px;color:var(--w-t2);font-size:14.5px;line-height:1.6}
.p1-store-card .btn{margin-top:auto}
.p1-store-card:hover{border-color:var(--w-blue)}
.page-hero2 .p1-stores{justify-content:center}

/* Rechtstexte (Kontolöschung) */
.p1-legal .p1-stand{font-size:13.5px;color:var(--w-t3)}
.p1-legal .p1-stepbox{margin:16px 0;padding:20px 22px}
.p1-legal .p1-stepbox p{margin:0 0 8px}
.p1-legal .p1-stepbox p:last-child{margin:0}
.p1-legal .p1-stepbox .p1-step-n{width:28px;height:28px;font-size:14px;margin-right:10px;vertical-align:middle}
.p1-legal .p1-addr{margin-left:1rem}
.p1-legal code{overflow-wrap:anywhere}

/* Artikel-Abschnitte: Kopf, Text, Tabellen auf einer Lesebreite */
.p1-article .wrap{max-width:980px}
.p1-article .ak-prose,.p1-article .p1-narrow{max-width:none;margin-left:0;margin-right:0}
.p1-article .sec-head{max-width:none}

/* Presse */
.p1-logo-img{display:flex;align-items:center;justify-content:center;height:120px;border-radius:14px;background:var(--w-bg2);margin-bottom:6px}
.p1-logo-img.p1-logo-dark{background:#0A1C3A}
.p1-logo-img img{max-height:96px;width:auto}
.p1-quote{margin:0}
.p1-quote blockquote{margin:0;font-size:16.5px;line-height:1.6;color:var(--w-text);font-family:var(--w-disp)}
.p1-quote figcaption{color:var(--w-t3);font-size:14px;margin-top:10px}
.p1-ortlinks{font-size:14px!important;margin-top:auto!important;padding-top:6px}
.p1-ortlinks a{color:var(--w-link);font-weight:600;text-decoration:none}
.p1-ortlinks a:hover{text-decoration:underline}
.p1-sub{font-family:var(--w-disp);font-size:18px;color:var(--w-text);margin:34px 0 14px}