/* PROCITO „Werde Partner" – Widget-Styles (gescoped unter #pp-root, damit
   das Theme SAF21 nicht kollidiert). Reduzierter Stil, keine Verläufe. */
#pp-root{--ink:#141428;--text:#55575f;--line:#e7e7e4;--soft:#f7f7f5;--mint:#02f4b4;
  color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased}
#pp-root *{box-sizing:border-box;font-family:apercu,"Segoe UI",system-ui,Arial,sans-serif}
#pp-root .wrap{max-width:1020px;margin:0 auto;padding:0 28px}
#pp-root a{color:inherit}

#pp-root .eyebrow{font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#a0a3ab}
#pp-root h1{font-size:50px;font-weight:800;letter-spacing:-.02em;line-height:1.06;margin:0;color:var(--ink)}
#pp-root h2{font-size:30px;font-weight:800;letter-spacing:-.01em;line-height:1.15;margin:0;color:var(--ink)}
#pp-root h3{color:var(--ink)}
#pp-root .lead{color:var(--text);font-size:18px;max-width:640px;margin-top:16px}
#pp-root .mint-underline{background:var(--mint);color:var(--ink);padding:.04em .16em;-webkit-box-decoration-break:clone;box-decoration-break:clone}

#pp-root .btn{display:inline-flex;align-items:center;font-size:15px;font-weight:700;padding:13px 24px;border-radius:6px;border:1.5px solid var(--ink);cursor:pointer;text-decoration:none;transition:.15s;background:var(--ink);color:#fff}
#pp-root .btn:hover{background:#fff;color:var(--ink)}
#pp-root .btn:disabled{opacity:.5;cursor:default}

#pp-root .pp-sec{padding:72px 0;border-top:1px solid var(--line)}
#pp-root .pp-hero{padding:64px 0 56px;border-top:none}
#pp-root .pp-hero .eyebrow{display:block;margin-bottom:22px}
#pp-root .pp-hero .lead{font-size:20px;max-width:620px}
#pp-root .pp-hero .btn{margin-top:34px}

/* Vorteile: ruhige 4-Spalten, nur dünne Oberlinie, keine Karten */
#pp-root .cols{display:grid;grid-template-columns:repeat(4,1fr);gap:0 34px;margin-top:40px}
@media(max-width:820px){#pp-root .cols{grid-template-columns:1fr 1fr;gap:34px}}
@media(max-width:520px){#pp-root .cols{grid-template-columns:1fr}}
#pp-root .col{padding-top:20px;border-top:2px solid var(--ink)}
#pp-root .col h3{font-size:17px;font-weight:800;margin:0 0 8px}
#pp-root .col p{color:var(--text);font-size:15px;margin:0}

/* Wen wir suchen */
#pp-root .reqgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px 40px;margin-top:34px}
@media(max-width:620px){#pp-root .reqgrid{grid-template-columns:1fr}}
#pp-root .reqitem{display:flex;gap:14px;font-size:17px;line-height:1.5;align-items:baseline}
#pp-root .reqitem .mk{color:var(--mint);font-weight:800;flex:none}
#pp-root .soft{background:var(--soft)}

/* Ablauf */
#pp-root .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:42px}
@media(max-width:720px){#pp-root .steps{grid-template-columns:1fr;gap:30px}}
#pp-root .step .n{font-size:40px;font-weight:800;color:var(--line);letter-spacing:-.02em;line-height:1}
#pp-root .step h3{font-size:18px;font-weight:800;margin:10px 0 6px}
#pp-root .step p{color:var(--text);font-size:15px;margin:0}

/* Formular */
#pp-root .formhead{margin-bottom:26px}
#pp-root .grouplabel{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#a0a3ab;margin:30px 0 14px;padding-bottom:8px;border-bottom:1px solid var(--line)}
#pp-root .grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media(max-width:620px){#pp-root .grid2{grid-template-columns:1fr}}
#pp-root .field label{display:block;font-size:13px;font-weight:600;color:#6c6f77;margin-bottom:6px}
#pp-root .field .star{color:#b94a48}
#pp-root .inp,#pp-root .sel{width:100%;border:1px solid #d7d7d2;border-radius:6px;padding:11px 12px;font-size:15px;background:#fff;color:var(--ink);font-family:inherit}
#pp-root .inp:focus,#pp-root .sel:focus{outline:none;border-color:var(--ink)}
#pp-root textarea.inp{min-height:96px;resize:vertical}
#pp-root .optgrid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px 22px}
@media(max-width:620px){#pp-root .optgrid{grid-template-columns:1fr 1fr}}
#pp-root .opt{display:flex;align-items:center;gap:10px;font-size:15px;color:#3b3d44;cursor:pointer}
#pp-root .opt input{width:17px;height:17px;accent-color:var(--ink)}
#pp-root .fieldgap{margin-top:18px}
#pp-root .consent{display:flex;gap:11px;align-items:flex-start;margin-top:26px;font-size:13.5px;color:var(--text)}
#pp-root .consent input{margin-top:3px;width:17px;height:17px;accent-color:var(--ink);flex:none}
#pp-root .consent a{color:var(--ink)}

/* Pricing / 3D */
#pp-root .price3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:36px}
@media(max-width:820px){#pp-root .price3{grid-template-columns:1fr}}
#pp-root .pcard{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff}
#pp-root .pview{height:210px;background:#fbfbfa;border-bottom:1px solid var(--line);position:relative;cursor:grab}
#pp-root .pview canvas{display:block;width:100%;height:100%}
#pp-root .pdim{position:absolute;left:10px;bottom:10px;background:var(--ink);color:#fff;font-size:12px;font-weight:700;padding:5px 9px;border-radius:5px}
#pp-root .pdim .k{color:var(--mint);margin-right:5px}
#pp-root .phint{position:absolute;right:10px;top:10px;font-size:11px;color:#a7a79f}
#pp-root .pbody{padding:15px 16px}
#pp-root .pbody .nm{font-weight:800;font-size:15px}
#pp-root .pbody .meta{color:var(--text);font-size:13px;margin-top:2px}
#pp-root .pin{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:13px}
#pp-root .pin label{display:block;font-size:11px;font-weight:600;color:#6c6f77;margin-bottom:4px}
#pp-root .pdl{display:flex;gap:8px;margin-top:12px}
#pp-root .dl{flex:1;text-align:center;font-size:12.5px;font-weight:700;padding:8px 6px;border:1.5px solid var(--ink);border-radius:5px;text-decoration:none;color:var(--ink);background:#fff;transition:.15s;white-space:nowrap}
#pp-root .dl:hover{background:var(--ink);color:#fff}

/* Status / Meldungen */
#pp-root .pp-status{margin-top:18px;font-size:15px;padding:13px 16px;border-radius:6px;display:none}
#pp-root .pp-status.err{display:block;background:#fdecea;color:#8a2b22;border:1px solid #f3c6c0}
#pp-root .pp-status.ok{display:block;background:#eafaf1;color:#1b6b43;border:1px solid #bfe8d0}
#pp-root .pp-done{display:none;text-align:center;padding:40px 0}
#pp-root .pp-done h2{margin-bottom:12px}
