/* ==========================================================
   Schriften – lokal gehostet (DSGVO)
   Bewusst NICHT von Google-Servern geladen: sonst würde bei
   jedem Seitenaufruf die IP-Adresse der Besucher an Google
   übertragen. Lokal eingebunden ist keine Einwilligung nötig.
   Lizenz: SIL Open Font License 1.1 (Poppins, DM Sans)
   ========================================================== */

@font-face{
  font-family:'DM Sans';
  src:url('../fonts/dmsans-var.woff2') format('woff2-variations'),
      url('../fonts/dmsans-var.woff2') format('woff2');
  font-weight:400 700;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:'DM Sans';
  src:url('../fonts/dmsans-italic-var.woff2') format('woff2-variations'),
      url('../fonts/dmsans-italic-var.woff2') format('woff2');
  font-weight:400 500;
  font-style:italic;
  font-display:swap;
}
@font-face{
  font-family:'Poppins';
  src:url('../fonts/poppins-700.woff2') format('woff2');
  font-weight:700;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:'Poppins';
  src:url('../fonts/poppins-800.woff2') format('woff2');
  font-weight:800;
  font-style:normal;
  font-display:swap;
}

/* ==========================================================
   Technikhilfe Viersen – gemeinsames Stylesheet
   Farben aus dem Logo: Navy / Blau / Grün
   ========================================================== */

:root{
  --paper:#F5F8FB;
  --navy:#1E3347;
  --navy-2:#16283A;
  --blue:#1568A5;
  --blue-dark:#0F4E80;
  --green:#6FA23A;
  --green-tint:#EAF3E3;
  --blue-tint:#E8F1F8;
  --line:rgba(30,51,71,0.14);
  --muted:#4A5C6E;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;color-scheme:only light;background:#F5F8FB !important;}
body{
  margin:0;
  background:#F5F8FB !important;
  color:var(--navy);
  font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  line-height:1.6;
  padding-bottom:0;
}
h1,h2,h3{
  font-family:'Poppins',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  font-weight:800;
  letter-spacing:-0.01em;
  line-height:1.12;
  margin:0;
}
a{color:inherit;}
img,svg{display:block;}
.wrap{max-width:1080px;margin:0 auto;padding:0 24px;}
.narrow{max-width:760px;}
.icon{width:26px;height:26px;stroke:var(--blue);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}

/* ---------------------------------------------------- Topbar */
.topbar{position:sticky;top:0;z-index:60;background:var(--paper);border-bottom:1px solid var(--line);}
.topbar-inner{max-width:1080px;margin:0 auto;padding:12px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px;}
.topbar-inner .logo img{height:42px;}
.topbar-actions{display:flex;gap:10px;align-items:center;}

.btn{
  display:inline-flex;align-items:center;gap:8px;
  border-radius:999px;padding:11px 20px;
  font-weight:700;font-size:0.95rem;
  text-decoration:none;border:2px solid transparent;
  cursor:pointer;transition:transform .15s ease, background .15s ease;
  font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
}
.btn:hover{transform:translateY(-1px);}
.btn-primary{background:var(--blue);color:#fff;}
.btn-primary:hover{background:var(--blue-dark);}
.btn-ghost{background:transparent;color:var(--navy);border-color:var(--navy);}
.btn-ghost:hover{background:var(--navy);color:var(--paper);}
@media(max-width:640px){.btn-label-full{display:none;}}

/* ------------------------------------------------ Hauptnavi */
/* Navigation bleibt beim Scrollen direkt unter der Kopfzeile stehen.
   Der Wert 67px entspricht der Höhe der Topbar (42px Logo + 2x12px Innenabstand + Rahmen). */
.mainnav{background:#fff;border-bottom:1px solid var(--line);
         position:sticky;top:67px;z-index:55;
         box-shadow:0 2px 8px rgba(10,20,35,0.05);}
@media(max-width:860px){ .mainnav{top:63px;} }
.mainnav ul{max-width:1080px;margin:0 auto;padding:0 24px;list-style:none;display:flex;gap:26px;overflow-x:auto;}
.mainnav a{
  display:block;padding:13px 0;text-decoration:none;font-size:0.94rem;font-weight:500;
  white-space:nowrap;border-bottom:3px solid transparent;color:var(--muted);
}
.mainnav a:hover{color:var(--blue);}
.mainnav a[aria-current]{color:var(--blue-dark);font-weight:700;border-bottom-color:var(--blue);}

/* ------------------------------------------------ Breadcrumb */
.breadcrumb{padding:16px 0 0;font-size:0.85rem;color:var(--muted);}
.breadcrumb ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:7px;}
.breadcrumb li::after{content:"›";margin-left:7px;opacity:0.5;}
.breadcrumb li:last-child::after{content:"";}
.breadcrumb a{color:var(--blue-dark);}

/* --------------------------------------------------- Seiten-Hero */
.page-hero{padding:26px 0 44px;background:#F5F8FB !important;}
.eyebrow{
  display:inline-block;font-weight:700;font-size:0.82rem;
  letter-spacing:0.06em;text-transform:uppercase;color:var(--blue-dark);margin-bottom:10px;
}
.page-hero h1{font-size:clamp(2rem,4.4vw,3rem);max-width:20ch;}
/* Direktantwort: die ersten Sätze, die Google + KI zitieren */
.lead{font-size:1.15rem;max-width:62ch;margin:18px 0 26px;color:var(--muted);}
.hero-ctas{display:flex;gap:12px;flex-wrap:wrap;}
.trust-row{display:flex;gap:22px;flex-wrap:wrap;margin-top:26px;font-size:0.9rem;color:var(--muted);}
.trust-row span{display:flex;align-items:center;gap:8px;}
.trust-row svg{width:18px;height:18px;stroke:var(--blue);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}

/* ------------------------------------------------ Sektionen */
section{background:#F5F8FB;}
.sec{padding:52px 0;}
.sec-white{background:#fff !important;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.sec-navy{background:var(--navy) !important;color:#fff;}
.sec-navy h2{color:#fff;}
.sec-navy p{color:#C9D8E6;}
.sec h2{font-size:clamp(1.6rem,3.2vw,2.2rem);margin-bottom:8px;}
.sec .sec-sub{color:var(--muted);max-width:60ch;margin:0 0 28px;}
/* Muss NACH .sec .sec-sub stehen, sonst gewinnt bei gleicher Spezifität
   die dunkle Schriftfarbe und der Text wird auf Navy unlesbar. */
.sec-navy .sec-sub,
.sec-navy .price-note,
.sec-navy li,
.sec-navy span{color:#C9D8E6;}
.sec-navy a{color:#fff;}
.sec-navy strong{color:#fff;}

/* ------------------------------------------- Karten / Raster */
.grid{display:grid;gap:20px;}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}
@media(max-width:860px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr;}}

.card{
  background:#fff;border:1px solid var(--line);border-radius:10px;padding:22px 20px;
  text-decoration:none;display:block;transition:transform .16s ease, box-shadow .16s ease;
  border-top:4px solid var(--blue);
}
.card:nth-child(even){border-top-color:var(--green);}
.card:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(10,20,35,0.10);}
.card h3{font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;font-weight:700;font-size:1.02rem;margin:10px 0 6px;}
.card p{font-size:0.9rem;color:var(--muted);margin:0 0 12px;}
.card .more{font-size:0.87rem;font-weight:700;color:var(--blue-dark);}

/* Situations-Karten ("Kennst du das?") */
.case{background:#fff;border-radius:10px;padding:20px 18px;border-top:4px solid var(--blue);box-shadow:0 8px 20px rgba(10,20,35,0.14);}
.case:nth-child(even){border-top-color:var(--green);}
.case h3{font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;font-weight:700;font-size:1rem;margin-bottom:6px;}
.case p{font-size:0.9rem;color:var(--muted);margin:0;}

/* Leistungsliste mit Haken */
.checks{list-style:none;padding:0;margin:0;display:grid;gap:12px;}
.checks li{display:flex;gap:12px;align-items:flex-start;font-size:0.98rem;}
.checks svg{width:21px;height:21px;flex-shrink:0;margin-top:3px;stroke:var(--green);fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;}

/* ---------------------------------------------------- Schritte */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:26px;}
@media(max-width:760px){.steps{grid-template-columns:1fr;}}
.step{position:relative;padding-left:52px;}
.step .num{position:absolute;left:0;top:-6px;font-family:'Poppins',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;font-weight:800;font-size:2.4rem;color:var(--blue);}
.step h3{font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;font-weight:700;font-size:1.05rem;margin-bottom:6px;}
.step p{font-size:0.93rem;color:var(--muted);margin:0;}

/* ----------------------------------------------------- Preise */
.price-table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden;}
.price-table th,.price-table td{text-align:left;padding:14px 18px;border-bottom:1px solid var(--line);font-size:0.95rem;}
.price-table th{background:var(--paper);font-weight:700;}
.price-table td.amount{font-weight:700;color:var(--blue-dark);white-space:nowrap;}
.price-note{font-size:0.86rem;color:var(--muted);margin-top:12px;}
.flag{display:inline-block;margin-top:14px;font-size:0.8rem;background:var(--green-tint);padding:8px 12px;border-radius:5px;color:#3F6B1F;font-weight:700;}

/* -------------------------------------------------------- FAQ */
details{border-bottom:1px solid var(--line);padding:16px 0;}
summary{cursor:pointer;font-weight:700;font-size:1rem;list-style:none;display:flex;justify-content:space-between;gap:16px;align-items:center;}
summary::-webkit-details-marker{display:none;}
summary::after{content:"+";font-size:1.4rem;color:var(--blue);flex-shrink:0;}
details[open] summary::after{content:"–";}
details p{font-size:0.94rem;color:var(--muted);margin:12px 0 0;}
details p:last-child{margin-bottom:0;}

/* --------------------------------------------- Lokaler Anker */
.local-box{background:var(--blue-tint);border-radius:10px;padding:24px;border-left:5px solid var(--blue);}
.local-box p{margin:0 0 12px;}
.local-box p:last-child{margin-bottom:0;}
.place-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;}
.place-links a{
  background:#fff;border:1px solid var(--line);border-radius:999px;
  padding:7px 14px;font-size:0.85rem;text-decoration:none;color:var(--blue-dark);font-weight:500;
}
.place-links a:hover{border-color:var(--blue);}

/* ------------------------------------------------ Verwandtes */
.related{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:8px;}
@media(max-width:760px){.related{grid-template-columns:1fr;}}
.related a{
  background:#fff;border:1px solid var(--line);border-left:4px solid var(--green);
  border-radius:8px;padding:16px;text-decoration:none;font-weight:700;font-size:0.95rem;
}
.related a:hover{border-left-color:var(--blue);color:var(--blue-dark);}
.related span{display:block;font-weight:400;font-size:0.85rem;color:var(--muted);margin-top:4px;}

/* -------------------------------------------------- CTA-Block */
.cta-box{background:var(--navy);color:#fff;border-radius:12px;padding:34px 30px;text-align:center;}
.cta-box h2{color:#fff;margin-bottom:10px;}
.cta-box p{color:#C9D8E6;max-width:52ch;margin:0 auto 22px;}
.cta-box .hero-ctas{justify-content:center;}
.cta-box .btn-ghost{color:#fff;border-color:#fff;}
.cta-box .btn-ghost:hover{background:#fff;color:var(--navy);}

/* ----------------------------------------------------- Footer */
footer{background:var(--navy);color:#C9D8E6;padding:44px 0 100px;font-size:0.87rem;}
footer a{color:#DCE6EB;}
.foot-grid{display:flex;justify-content:space-between;flex-wrap:wrap;gap:26px;}
.foot-grid > div{max-width:300px;}
footer h4{color:#fff;font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;font-size:0.9rem;margin:0 0 10px;}
footer ul{list-style:none;padding:0;margin:0;}
footer li{margin-bottom:7px;}
.foot-logo{background:#fff;border-radius:8px;padding:10px 14px;display:inline-block;margin-bottom:14px;}
.foot-logo img{height:70px;}

/* ------------------------------------------ Mobile Sticky-Bar */
.mobile-bar{position:fixed;bottom:0;left:0;right:0;z-index:60;display:flex;background:#fff;border-top:1px solid var(--line);box-shadow:0 -6px 16px rgba(0,0,0,0.10);}
.mobile-bar a{
  flex:1;padding:12px 6px;text-align:center;font-size:0.78rem;font-weight:700;
  text-decoration:none;display:flex;flex-direction:column;align-items:center;gap:4px;color:var(--navy);
}
.mobile-bar .icon{width:20px;height:20px;}
.mobile-bar .cta{background:var(--blue);color:#fff;}
.mobile-bar .cta .icon{stroke:#fff;}
@media(min-width:761px){.mobile-bar{display:none;}}
@media(max-width:760px){body{padding-bottom:64px;} .topbar-actions .btn-primary{display:none;}}

/* -------------------------------------------------- Sonstiges */
input:focus,button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--blue);outline-offset:2px;}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .card,.card:hover,.btn,.btn:hover{transition:none;transform:none;}
}

/* ==========================================================
   Startseite: Anfrage-Funnel
   ========================================================== */
.funnel-card{background:#fff;color:var(--navy);border-radius:12px;padding:30px;max-width:640px;margin:0 auto;box-shadow:0 20px 50px rgba(0,0,0,0.28);}
.f-progress{display:flex;gap:6px;margin-bottom:22px;}
.f-progress div{height:5px;flex:1;background:var(--line);border-radius:3px;}
.f-progress div.on{background:var(--blue);}
.f-step{display:none;}
.f-step.active{display:block;}
.f-step h3{font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;font-weight:700;font-size:1.12rem;margin-bottom:14px;}
.chip-grid{display:flex;flex-wrap:wrap;gap:10px;}
.chip{border:2px solid var(--line);background:#fff;border-radius:999px;padding:9px 16px;font-size:0.88rem;
      cursor:pointer;font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;font-weight:500;color:var(--navy);}
.chip:hover{border-color:var(--blue);}
.chip.selected{border-color:var(--blue);background:var(--blue-tint);color:var(--blue-dark);font-weight:700;}
.f-actions{display:flex;justify-content:space-between;gap:12px;margin-top:24px;}
.funnel-card input[type="text"],.funnel-card input[type="tel"]{
  width:100%;padding:12px 14px;border:2px solid var(--line);border-radius:6px;
  font-size:0.95rem;font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;margin-bottom:14px;color:var(--navy);}
.funnel-card input:focus{border-color:var(--blue);}
label.small{font-size:0.82rem;color:var(--muted);display:block;margin-bottom:6px;font-weight:700;}
.confirm{display:none;text-align:center;padding:14px 0;}
.confirm.active{display:block;}
.confirm .big-check{width:46px;height:46px;margin:0 auto 14px;stroke:var(--green);fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;}

/* Fallkarten der Startseite, klickbar */
a.case{text-decoration:none;color:inherit;display:block;transition:transform .16s ease;}
a.case:hover{transform:translateY(-3px);}
a.case .more{display:inline-block;margin-top:12px;font-size:0.86rem;font-weight:700;color:var(--blue-dark);}

/* Über-mich-Block */
.about{display:grid;grid-template-columns:auto 1fr;gap:26px;align-items:center;
       background:#fff;border:1px solid var(--line);border-radius:12px;padding:26px;}
@media(max-width:640px){.about{grid-template-columns:1fr;}}
.about .photo{width:156px;height:156px;border-radius:50%;
              object-fit:cover;flex-shrink:0;
              box-shadow:0 4px 14px rgba(30,51,71,0.18);}

/* ==========================================================
   Rechtsseiten: Prüfhinweis-Banner (vor Livegang entfernen)
   ========================================================== */
.review-banner{
  background:#FFF4E5;border:2px dashed #C77700;border-radius:10px;
  padding:18px 20px;margin:20px 0 34px;color:#6B4200;
}
.review-banner strong{color:#8A5400;}
.review-banner ul{margin:10px 0 0;padding-left:20px;font-size:0.92rem;}
.review-banner li{margin-bottom:6px;}

/* Rechtstext-Layout */
.legal h2{font-size:1.3rem;margin:34px 0 10px;}
.legal h3{font-size:1.05rem;font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;font-weight:700;margin:22px 0 8px;}
.legal p, .legal li{font-size:0.96rem;color:var(--muted);}
.legal p{margin:0 0 12px;}
.legal ul{margin:0 0 14px;padding-left:20px;}
.legal .todo{background:var(--blue-tint);padding:2px 7px;border-radius:4px;
             font-weight:700;color:var(--blue-dark);font-size:0.9em;}

/* ==========================================================
   Sprungmarken – damit der feste Kopf keine Überschrift verdeckt
   ========================================================== */
section[id], div[id]{ scroll-margin-top:130px; }

/* ==========================================================
   Preise deutlicher hervorheben
   ========================================================== */
.preis-hero{
  display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:0 0 26px;
}
@media(max-width:860px){ .preis-hero{grid-template-columns:repeat(2,1fr);} }
@media(max-width:480px){ .preis-hero{grid-template-columns:1fr;} }

.preis-karte{
  background:#fff;border:2px solid var(--line);border-radius:12px;
  padding:22px 18px;text-align:center;position:relative;
  transition:border-color .16s ease, transform .16s ease;
}
.preis-karte:hover{border-color:var(--blue);transform:translateY(-3px);}
.preis-karte.hervor{border-color:var(--blue);box-shadow:0 8px 22px rgba(21,104,165,0.14);}
.preis-karte .betrag{
  font-family:'Poppins',sans-serif;font-weight:800;
  font-size:2.4rem;line-height:1;color:var(--blue-dark);display:block;margin-bottom:6px;
}
.preis-karte .was{font-weight:700;font-size:0.98rem;display:block;margin-bottom:4px;}
.preis-karte .dazu{font-size:0.85rem;color:var(--muted);display:block;}
.preis-karte .marke{
  position:absolute;top:-11px;left:50%;transform:translateX(-50%);
  background:var(--green);color:#fff;font-size:0.72rem;font-weight:700;
  letter-spacing:0.04em;text-transform:uppercase;padding:4px 12px;border-radius:999px;
  white-space:nowrap;
}
.preis-fuss{
  background:var(--blue-tint);border-radius:10px;padding:18px 20px;
  font-size:0.94rem;color:var(--navy);
}
.preis-fuss strong{color:var(--blue-dark);}

/* ==========================================================
   Inhaltsblöcke mit Rahmen (wie die Karten auf der Startseite)
   ========================================================== */
.block{
  background:#fff;border:1px solid var(--line);border-radius:12px;
  padding:26px 24px;border-top:4px solid var(--blue);margin-bottom:20px;
}
.block.gruen{border-top-color:var(--green);}
.block > h3{font-family:'DM Sans',sans-serif;font-weight:700;font-size:1.1rem;margin:0 0 12px;}
.block > p:last-child{margin-bottom:0;}

.block-raster{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;}
@media(max-width:760px){ .block-raster{grid-template-columns:1fr;} }

/* Zitat-Karten, z. B. auf der Seniorenseite */
.stimme{
  background:#fff;border-radius:12px;padding:22px 20px;
  border-left:4px solid var(--green);box-shadow:0 8px 20px rgba(10,20,35,0.10);
}
.stimme h3{font-family:'DM Sans',sans-serif;font-weight:700;font-size:1rem;margin:0 0 8px;}
.stimme p{font-size:0.92rem;color:var(--muted);margin:0;}

/* Bild im Inhaltsblock */
.bild-block{
  border-radius:12px;overflow:hidden;border:1px solid var(--line);
  box-shadow:0 10px 26px rgba(10,20,35,0.12);
}
.bild-block img{width:100%;height:auto;display:block;}

/* ==========================================================
   Team-Seite
   ========================================================== */
.team-hero{
  display:grid;grid-template-columns:1.05fr 0.95fr;gap:40px;align-items:center;
}
@media(max-width:860px){ .team-hero{grid-template-columns:1fr;} }

.vorteil{
  display:flex;gap:14px;align-items:flex-start;
  background:#fff;border:1px solid var(--line);border-radius:10px;padding:18px;
}
.vorteil svg{width:24px;height:24px;flex-shrink:0;margin-top:2px;
             stroke:var(--green);fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;}
.vorteil strong{display:block;margin-bottom:3px;font-size:0.98rem;}
.vorteil span{font-size:0.9rem;color:var(--muted);}


/* ==========================================================
   Startseiten-Hero: zweispaltig
   ========================================================== */

.hero-inner{
  display:grid;
  grid-template-columns:1.15fr 0.85fr;
  gap:48px;
  align-items:center;
}
@media(max-width:860px){
  .hero-inner{ grid-template-columns:1fr; }
}

/* ==========================================================
   Grav-Formular im Anfrage-Kasten
   Greift auf Elementtypen statt auf Grav-Klassen, damit es
   unabhängig vom Markup des Form-Plugins funktioniert.
   ========================================================== */

.funnel-card form { margin:0; }

.funnel-card .form-field,
.funnel-card .form-group { margin-bottom:20px; }

.funnel-card label{
  display:block; font-family:'DM Sans',sans-serif; font-weight:700;
  font-size:0.92rem; color:var(--navy); margin:0 0 7px;
}
.funnel-card label .required,
.funnel-card .form-label-required{ color:var(--blue); }

.funnel-card input[type="text"],
.funnel-card input[type="tel"],
.funnel-card input[type="email"],
.funnel-card textarea,
.funnel-card select{
  width:100%;
  box-sizing:border-box;
  padding:13px 15px;
  border:2px solid var(--line);
  border-radius:10px;
  background:#fff;
  font-family:'DM Sans',sans-serif;
  font-size:1rem;
  line-height:1.4;
  color:var(--navy);
  transition:border-color .15s ease, box-shadow .15s ease;
  -webkit-appearance:none;
  appearance:none;
}
.funnel-card textarea{ min-height:110px; resize:vertical; }

/* Auswahlfelder: eigener Pfeil statt Systemdarstellung */
.funnel-card select{
  padding-right:44px;
  background-image:url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231E3347' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 15px center;
  background-size:18px 18px;
  cursor:pointer;
}

.funnel-card input:focus,
.funnel-card textarea:focus,
.funnel-card select:focus{
  outline:none;
  border-color:var(--blue);
  box-shadow:0 0 0 4px rgba(21,104,165,0.14);
}
.funnel-card input::placeholder,
.funnel-card textarea::placeholder{ color:#93A5B5; }

/* Absenden */
.funnel-card button[type="submit"],
.funnel-card input[type="submit"],
.funnel-card .button{
  display:inline-flex; align-items:center; justify-content:center;
  width:100%;
  margin-top:6px;
  padding:15px 24px;
  border:none; border-radius:999px;
  background:var(--blue); color:#fff;
  font-family:'DM Sans',sans-serif; font-weight:700; font-size:1.02rem;
  cursor:pointer;
  transition:background .15s ease, transform .15s ease;
}
.funnel-card button[type="submit"]:hover,
.funnel-card input[type="submit"]:hover{ background:var(--blue-dark); transform:translateY(-1px); }

/* Datei-Upload */
.funnel-card input[type="file"]{
  width:100%;
  box-sizing:border-box;
  padding:14px 15px;
  border:2px dashed var(--line);
  border-radius:10px;
  background:var(--blue-tint);
  font-family:'DM Sans',sans-serif;
  font-size:0.95rem;
  color:var(--navy);
  cursor:pointer;
}
.funnel-card input[type="file"]:hover{ border-color:var(--blue); }
.funnel-card input[type="file"]::file-selector-button{
  margin-right:14px;
  padding:9px 16px;
  border:none; border-radius:999px;
  background:var(--blue); color:#fff;
  font-family:'DM Sans',sans-serif; font-weight:700; font-size:0.9rem;
  cursor:pointer;
}
/* Grav-Dropzone, falls das Plugin sie einsetzt */
.funnel-card .dropzone{
  border:2px dashed var(--line);
  border-radius:10px;
  background:var(--blue-tint);
  min-height:120px;
  padding:18px;
}
.funnel-card .dropzone .dz-message{ color:var(--muted); font-size:0.95rem; margin:1em 0; }
.funnel-card .form-field-file .form-data{ margin-top:8px; }

/* Feldbeschreibung unter dem Eingabefeld */
.funnel-card .form-field .form-description,
.funnel-card small{
  display:block; margin-top:7px;
  font-size:0.86rem; color:var(--muted); line-height:1.45;
}

/* Honigtopf und Systemfelder ausblenden */
.funnel-card input[name*="honeypot"],
.funnel-card .form-field-honeypot,
.funnel-card [data-grav-field="honeypot"]{
  position:absolute !important; left:-9999px !important;
}

/* Rückmeldungen des Formulars */
.funnel-card .form-messages,
.funnel-card .alert{
  border-radius:10px; padding:14px 16px; margin-bottom:16px; font-size:0.95rem;
}
.funnel-card .form-messages{ background:var(--green-tint); color:#3F6B1F; }
.funnel-card .form-errors,
.funnel-card .alert.error{ background:#FDECEA; color:#8A1B12; }

/* Zwei Felder nebeneinander ab Tablet */
@media(min-width:620px){
  .funnel-card .feld-paar{ display:grid; grid-template-columns:1fr 1fr; gap:0 18px; }
}

/* ==========================================================
   Mobile Navigation mit Menüschalter
   ========================================================== */

.nav-toggle{
  display:none;
  align-items:center; gap:9px;
  width:100%;
  padding:13px 24px;
  background:#fff; border:none; border-bottom:1px solid var(--line);
  font-family:'DM Sans',sans-serif; font-weight:700; font-size:0.95rem;
  color:var(--navy); cursor:pointer;
}
.nav-toggle svg{ width:22px; height:22px; stroke:var(--blue); fill:none; stroke-width:2.2; stroke-linecap:round; }
.nav-toggle .schliessen{ display:none; }
.mainnav.offen .nav-toggle .oeffnen{ display:none; }
.mainnav.offen .nav-toggle .schliessen{ display:inline; }

@media(max-width:860px){
  .nav-toggle{ display:flex; }
  .mainnav ul{
    display:none;
    flex-direction:column;
    gap:0;
    overflow:visible;
    padding:6px 24px 14px;
  }
  .mainnav.offen ul{ display:flex; }
  .mainnav ul li{ border-bottom:1px solid var(--line); }
  .mainnav ul li:last-child{ border-bottom:none; }
  .mainnav a{
    padding:14px 0;
    border-bottom:none;
    font-size:1rem;
  }
  .mainnav a[aria-current]{ border-bottom:none; }
}