/* TP Prozesskostenfinanzierungs GmbH — Design D (Swiss / Strukturiert) */

@import url('https://fonts.googleapis.com/css2?family=Darker+Grotesque:wght@500;600;700;800&family=IBM+Plex+Sans:wght@400;500;600&display=swap');

:root{
  --ink:#111111;
  --white:#ffffff;
  --grey:#ededea;
  --grey-2:#dad9d4;
  --oxblood:#6e1f2a;
  --oxblood-d:#581824;
  --soft:#5e5e5a;
  --maxw:1240px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--white);color:var(--ink);font-family:'IBM Plex Sans',sans-serif;font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-family:'Darker Grotesque',sans-serif;font-weight:700;line-height:.98;letter-spacing:-.01em}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 30px}
.lbl{font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600}
.lbl b{color:var(--oxblood)}

/* ---------- Header ---------- */
.head{border-bottom:1px solid var(--ink);position:sticky;top:0;background:var(--white);z-index:50}
.head .wrap{display:flex;align-items:center;justify-content:space-between;min-height:84px}
.logo-img{height:54px;width:auto}
.nav{display:flex;font-size:.82rem;letter-spacing:.04em;text-transform:uppercase;font-weight:500}
.nav a{padding:0 17px;border-left:1px solid var(--grey-2);color:var(--soft);display:flex;align-items:center;min-height:84px;transition:background .15s ease,color .15s ease}
.nav a:hover{color:var(--oxblood);background:rgba(110,31,42,.06)}
.nav a.active{color:var(--ink);font-weight:700;background:#f0ece5}
.nav a.cta,.nav a.cta.active,.nav a.cta:visited{background:var(--oxblood) !important;color:#ffffff !important;padding:0 17px;font-weight:700;letter-spacing:.06em}
.nav a.cta:hover{background:#1a1a1a !important;color:#ffffff !important}
.nav-toggle{display:none;background:none;border:1px solid var(--ink);cursor:pointer;padding:9px 11px}
.nav-toggle span{display:block;width:20px;height:2px;background:var(--ink);margin:4px 0}

/* ---------- Buttons ---------- */
.btn{display:inline-block;font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;font-weight:600;padding:15px 26px;border:1px solid var(--ink);transition:all .18s ease}
.btn-fill{background:var(--ink);color:var(--white)}
.btn-fill:hover{background:var(--oxblood);border-color:var(--oxblood)}
.btn-out:hover{background:var(--grey)}
.btn-light{border-color:var(--white);color:var(--white)}
.btn-light:hover{background:var(--oxblood);border-color:var(--oxblood)}

/* ---------- Hero (Startseite) ---------- */
.hero{border-bottom:1px solid var(--ink)}
.hero .wrap{padding-top:78px}
.hero .lbl{margin-bottom:30px}
.hero h1{font-size:clamp(3.2rem,8vw,6.6rem);max-width:15ch;text-transform:uppercase;font-weight:800}
.hero .row{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:34px;padding-bottom:46px}
.hero p{font-size:1.1rem;color:var(--soft);max-width:42ch}
.hero .actions{display:flex;flex-direction:column;gap:12px;align-items:flex-start;justify-content:flex-end}
.imgblock{height:360px;border-top:1px solid var(--ink);background:repeating-linear-gradient(45deg,var(--grey),var(--grey) 14px,#e6e5e1 14px,#e6e5e1 28px);display:flex;align-items:center;justify-content:center;color:var(--soft);font-size:.76rem;letter-spacing:.16em;text-transform:uppercase}
.imgblock.sm{height:240px}

/* ---------- Page head (Unterseiten) ---------- */
.page-head{border-bottom:1px solid var(--ink)}
.page-head .wrap{padding:66px 30px 54px}
.page-head .lbl{margin-bottom:24px}
.page-head h1{font-size:clamp(2.8rem,6.5vw,5.2rem);text-transform:uppercase;font-weight:800;max-width:17ch}
.page-head p{margin-top:20px;color:var(--soft);max-width:56ch;font-size:1.05rem}

/* ---------- KPI strip ---------- */
.kpis{border-bottom:1px solid var(--ink)}
.kpis .wrap{display:grid;grid-template-columns:repeat(4,1fr);padding:0 30px}
.kpi{padding:36px 24px 36px 0;border-right:1px solid var(--grey-2)}
.kpi:last-child{border-right:none}
.kpi .n{font-size:.74rem;color:var(--oxblood);font-weight:600}
.kpi .v{font-family:'Darker Grotesque',sans-serif;font-size:2.3rem;font-weight:800;margin:6px 0 2px;line-height:1}
.kpi p{font-size:.85rem;color:var(--soft)}

/* ---------- Sections ---------- */
.sec{padding:86px 0;border-bottom:1px solid var(--ink)}
.sec.nb{border-bottom:none}
.sec-head{display:grid;grid-template-columns:auto 1fr;gap:30px;margin-bottom:48px;align-items:start}
.sec-head .idx{font-family:'Darker Grotesque',sans-serif;font-size:2.4rem;font-weight:800;color:var(--oxblood);line-height:1}
.sec-head h2{font-size:clamp(2.4rem,5vw,4rem);text-transform:uppercase;font-weight:800;max-width:20ch}
.sec-head .sub{color:var(--soft);margin-top:12px;max-width:58ch;font-size:.98rem}

/* ---------- Cards ---------- */
.cards{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--ink)}
.cards.trio{grid-template-columns:repeat(3,1fr)}
.card{padding:40px 34px;border-right:1px solid var(--grey-2)}
.card:last-child{border-right:none}
.card .k{font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--oxblood);font-weight:600}
.card h3{font-size:2.2rem;text-transform:uppercase;margin:8px 0 12px;font-weight:800}
.card.trio h3{font-size:1.7rem}
.card p{color:var(--soft);font-size:.96rem}

/* ---------- Steps ---------- */
.steps{border-top:1px solid var(--ink)}
.steps .wrap{display:grid;grid-template-columns:repeat(4,1fr);padding:0 30px}
.step{padding:34px 26px 38px 0;border-right:1px solid var(--grey-2)}
.step:last-child{border-right:none}
.step .n{font-family:'Darker Grotesque',sans-serif;font-size:1.3rem;font-weight:800;color:var(--oxblood);line-height:1}
.step h3{font-size:1.45rem;text-transform:uppercase;margin:8px 0 6px;font-weight:700}
.step p{font-size:.88rem;color:var(--soft)}

/* ---------- Split ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--ink)}
.split > div{padding:42px 36px;border-right:1px solid var(--grey-2)}
.split > div:last-child{border-right:none}
.split h3{font-size:1.9rem;text-transform:uppercase;margin:6px 0 14px;font-weight:800}
.split p{color:var(--soft);font-size:.97rem}

/* ---------- Ticks ---------- */
.ticks{list-style:none;display:grid;gap:0}
.ticks li{padding:14px 0;border-bottom:1px solid var(--grey-2);display:flex;gap:14px;align-items:baseline;font-size:1rem}
.ticks li:last-child{border-bottom:none}
.ticks li::before{content:"\2014";color:var(--oxblood);font-weight:700;flex:none}

/* ---------- Prose ---------- */
.prose{max-width:780px}
.prose .lead-p{font-size:1.15rem;color:var(--ink);margin-bottom:18px}
.prose h2{font-size:1.9rem;text-transform:uppercase;font-weight:800;margin:40px 0 14px;padding-top:30px;border-top:1px solid var(--grey-2)}
.prose h2:first-child{border-top:none;padding-top:0;margin-top:0}
.prose h3{font-size:1.15rem;font-family:'IBM Plex Sans',sans-serif;font-weight:600;margin:22px 0 4px}
.prose p{color:var(--soft);margin-bottom:12px}
.prose a{color:var(--oxblood);font-weight:500}

/* ---------- FAQ ---------- */
.faq{border-top:1px solid var(--ink)}
.faq-item{border-bottom:1px solid var(--grey-2)}
.faq-q{width:100%;text-align:left;background:none;border:none;cursor:pointer;padding:26px 0;display:flex;justify-content:space-between;gap:24px;align-items:center;font-family:'Darker Grotesque',sans-serif;font-size:1.6rem;font-weight:700;text-transform:uppercase;color:var(--ink)}
.faq-q .pm{flex:none;width:24px;height:24px;position:relative}
.faq-q .pm::before,.faq-q .pm::after{content:"";position:absolute;background:var(--oxblood);transition:transform .25s ease}
.faq-q .pm::before{left:0;top:11px;width:24px;height:2px}
.faq-q .pm::after{left:11px;top:0;width:2px;height:24px}
.faq-item.open .pm::after{transform:scaleY(0)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .3s ease}
.faq-a p{padding:0 0 26px;color:var(--soft);max-width:70ch}

/* ---------- Contact ---------- */
.contact{display:grid;grid-template-columns:1.4fr 1fr;border-top:1px solid var(--ink)}
.contact > div{padding:44px 36px;border-right:1px solid var(--grey-2)}
.contact > div:last-child{border-right:none;background:var(--grey)}
.field{margin-bottom:18px}
.field label{display:block;font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;font-weight:600;margin-bottom:6px}
.field input,.field select,.field textarea{width:100%;padding:13px 14px;border:1px solid var(--ink);background:var(--white);font-family:'IBM Plex Sans',sans-serif;font-size:1rem;color:var(--ink);border-radius:0}
.field textarea{min-height:130px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--oxblood);outline-offset:-2px}
.consent{display:flex;gap:11px;align-items:flex-start;font-size:.85rem;color:var(--soft);margin:4px 0 20px}
.consent input{width:17px;height:17px;flex:none;margin-top:2px}
.note{font-size:.8rem;color:var(--soft);margin-top:14px}
.crow{padding:16px 0;border-bottom:1px solid var(--grey-2)}
.crow:last-child{border-bottom:none}
.crow .k{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--oxblood);font-weight:600;display:block;margin-bottom:3px}

/* ---------- CTA ---------- */
.cta{background:var(--ink);color:var(--white);padding:88px 0;border-bottom:1px solid var(--ink)}
.cta .wrap{display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center}
.cta h2{font-size:clamp(2.4rem,5vw,4rem);text-transform:uppercase;font-weight:800;max-width:16ch}
.cta .lbl{color:#bdbdbb;margin-bottom:14px}
.cta .lbl b{color:#c98a96}

/* ---------- Footer ---------- */
.foot{padding:52px 0 30px;font-size:.9rem}
.foot .top{display:flex;justify-content:space-between;flex-wrap:wrap;gap:30px;padding-bottom:28px;border-bottom:1px solid var(--grey-2)}
.foot .logo-img{height:46px}
.foot nav{display:flex;flex-wrap:wrap;gap:18px;font-size:.82rem;letter-spacing:.04em;text-transform:uppercase;font-weight:500}
.foot nav a:hover{color:var(--oxblood)}
.foot .addr{color:var(--soft);font-size:.9rem;line-height:1.7}
.foot .addr a{color:var(--oxblood)}
.foot .bot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding-top:22px;font-size:.78rem;color:var(--soft)}
.foot .bot a:hover{color:var(--oxblood)}

/* ---------- Reveal ---------- */
.reveal{opacity:0;transform:translateY(20px);transition:opacity .6s ease,transform .6s ease}
.reveal.in{opacity:1;transform:none}

/* ---------- Responsive ---------- */
@media(max-width:880px){
  .nav a{min-height:0 !important}
  .nav{position:fixed;top:85px;left:0;right:0;background:var(--white);flex-direction:column;border-bottom:1px solid var(--ink);transform:translateY(-140%);transition:transform .3s ease}
  .nav.open{transform:none}
  .nav a{padding:14px 30px;border-left:none;border-top:1px solid var(--grey-2)}
  .nav-toggle{display:block}
  .hero .row,.cta .wrap{grid-template-columns:1fr}
  .sec-head{grid-template-columns:1fr}
  .cards,.cards.trio,.kpis .wrap,.steps .wrap,.split,.contact{grid-template-columns:1fr}
  .card,.split > div,.contact > div{border-right:none;border-bottom:1px solid var(--grey-2)}
  .card:last-child,.split > div:last-child,.contact > div:last-child{border-bottom:none}
  .kpi{border-right:none;border-bottom:1px solid var(--grey-2);padding-right:0}
  .kpi:last-child{border-bottom:none}
  .step{border-right:none;border-bottom:1px solid var(--grey-2);padding-right:0}
  .step:last-child{border-bottom:none}
  .sec{padding:60px 0}
}


/* ============================================================
   Asset-Einbau 2026-05-26 (Claude Petit)
   ============================================================ */

/* Hero-Video im imgblock */
.imgblock.media{padding:0;background:none;color:transparent;letter-spacing:0;overflow:hidden}
.imgblock.media video,
.imgblock.media img{width:100%;height:100%;object-fit:cover;display:block}

/* 2x2 Bildgalerie auf Leistungen */
.gallery-4{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink)}
.gallery-4 figure{margin:0;border-right:1px solid var(--grey-2);border-bottom:1px solid var(--grey-2);padding:0;background:var(--white)}
.gallery-4 figure:nth-child(2n){border-right:none}
.gallery-4 figure:nth-child(n+3){border-bottom:none}
.gallery-4 img{width:100%;height:340px;object-fit:cover;display:block}
.gallery-4 figcaption{padding:18px 24px;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--soft);font-weight:600}
.gallery-4 figcaption b{color:var(--oxblood);margin-right:8px}
@media (max-width:780px){
  .gallery-4{grid-template-columns:1fr}
  .gallery-4 figure{border-right:none;border-bottom:1px solid var(--grey-2)}
  .gallery-4 figure:last-child{border-bottom:none}
  .gallery-4 img{height:240px}
}

/* Kontakt-Banner: Hintergrundbild + Overlay + weisse Schrift */
.page-head.media{position:relative;background:var(--ink);color:var(--white);overflow:hidden;border-bottom:1px solid var(--ink)}
.page-head.media::before{content:"";position:absolute;inset:0;background-image:url("assets/img/tp_pkf_kontakt_schreibtisch_16x9.webp");background-size:cover;background-position:center;opacity:.55;z-index:0}
.page-head.media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.20) 0%,rgba(0,0,0,.60) 100%);z-index:1}
.page-head.media .wrap{position:relative;z-index:2}
.page-head.media h1{color:var(--white)}
.page-head.media p{color:rgba(255,255,255,.88)}
.page-head.media .lbl{color:rgba(255,255,255,.72)}
.page-head.media .lbl b{color:#e8b6bd}

/* Video-Anker auf so-funktioniert-es-Seite */
.media-anchor{border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);overflow:hidden;background:var(--ink)}
.media-anchor video{width:100%;height:420px;object-fit:cover;display:block;opacity:.94}
@media (max-width:780px){
  .media-anchor video{height:260px}
}


/* ============================================================
   V2 Smart-Form (uebernommen aus preview.css am v2_go_live.py Run)
   ============================================================ */
/* ============================================================
   Smart-Form Layout
   ============================================================ */
.contact-smart{
  display:grid;grid-template-columns:1.55fr 1fr;border-top:1px solid var(--ink);
}
.smart-form-col{padding:44px 36px;border-right:1px solid var(--grey-2)}
.contact-aside{padding:44px 36px;background:var(--grey)}

.contact-aside .crow{
  padding:14px 0;border-bottom:1px solid var(--grey-2);
  display:grid;grid-template-columns:130px 1fr;gap:14px;font-size:.92rem;
}
.contact-aside .crow:last-child{border-bottom:none}
.contact-aside .crow .k{color:var(--soft);font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;font-weight:600}

@media (max-width:840px){
  .contact-smart{grid-template-columns:1fr}
  .smart-form-col{border-right:none;border-bottom:1px solid var(--grey-2)}
}

/* ============================================================
   Step-Indicator (4 Tabs oben am Formular)
   ============================================================ */
.step-indicator{
  display:grid;grid-template-columns:repeat(4,1fr);
  border:1px solid var(--ink);margin-bottom:32px;
}
.step-indicator .step{
  padding:12px 16px;border-right:1px solid var(--grey-2);
  font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;font-weight:600;
  color:var(--soft);background:var(--white);cursor:default;
}
.step-indicator .step:last-child{border-right:none}
.step-indicator .step b{
  display:inline-block;width:22px;height:22px;line-height:22px;text-align:center;
  background:var(--grey);color:var(--soft);border-radius:50%;font-size:.74rem;margin-right:8px;
}
.step-indicator .step.active{color:var(--ink);background:#fff}
.step-indicator .step.active b{background:var(--oxblood);color:#fff}
.step-indicator .step.done{color:var(--ink)}
.step-indicator .step.done b{background:var(--ink);color:#fff}

/* ============================================================
   Smart-Step (fieldset) — default hidden, .active = visible
   ============================================================ */
.smart-step{
  border:none;padding:0;margin:0 0 18px;display:none;
}
.smart-step.active{display:block}
.smart-step legend{
  font-size:1.4rem;font-weight:800;text-transform:uppercase;letter-spacing:.02em;
  margin-bottom:22px;color:var(--ink);
}

/* Radio-Karten (Stufe 1) */
.radio-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:24px}
.radio-card{
  display:block;padding:18px 20px;border:1px solid var(--grey-2);cursor:pointer;
  transition:all .15s ease;background:var(--white);
}
.radio-card:hover{border-color:var(--ink)}
.radio-card input{position:absolute;opacity:0;pointer-events:none}
.radio-card:has(input:checked){border-color:var(--oxblood);background:#fcf5f5}
.radio-card .rc-h{display:block;font-weight:700;font-size:1rem;margin-bottom:6px;color:var(--ink)}
.radio-card .rc-p{display:block;font-size:.84rem;color:var(--soft);line-height:1.4}

@media (max-width:600px){
  .radio-grid{grid-template-columns:1fr}
}

/* Field-Styles */
.smart-step .field{margin-bottom:18px}
.smart-step .field label{
  display:block;font-size:.76rem;letter-spacing:.08em;text-transform:uppercase;
  font-weight:600;color:var(--soft);margin-bottom:6px;
}
.smart-step .field input[type=text],
.smart-step .field input[type=email],
.smart-step .field input[type=tel],
.smart-step .field select,
.smart-step .field textarea{
  width:100%;padding:11px 14px;border:1px solid var(--grey-2);background:var(--white);
  font-size:.96rem;font-family:inherit;
}
.smart-step .field input:focus,
.smart-step .field select:focus,
.smart-step .field textarea:focus{
  outline:none;border-color:var(--oxblood);
}
.smart-step .field textarea{min-height:120px;resize:vertical}

.smart-step .field.two-col{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:600px){
  .smart-step .field.two-col{grid-template-columns:1fr}
}

.smart-step .field label.cb{
  display:flex !important;
  flex-direction:row !important;
  align-items:flex-start !important;
  justify-content:flex-start !important;
  gap:10px !important;
  width:100% !important;
  text-transform:none !important;
  letter-spacing:0 !important;
  font-weight:400 !important;
  color:var(--ink) !important;
  font-size:.95rem !important;
  margin-bottom:10px;
  cursor:pointer;
  line-height:1.4;
}
.smart-step .field label.cb > input[type="radio"],
.smart-step .field label.cb > input[type="checkbox"]{
  width:16px !important;
  height:16px !important;
  flex:0 0 16px !important;
  margin:3px 0 0 0 !important;
  padding:0 !important;
  cursor:pointer;
}
.smart-step .field label.cb > span{
  flex:1 1 auto !important;
  min-width:0 !important;
  display:block !important;
}

.smart-step .consent{
  display:flex !important;
  flex-direction:row !important;
  align-items:flex-start !important;
  justify-content:flex-start !important;
  gap:10px !important;
  width:100% !important;
  margin:24px 0 !important;
  font-size:.95rem !important;
  color:var(--ink) !important;
  cursor:pointer;
  line-height:1.4;
}
.smart-step .consent > input[type="checkbox"]{
  width:16px !important;
  height:16px !important;
  flex:0 0 16px !important;
  margin:3px 0 0 0 !important;
  padding:0 !important;
  cursor:pointer;
}
.smart-step .consent > span{
  flex:1 1 auto !important;
  min-width:0 !important;
  display:block !important;
}

.smart-step .hint{
  font-size:.85rem;color:var(--soft);font-style:italic;margin:16px 0 24px;
}

.smart-step .note{
  font-size:.78rem;color:var(--soft);font-style:italic;margin-top:18px;
}

/* Step-Actions (Navigation-Buttons) */
.step-actions{
  display:flex;gap:12px;justify-content:space-between;margin-top:30px;
  padding-top:24px;border-top:1px solid var(--grey-2);
}
.step-actions .btn-fill{margin-left:auto}

/* ============================================================
   Variantenuebersicht (Vergleichsseite)
   ============================================================ */
.vgrid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:0;
  border-left:1px solid var(--grey-2);border-top:1px solid var(--grey-2);
}
.vcard{
  display:block;padding:32px 28px;border-right:1px solid var(--grey-2);border-bottom:1px solid var(--grey-2);
  background:var(--white);color:var(--ink);transition:background .15s ease;
}
.vcard:hover{background:#fcf5f5}
.vcard-id{
  font-family:'Darker Grotesque',sans-serif;font-size:1.8rem;font-weight:800;
  color:var(--oxblood);line-height:1;margin-bottom:6px;
}
.vcard-mood{
  font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--soft);font-weight:600;margin-bottom:18px;
}
.vcard-h1{
  font-size:1.4rem;font-weight:800;line-height:1.15;text-transform:uppercase;
  margin-bottom:14px;letter-spacing:.005em;
}
.vcard-p{
  font-size:.88rem;color:var(--soft);line-height:1.45;margin-bottom:20px;
}
.vcard-cta{
  font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;font-weight:600;
  color:var(--oxblood);
}

@media (max-width:900px){
  .vgrid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:600px){
  .vgrid{grid-template-columns:1fr}
}


/* ============================================================
   v2-spezifisch: Hintergrund-Bild fuer Insolvenz-Seite (statt Kontakt-Standard)
   ============================================================ */
.page-head.media.bg-gerichtsflur::before {
  background-image: url("/assets/img/tp_pkf_gerichtsflur_16x9.webp") !important;
}


/* ============================================================
   gallery-pair — fuer Galerien mit nur 2 Bildern (1 Reihe)
   ============================================================ */
.gallery-pair figure {
  border-bottom: none !important;
}
.gallery-pair figure:nth-child(2) {
  border-right: none !important;
}


/* ============================================================
   Smart-Form: vereinheitlichte Checkbox/Radio-Optik
   Alle als quadratische 18x18 Boxen mit Haekchen bei :checked
   ============================================================ */
.smart-step .field label.cb > input[type="radio"],
.smart-step .field label.cb > input[type="checkbox"],
.smart-step .consent > input[type="checkbox"]{
  appearance:none !important;
  -webkit-appearance:none !important;
  width:18px !important;
  height:18px !important;
  flex:0 0 18px !important;
  border:1.5px solid #9a9a9a !important;
  border-radius:4px !important;
  background:#fff !important;
  cursor:pointer !important;
  position:relative !important;
  margin:2px 0 0 0 !important;
  padding:0 !important;
  display:inline-block;
}
.smart-step .field label.cb > input[type="radio"]:checked,
.smart-step .field label.cb > input[type="checkbox"]:checked,
.smart-step .consent > input[type="checkbox"]:checked{
  border-color:var(--oxblood) !important;
  background:var(--oxblood) !important;
}
.smart-step .field label.cb > input[type="radio"]:checked::after,
.smart-step .field label.cb > input[type="checkbox"]:checked::after,
.smart-step .consent > input[type="checkbox"]:checked::after{
  content:'';
  position:absolute;
  left:5px;
  top:1px;
  width:5px;
  height:10px;
  border:solid #fff;
  border-width:0 2px 2px 0;
  transform:rotate(45deg);
}
.smart-step .field label.cb > input[type="radio"]:focus-visible,
.smart-step .field label.cb > input[type="checkbox"]:focus-visible,
.smart-step .consent > input[type="checkbox"]:focus-visible{
  outline:2px solid var(--oxblood);
  outline-offset:2px;
}


/* ============================================================
   MOBILE-PATCHES (27.05.2026)
   Audit-Ergebnis: tp-pkf.de/audit/
   ============================================================ */

/* iOS auto text-size verhindern */
body{ -webkit-text-size-adjust:100%; }

/* iPad-Bereich 768 - 1024px: H1 zwischen Desktop und Mobile */
@media (min-width:768px) and (max-width:1024px){
  .hero h1{ font-size:3rem; line-height:1.05; }
  .page-head h1{ font-size:2.4rem; line-height:1.1; }
  .sec{ padding:70px 0; }
}

/* Smartphone-Bereich <= 600px */
@media (max-width:600px){
  /* Padding der Wrapper komprimieren */
  .wrap{ padding-left:20px; padding-right:20px; }
  .smart-form-col{ padding:28px 20px !important; }
  .contact-aside{ padding:28px 20px !important; }
  .sec{ padding:40px 0; }

  /* Hero-Headline kleiner und Buttons stapeln */
  .hero h1{ font-size:2rem; line-height:1.1; }
  .hero .actions{ flex-direction:column; gap:12px; align-items:stretch; }
  .hero .btn{ width:100%; justify-content:center; }

  /* Andere Seiten: Page-Head-H1 anpassen */
  .page-head h1{ font-size:1.8rem; line-height:1.15; }

  /* CTA-Section unten */
  .cta .wrap{ padding:30px 20px; flex-direction:column; gap:18px; align-items:stretch; }
  .cta .btn{ width:100%; justify-content:center; }

  /* Step-Indicator: 2x2 Grid statt 1x4 — verhindert Overflow auf 375px */
  .step-indicator{ grid-template-columns:repeat(2,1fr); }
  .step-indicator .step:nth-child(2){ border-right:none; }
  .step-indicator .step:nth-child(1),
  .step-indicator .step:nth-child(2){ border-bottom:1px solid var(--grey-2); }
  .step-indicator .step{ padding:10px 12px; font-size:.72rem; }

  /* Step-Actions in Smart-Form stapeln auf sehr engen Screens */
  .step-actions{ flex-wrap:wrap; }
  .step-actions .btn{ flex:1 1 auto; }
}

/* iPhone Pro Max und kleiner als 480 — zusaetzliche Reduktionen */
@media (max-width:480px){
  .step-indicator .step{ font-size:.65rem; letter-spacing:.04em; padding:10px 8px; }
  .step-indicator .step b{ width:18px;height:18px;line-height:18px;font-size:.62rem; }
  .hero .lbl, .page-head .lbl{ font-size:.7rem; }
}
