@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&display=swap');

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Inter',sans-serif;background:#fff;color:#1d1d1f;font-size:15px;line-height:1.6;overflow-x:hidden;cursor:auto}

/* CURSOR */
@media (hover:hover) and (pointer:fine){
  body{cursor:none}
  a,button,.nav-link,.nav-dropdown-toggle,.dropdown-item,.nav-cta,.btn-primary,.btn-outline,.btn-ghost,.btn-white,.card-link{cursor:none!important}
}
.cursor{width:9px;height:9px;background:#14a0dc;border-radius:50%;position:fixed;pointer-events:none;z-index:9999;transform:translate(-50%,-50%);box-shadow:0 0 0 6px rgba(20,160,220,.10),0 0 22px rgba(20,160,220,.55);transition:width .18s ease,height .18s ease,background .18s ease,opacity .18s ease,box-shadow .18s ease}
.cursor-ring{width:38px;height:38px;border:1.5px solid rgba(60,60,60,.34);border-radius:50%;position:fixed;pointer-events:none;z-index:9998;transform:translate(-50%,-50%);background:rgba(20,160,220,.035);box-shadow:0 0 0 1px rgba(20,160,220,.10) inset;transition:width .22s ease,height .22s ease,border-color .22s ease,background .22s ease,opacity .18s ease}
.cursor.big{width:15px;height:15px;background:#3c3c3c;box-shadow:0 0 0 7px rgba(60,60,60,.08),0 0 24px rgba(20,160,220,.45)}
.cursor-ring.big{width:58px;height:58px;border-color:rgba(20,160,220,.72);background:rgba(20,160,220,.08)}
.cursor.down{width:7px;height:7px;background:#14a0dc}
.cursor-ring.down{width:30px;height:30px;border-color:#3c3c3c;background:rgba(60,60,60,.08)}
.cursor.hide,.cursor-ring.hide{opacity:0}
@media(hover:none),(pointer:coarse){.cursor,.cursor-ring{display:none}body{cursor:auto}}

/* NAV */
nav.st-nav{background:rgba(255,255,255,.93);backdrop-filter:blur(24px);height:58px;padding:0 48px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:200;border-bottom:.5px solid rgba(0,0,0,.07);transition:box-shadow .3s}
nav.st-nav.scrolled{box-shadow:0 4px 24px rgba(0,0,0,.06)}
.nav-logo{display:flex;align-items:center;gap:10px;text-decoration:none}
.nav-logo-mark{width:32px;height:32px;background:#14a0dc;border-radius:8px;display:flex;align-items:center;justify-content:center}
.nav-logo-mark svg{width:18px;height:18px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round}
.nav-logo-text{font-size:16px;font-weight:600;color:#1d1d1f;letter-spacing:-.4px}
.nav-logo-text span{color:#14a0dc}
.nav-center{display:flex;align-items:center;gap:4px}
.nav-link{font-size:13px;color:#6e6e73;text-decoration:none;padding:6px 14px;border-radius:8px;transition:color .2s,background .2s;cursor:pointer}
.nav-link:hover,.nav-link.active{color:#1d1d1f;background:rgba(0,0,0,.04)}
.nav-link.active{color:#14a0dc;background:rgba(20,160,220,.07)}
.nav-dropdown{position:relative}
.nav-dropdown::after{content:'';position:absolute;left:0;right:0;top:100%;height:12px}
.nav-dropdown-toggle{display:flex;align-items:center;gap:4px;font-size:13px;color:#6e6e73;padding:6px 14px;border-radius:8px;cursor:pointer;border:none;font-family:inherit;background:none;transition:color .2s,background .2s}
.nav-dropdown-toggle:hover{color:#1d1d1f;background:rgba(0,0,0,.04)}
.nav-dropdown-toggle svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;transition:transform .2s}
.nav-dropdown:hover .nav-dropdown-toggle svg{transform:rotate(180deg)}
.dropdown-menu{position:absolute;top:calc(100% + 8px);left:0;background:#fff;border:.5px solid rgba(0,0,0,.1);border-radius:14px;padding:8px;min-width:200px;opacity:0;pointer-events:none;transform:translateY(-6px);transition:opacity .2s,transform .2s;box-shadow:0 8px 32px rgba(0,0,0,.1)}
.nav-dropdown:hover .dropdown-menu{opacity:1;pointer-events:all;transform:translateY(0)}
.dropdown-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;text-decoration:none;color:#1d1d1f;font-size:13px;transition:background .15s;cursor:pointer}
.dropdown-item:hover,.dropdown-item.active{background:#f5f5f7}
.dropdown-item.active .dropdown-item-label{color:#14a0dc}
.dropdown-item-icon{width:28px;height:28px;border-radius:7px;background:rgba(20,160,220,.1);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.dropdown-item-icon svg{width:14px;height:14px;stroke:#14a0dc;fill:none;stroke-width:1.5;stroke-linecap:round}
.dropdown-item-label{font-weight:500;font-size:13px}
.dropdown-item-sub{font-size:11px;color:#6e6e73;margin-top:1px}
.nav-right{display:flex;align-items:center;gap:10px}
.lang-toggle{font-size:12px;color:#6e6e73;border:none;background:none;cursor:pointer;font-family:inherit;padding:6px 10px;border-radius:8px;transition:background .2s}
.lang-toggle:hover{background:rgba(0,0,0,.04)}
.nav-cta{background:#14a0dc;color:#fff;border:none;padding:8px 20px;border-radius:20px;font-size:13px;font-weight:500;cursor:pointer;font-family:inherit;transition:opacity .2s,transform .2s}
.nav-cta:hover{opacity:.85;transform:translateY(-1px)}
.nav-hamburger{display:none;flex-direction:column;gap:5px;padding:8px;border:none;background:none;cursor:pointer}
.nav-hamburger span{display:block;width:22px;height:2px;background:#1d1d1f;border-radius:2px}
.mobile-menu{display:none;position:fixed;inset:58px 0 0 0;background:rgba(255,255,255,.97);backdrop-filter:blur(20px);z-index:190;padding:24px;flex-direction:column;gap:8px;overflow-y:auto}
.mobile-menu.open{display:flex}
.mobile-link{font-size:16px;font-weight:500;color:#1d1d1f;text-decoration:none;padding:14px 16px;border-radius:12px;transition:background .2s}
.mobile-link:hover{background:#f5f5f7}
.mobile-link.sub{font-size:14px;font-weight:400;color:#6e6e73;padding-left:32px}
.mobile-divider{height:.5px;background:rgba(0,0,0,.07);margin:8px 0}
.mobile-cta{background:#14a0dc;color:#fff;text-align:center;padding:16px;border-radius:14px;font-size:15px;font-weight:500;text-decoration:none;margin-top:8px}

/* FOOTER */
.st-footer{background:#2a2a2a;padding:64px 48px 36px}
.st-footer .footer-top{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;margin-bottom:48px}
.st-footer .footer-brand-name{font-size:16px;font-weight:600;color:#fff}
.st-footer .footer-brand-name span{color:#14a0dc}
.st-footer .footer-brand p{font-size:13px;color:rgba(255,255,255,.35);font-weight:300;line-height:1.7;margin-top:12px;max-width:220px}
.st-footer .footer-social{display:flex;align-items:center;gap:10px;margin-top:20px;flex-wrap:wrap}
.st-footer .footer-social-link{width:40px;height:40px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);text-decoration:none;transition:transform .2s,background .2s,border-color .2s,box-shadow .2s}
.st-footer .footer-social-link:hover{transform:translateY(-2px);background:rgba(20,160,220,.12);border-color:rgba(20,160,220,.35);box-shadow:0 10px 24px rgba(0,0,0,.16)}
.st-footer .footer-social-link svg{width:18px;height:18px;stroke:#14a0dc;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.st-footer .footer-social-link.is-fill svg{fill:#14a0dc;stroke:none}
.st-footer .footer-contact-line{display:block;font-size:13px;color:rgba(255,255,255,.4);text-decoration:none;margin-bottom:10px}
.st-footer .footer-contact-line:hover{color:#fff}
.st-footer .footer-col h5{font-size:11px;font-weight:600;color:rgba(255,255,255,.4);letter-spacing:1.5px;text-transform:uppercase;margin-bottom:16px}
.st-footer .footer-col a{display:block;font-size:13px;color:rgba(255,255,255,.4);text-decoration:none;margin-bottom:10px;transition:color .2s;cursor:pointer}
.st-footer .footer-col a:hover{color:#fff}
.st-footer .footer-bottom{border-top:.5px solid rgba(255,255,255,.07);padding-top:24px;display:flex;align-items:center;justify-content:space-between}
.st-footer .footer-copy{font-size:12px;color:rgba(255,255,255,.22)}
.st-footer .footer-legal{display:flex;gap:24px}
.st-footer .footer-legal a{font-size:12px;color:rgba(255,255,255,.22);text-decoration:none;cursor:pointer;transition:color .2s}
.st-footer .footer-legal a:hover{color:rgba(255,255,255,.6)}

/* SHARED */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .65s ease,transform .65s ease}
.reveal.on{opacity:1;transform:translateY(0)}
.d1{transition-delay:.1s}.d2{transition-delay:.2s}.d3{transition-delay:.3s}.d4{transition-delay:.4s}.d5{transition-delay:.5s}
.breadcrumb{display:flex;align-items:center;gap:8px;font-size:12px;color:#b0b0b8;margin-bottom:20px}
.breadcrumb a{color:#b0b0b8;text-decoration:none;cursor:pointer;transition:color .2s}
.breadcrumb a:hover{color:#14a0dc}

/* BLOG POSTS (WordPress) */
.st-blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;max-width:1000px;margin:0 auto}
.st-post-card{border-radius:18px;overflow:hidden;background:#f5f5f7;cursor:pointer;transition:transform .25s,box-shadow .25s;text-decoration:none;display:block;color:inherit}
.st-post-card:hover{transform:translateY(-4px);box-shadow:0 16px 48px rgba(0,0,0,.08)}
.st-post-thumb{height:160px;background:linear-gradient(135deg,#0d7aad,#14a0dc);display:flex;align-items:center;justify-content:center;overflow:hidden}
.st-post-thumb img{width:100%;height:100%;object-fit:cover}
.st-post-body{padding:20px 22px 22px}
.st-post-cat{font-size:11px;font-weight:600;color:#14a0dc;letter-spacing:1px;text-transform:uppercase;margin-bottom:8px}
.st-post-body h3{font-size:16px;font-weight:500;color:#1d1d1f;line-height:1.35;margin-bottom:8px}
.st-post-body p{font-size:13px;color:#6e6e73;font-weight:300;line-height:1.55;margin-bottom:14px}
.st-post-footer{display:flex;align-items:center;justify-content:space-between;padding-top:12px;border-top:.5px solid rgba(0,0,0,.07)}
.st-post-date{font-size:11px;color:#b0b0b8}
.st-post-read{font-size:11px;color:#14a0dc;font-weight:500}

/* SINGLE POST */
.st-single-hero{background:#f5f5f7;padding:64px 48px 48px}
.st-single-layout{display:grid;grid-template-columns:1fr 280px;gap:60px;max-width:1000px;margin:0 auto;padding:60px 48px 100px}
.st-post-content{font-size:16px;color:#3c3c3c;font-weight:300;line-height:1.75}
.st-post-content h2{font-size:clamp(22px,3vw,30px);font-weight:300;letter-spacing:-1px;color:#1d1d1f;margin:48px 0 16px}
.st-post-content h2 strong{font-weight:600;color:#14a0dc}
.st-post-content h3{font-size:18px;font-weight:500;color:#1d1d1f;margin:32px 0 12px}
.st-post-content p{margin-bottom:20px}
.st-post-content ul{margin:16px 0 20px;display:flex;flex-direction:column;gap:8px;list-style:none;padding:0}
.st-post-content ul li{padding-left:20px;position:relative}
.st-post-content ul li::before{content:'';position:absolute;left:0;top:10px;width:6px;height:6px;background:#14a0dc;border-radius:50%}
.st-callout{background:#f5f5f7;border-left:3px solid #14a0dc;border-radius:0 12px 12px 0;padding:20px 24px;margin:28px 0}
.st-callout p{margin:0;font-size:15px;color:#1d1d1f;font-weight:400}
.st-toc{position:sticky;top:80px;align-self:start}
.st-toc h4{font-size:12px;font-weight:600;color:#1d1d1f;letter-spacing:.5px;text-transform:uppercase;margin-bottom:16px;padding-bottom:12px;border-bottom:.5px solid rgba(0,0,0,.08)}
.st-toc-list{display:flex;flex-direction:column;gap:2px}
.st-toc-item{font-size:13px;color:#6e6e73;text-decoration:none;padding:7px 12px;border-left:2px solid transparent;transition:color .2s,border-color .2s,background .2s;cursor:pointer}
.st-toc-item:hover,.st-toc-item.active{color:#14a0dc;border-left-color:#14a0dc;background:rgba(20,160,220,.05)}

/* RESPONSIVE */
@media(max-width:900px){
  nav.st-nav{padding:0 24px}
  .nav-center,.nav-right .lang-toggle,.nav-right .nav-cta{display:none}
  .nav-hamburger{display:flex}
  .st-blog-grid{grid-template-columns:repeat(2,1fr)}
  .st-single-layout{grid-template-columns:1fr;padding:48px 24px 60px}
  .st-toc{display:none}
  .st-footer{padding:48px 24px 28px}
  .st-footer .footer-top{grid-template-columns:1fr 1fr;gap:32px}
}
@media(max-width:600px){
  .st-blog-grid{grid-template-columns:1fr}
  .st-footer .footer-top{grid-template-columns:1fr}
  .st-footer .footer-bottom{flex-direction:column;gap:12px;text-align:center}
  .st-footer .footer-legal{justify-content:center}
}
/* STARTSEITE */

.hero{position:relative;min-height:calc(100vh - 58px);padding:110px 48px 80px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;overflow:hidden;background:radial-gradient(circle at 50% 0%,rgba(20,160,220,.18),transparent 38%),linear-gradient(180deg,#fff 0%,#f5f7fa 100%)}
.hero-glow{position:absolute;width:540px;height:540px;border-radius:50%;background:rgba(20,160,220,.12);filter:blur(80px);top:80px;left:50%;transform:translateX(-50%);pointer-events:none}
.hero-badge{position:relative;display:inline-flex;align-items:center;gap:9px;padding:8px 14px;border:1px solid rgba(20,160,220,.18);border-radius:999px;background:rgba(255,255,255,.72);color:#14a0dc;font-size:12px;font-weight:600;letter-spacing:.6px;margin-bottom:24px;box-shadow:0 10px 40px rgba(0,0,0,.04)}
.hero-badge-dot{width:7px;height:7px;border-radius:50%;background:#14a0dc;box-shadow:0 0 0 5px rgba(20,160,220,.12)}
.hero h1{position:relative;font-size:clamp(48px,8vw,108px);font-weight:300;line-height:.98;letter-spacing:-5px;color:#1d1d1f;margin-bottom:26px}
.hero h1 strong{font-weight:600;color:#14a0dc}
.hero-sub{position:relative;font-size:clamp(17px,2vw,22px);font-weight:300;color:#6e6e73;max-width:720px;margin:0 auto 34px;line-height:1.55}
.hero-btns{position:relative;display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;margin-bottom:58px}
.btn-primary,.btn-ghost,.btn-white{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:12px 24px;border-radius:999px;font-size:14px;font-weight:500;text-decoration:none;transition:transform .2s,box-shadow .2s,background .2s,color .2s;cursor:pointer}
.btn-primary{background:#14a0dc;color:#fff;box-shadow:0 12px 30px rgba(20,160,220,.26)}
.btn-primary:hover,.btn-white:hover,.btn-ghost:hover{transform:translateY(-2px)}
.btn-ghost{background:rgba(255,255,255,.72);color:#1d1d1f;border:1px solid rgba(0,0,0,.08)}
.btn-white{background:#fff;color:#14a0dc;box-shadow:0 14px 36px rgba(0,0,0,.12)}
.hero-cards{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;width:min(920px,100%)}
.hcard{background:rgba(255,255,255,.84);border:1px solid rgba(0,0,0,.07);border-radius:22px;padding:22px;text-align:left;box-shadow:0 18px 54px rgba(0,0,0,.06);backdrop-filter:blur(18px)}
.hcard-icon,.leis-icon{width:42px;height:42px;border-radius:13px;background:rgba(20,160,220,.1);display:flex;align-items:center;justify-content:center;margin-bottom:14px}
.hcard-icon svg,.leis-icon svg{width:22px;height:22px;stroke:#14a0dc;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.hcard h4{font-size:16px;font-weight:600;margin-bottom:4px;color:#1d1d1f}.hcard p{font-size:13px;color:#6e6e73;font-weight:300}
.scroll-hint{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:7px;color:#b0b0b8;font-size:11px;transition:opacity .25s,transform .25s;animation:scrollHintFloat 2.4s ease-in-out infinite;pointer-events:none}.scroll-hint.gone{opacity:0;transform:translate(-50%,12px)}.scroll-mouse{width:22px;height:34px;border:1px solid #c7c7cc;border-radius:20px;display:flex;justify-content:center;padding-top:7px;background:rgba(255,255,255,.55);box-shadow:0 6px 18px rgba(0,0,0,.04)}.scroll-wheel{width:3px;height:6px;border-radius:4px;background:#c7c7cc;animation:scrollWheelMove 1.6s ease-in-out infinite}.scroll-label{text-transform:uppercase;letter-spacing:1.2px;animation:scrollLabelPulse 2.2s ease-in-out infinite}.scroll-hint:hover{animation-play-state:paused}.scroll-hint:hover .scroll-wheel,.scroll-hint:hover .scroll-label{animation-play-state:paused}@keyframes scrollHintFloat{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,-6px)}}@keyframes scrollWheelMove{0%{transform:translateY(0);opacity:1}55%{transform:translateY(9px);opacity:.2}56%{transform:translateY(0);opacity:0}100%{transform:translateY(0);opacity:1}}@keyframes scrollLabelPulse{0%,100%{opacity:.65;letter-spacing:1.2px}50%{opacity:1;letter-spacing:1.8px}}

.produkte-sec,.leistungen-sec,.ueber-sec,.prozess-sec,.blog-sec{padding:96px 48px}.produkte-head,.prozess-head{max-width:760px;margin:0 auto 48px;text-align:center}.sec-label{font-size:11px;font-weight:600;color:#14a0dc;letter-spacing:2.2px;text-transform:uppercase;margin-bottom:14px}.sec-title{font-size:clamp(34px,5vw,58px);font-weight:300;letter-spacing:-2px;line-height:1.08;color:#1d1d1f}.sec-title strong{font-weight:600;color:#14a0dc}.sec-sub{font-size:16px;color:#6e6e73;font-weight:300;line-height:1.65;max-width:620px;margin:18px auto 0}
.produkte-grid{max-width:1120px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.produkt-card,.blog-card,.ueber-card,.p-step{border-radius:24px;background:#fff;border:1px solid rgba(0,0,0,.07);overflow:hidden;box-shadow:0 18px 52px rgba(0,0,0,.05);transition:transform .25s,box-shadow .25s}.produkt-card:hover,.blog-card:hover,.ueber-card:hover,.p-step:hover{transform:translateY(-5px);box-shadow:0 24px 70px rgba(0,0,0,.09)}.produkt-card-img{height:180px;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}.produkt-card-img svg{width:92px;height:92px;stroke:rgba(255,255,255,.72);fill:none;stroke-width:1.2}.produkt-card-img.blue{background:linear-gradient(135deg,#0d7aad,#14a0dc)}.produkt-card-img.dark{background:linear-gradient(135deg,#222,#3c3c3c)}.produkt-card-img.teal{background:linear-gradient(135deg,#0f8f98,#14a0dc)}.produkt-card-img.slate{background:linear-gradient(135deg,#46515c,#222)}.produkt-card-badge{position:absolute;top:16px;left:16px;background:rgba(255,255,255,.2);color:#fff;border:1px solid rgba(255,255,255,.25);border-radius:999px;padding:5px 10px;font-size:11px;font-weight:600}.produkt-card-body{padding:22px}.produkt-card-body h3,.blog-card-body h3,.ueber-card h4,.p-step h4{font-size:18px;line-height:1.25;margin-bottom:10px;color:#1d1d1f}.produkt-card-body p,.blog-card-body p,.ueber-card p,.p-step p{font-size:13px;color:#6e6e73;font-weight:300;line-height:1.6}.card-link{display:inline-block;margin-top:16px;font-size:13px;color:#14a0dc;font-weight:500;text-decoration:none}

.leistungen-sec{background:#f5f5f7}.leistungen-inner{max-width:1120px;margin:0 auto;display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}.leistungen-list{display:flex;flex-direction:column;gap:14px;margin-top:32px}.leis-item{display:flex;gap:16px;align-items:flex-start;background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:18px;padding:18px}.leis-icon{flex:0 0 42px;margin-bottom:0}.leis-text h4{font-size:16px;margin-bottom:4px}.leis-text p{font-size:13px;color:#6e6e73}.leis-visual{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.leis-stat{min-height:150px;background:#fff;border-radius:24px;padding:24px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 18px 52px rgba(0,0,0,.05)}.leis-stat-n{font-size:42px;font-weight:600;letter-spacing:-2px;color:#14a0dc}.leis-stat-l{font-size:13px;color:#6e6e73;line-height:1.5}

.ueber-inner{max-width:1120px;margin:0 auto}.ueber-head{max-width:720px;margin-bottom:42px}.ueber-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:24px}.ueber-card{padding:28px}.ueber-num{font-size:12px;color:#14a0dc;font-weight:600;letter-spacing:1.5px;margin-bottom:30px}.ueber-story{display:grid;grid-template-columns:1fr 1fr;gap:34px;background:#1d1d1f;border-radius:28px;padding:42px;color:#fff}.ueber-story h3{font-size:clamp(26px,4vw,42px);font-weight:300;letter-spacing:-1.5px;line-height:1.1;margin-bottom:18px}.ueber-story h3 strong{color:#14a0dc}.ueber-story p{font-size:15px;color:rgba(255,255,255,.62);font-weight:300;line-height:1.7}.ueber-checks{display:flex;flex-direction:column;gap:13px}.ueber-check{display:flex;align-items:center;gap:11px;font-size:14px;color:rgba(255,255,255,.78)}.ueber-check-dot{width:8px;height:8px;background:#14a0dc;border-radius:50%;flex:0 0 8px}

.prozess-sec{background:#fff}.prozess-steps{max-width:1120px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.p-step{padding:26px}.p-step-n{width:38px;height:38px;border-radius:50%;background:#14a0dc;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;margin-bottom:32px}

.blog-sec{background:#f5f5f7}.blog-head{max-width:1120px;margin:0 auto 34px;display:flex;justify-content:space-between;gap:24px;align-items:end}.blog-grid{max-width:1120px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.blog-card-img{height:170px;display:flex;align-items:center;justify-content:center}.blog-card-img svg{width:72px;height:72px;stroke:rgba(255,255,255,.75);fill:none;stroke-width:1.2}.blog-card-img.c1{background:linear-gradient(135deg,#0d7aad,#14a0dc)}.blog-card-img.c2{background:linear-gradient(135deg,#222,#3c3c3c)}.blog-card-img.c3{background:linear-gradient(135deg,#0f8f98,#14a0dc)}.blog-card-body{padding:22px}.blog-tag{font-size:11px;text-transform:uppercase;letter-spacing:1px;font-weight:600;color:#14a0dc;margin-bottom:10px}.blog-meta{display:flex;justify-content:space-between;border-top:1px solid rgba(0,0,0,.07);padding-top:14px;margin-top:18px}.blog-date,.blog-read{font-size:11px;color:#b0b0b8}.blog-read{color:#14a0dc;font-weight:500}

.cta-sec{padding:110px 48px;text-align:center;background:linear-gradient(135deg,#0d7aad,#14a0dc);color:#fff}.cta-sec h2{font-size:clamp(38px,6vw,72px);font-weight:300;letter-spacing:-3px;line-height:1.05;margin-bottom:18px}.cta-sec h2 strong{font-weight:600}.cta-sec p{font-size:17px;color:rgba(255,255,255,.72);font-weight:300;max-width:560px;margin:0 auto 30px}

@media(max-width:1000px){.produkte-grid{grid-template-columns:repeat(2,1fr)}.leistungen-inner,.ueber-story{grid-template-columns:1fr}.prozess-steps{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.hero{padding:84px 24px 56px;min-height:auto}.hero h1{letter-spacing:-2.5px}.hero-cards,.produkte-grid,.ueber-grid,.prozess-steps,.blog-grid,.leis-visual{grid-template-columns:1fr}.produkte-sec,.leistungen-sec,.ueber-sec,.prozess-sec,.blog-sec,.cta-sec{padding:64px 24px}.blog-head{align-items:flex-start;flex-direction:column}.sec-title{letter-spacing:-1.2px}.ueber-story{padding:28px}.scroll-hint{display:none}}

/* GENERIC WORDPRESS PAGES */
.st-page{background:#fff}
.st-page-hero{background:#f5f5f7;padding:64px 48px 46px}
.st-page-inner{max-width:1000px;margin:0 auto}
.st-page-hero h1{font-size:clamp(32px,5vw,56px);font-weight:300;letter-spacing:-2px;line-height:1.1;color:#1d1d1f;margin:0}
.st-page-content-wrap{padding:58px 48px 96px}
.st-page-content{max-width:900px;margin:0 auto;font-size:16px;color:#3c3c3c;font-weight:300;line-height:1.75}
.st-page-content h2{font-size:clamp(24px,3vw,34px);font-weight:300;letter-spacing:-1px;color:#1d1d1f;line-height:1.2;margin:44px 0 16px}
.st-page-content h3{font-size:20px;font-weight:500;color:#1d1d1f;margin:32px 0 12px}
.st-page-content h4{font-size:16px;font-weight:600;color:#1d1d1f;margin:24px 0 10px}
.st-page-content p{margin:0 0 18px}
.st-page-content a{color:#14a0dc;text-decoration:none}
.st-page-content a:hover{text-decoration:underline}
.st-page-content ul,.st-page-content ol{margin:16px 0 22px;padding-left:22px}
.st-page-content li{margin-bottom:8px}
.st-page-content img{max-width:100%;height:auto;border-radius:14px}
.st-page-content figure{margin:28px 0}
.st-page-content table{width:100%;border-collapse:collapse;margin:24px 0;font-size:14px}
.st-page-content th,.st-page-content td{border-bottom:.5px solid rgba(0,0,0,.1);padding:10px 12px;text-align:left}
.st-page-content th{font-weight:600;color:#1d1d1f;background:#f5f5f7}
.entry-content,.wp-block-group,.wp-block-columns{max-width:100%}
.wp-block-image img{height:auto}

/* Single post refinements */
.st-single-hero > div{max-width:900px !important}
.st-single-layout{align-items:start}
.st-post-content img{max-width:100%;height:auto;border-radius:14px}
.st-post-content figure{margin:28px 0}
.st-post-content a{color:#14a0dc;text-decoration:none}
.st-post-content a:hover{text-decoration:underline}

@media(max-width:900px){
  .st-page-hero{padding:48px 24px 36px}
  .st-page-content-wrap{padding:42px 24px 72px}
  .st-page-content{font-size:15px}
  .st-single-hero{padding:48px 24px 36px}
}

@media(max-width:600px){
  .st-page-hero h1{letter-spacing:-1.2px}
  .st-page-content-wrap{padding-left:20px;padding-right:20px}
}

/* ===== UNTERSEITEN: PRODUKTSEITEN / NIETTECHNIK ===== */

.page-hero {
  background: #f5f5f7;
  padding: 72px 48px 80px;
  overflow: hidden;
}

.page-hero-inner {
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  align-items: center;
  gap: 64px;
}

.page-hero-label {
  font-size: 13px;
  font-weight: 600;
  color: #14a0dc;
  margin-bottom: 16px;
  letter-spacing: .5px;
}

.page-hero h1 {
  font-size: clamp(40px, 6vw, 76px);
  line-height: .95;
  letter-spacing: -3px;
  font-weight: 300;
  margin-bottom: 24px;
}

.page-hero h1 strong {
  font-weight: 600;
}

.page-hero-sub {
  max-width: 620px;
  font-size: 18px;
  color: #6e6e73;
  font-weight: 300;
  line-height: 1.65;
  margin-bottom: 32px;
}

.hero-btns {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 28px;
}

.btn-primary,
.btn-outline,
.btn-white,
.btn-white-outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 500;
  padding: 13px 24px;
  transition: transform .2s, opacity .2s, background .2s, color .2s;
  cursor: pointer;
}

.btn-primary {
  background: #14a0dc;
  color: #fff;
  box-shadow: 0 16px 36px rgba(20,160,220,.22);
}

.btn-primary:hover {
  opacity: .9;
  transform: translateY(-1px);
}

.btn-outline {
  color: #1d1d1f;
  border: 1px solid rgba(0,0,0,.12);
  background: #fff;
}

.btn-outline:hover {
  background: #f5f5f7;
}

.hero-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.hero-badge-pill {
  display: inline-flex;
  align-items: center;
  padding: 8px 13px;
  border-radius: 999px;
  background: #fff;
  color: #3c3c3c;
  font-size: 13px;
  border: 1px solid rgba(0,0,0,.08);
}

.page-hero-visual {
  width: 100%;
  max-width: 360px;
  aspect-ratio: 1 / 1;
  margin-left: auto;
  border-radius: 36px;
  background: linear-gradient(135deg, #0d7aad, #14a0dc);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 30px 80px rgba(20,160,220,.25);
}

.page-hero-visual svg {
  width: 62%;
  height: 62%;
  max-width: 240px;
  max-height: 240px;
  fill: none;
  stroke: #fff;
  stroke-width: 4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Modell-Navigation */

.model-nav {
  position: sticky;
  top: 58px;
  z-index: 150;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(0,0,0,.07);
}

.model-nav-inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 10px 48px;
  display: flex;
  gap: 8px;
  overflow-x: auto;
}

.model-nav-item {
  white-space: nowrap;
  text-decoration: none;
  color: #6e6e73;
  font-size: 13px;
  padding: 8px 14px;
  border-radius: 999px;
  transition: background .2s, color .2s;
}

.model-nav-item:hover,
.model-nav-item.active {
  background: rgba(20,160,220,.08);
  color: #14a0dc;
}

/* Modelle */

.models-sec {
  max-width: 1100px;
  margin: 0 auto;
  padding: 80px 48px;
}

.model-block {
  padding: 72px 0;
  border-bottom: 1px solid rgba(0,0,0,.07);
}

.model-header {
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  align-items: center;
  gap: 56px;
  margin-bottom: 40px;
}

.model-tag {
  font-size: 13px;
  color: #14a0dc;
  font-weight: 600;
  margin-bottom: 10px;
}

.model-title {
  font-size: clamp(42px, 5vw, 68px);
  line-height: 1;
  letter-spacing: -2px;
  font-weight: 600;
  margin-bottom: 8px;
}

.model-subtitle {
  font-size: 26px;
  font-weight: 300;
  color: #1d1d1f;
  margin-bottom: 18px;
}

.model-desc {
  font-size: 16px;
  color: #6e6e73;
  line-height: 1.7;
  max-width: 620px;
  margin-bottom: 28px;
}

.model-actions {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
}

.model-visual {
  min-height: 320px;
  border-radius: 28px;
  background: #f5f5f7;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.model-visual svg {
  width: 180px;
  height: 180px;
  fill: none;
  stroke: #14a0dc;
  stroke-width: 4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.model-visual-label {
  position: absolute;
  bottom: 24px;
  font-size: 13px;
  color: #6e6e73;
}

/* Tabellen */

.specs-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin-top: 32px;
}

.specs-table,
.steuerung-table,
.compare-table {
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 22px;
  overflow: hidden;
  box-shadow: 0 12px 40px rgba(0,0,0,.04);
}

.specs-table h4 {
  font-size: 15px;
  padding: 20px 24px;
  background: #f5f5f7;
  border-bottom: 1px solid rgba(0,0,0,.07);
}

.spec-row,
.steuerung-row,
.compare-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  padding: 14px 24px;
  border-bottom: 1px solid rgba(0,0,0,.06);
  font-size: 14px;
}

.spec-row:last-child,
.steuerung-row:last-child,
.compare-row:last-child {
  border-bottom: 0;
}

.spec-key {
  color: #6e6e73;
}

.spec-val {
  font-weight: 500;
  color: #1d1d1f;
  text-align: right;
}

.steuerung-table {
  margin-top: 28px;
}

.steuerung-header,
.steuerung-row {
  display: grid;
  grid-template-columns: 1fr 100px 100px;
  align-items: center;
}

.steuerung-header {
  background: #f5f5f7;
  padding: 16px 24px;
  font-size: 13px;
  font-weight: 600;
  color: #1d1d1f;
}

.check-yes {
  color: #14a0dc;
  font-weight: 600;
  text-align: center;
}

.check-opt {
  color: #b0b0b8;
  text-align: center;
}

/* CTA */

.cta-banner {
  margin-top: 72px;
  background: linear-gradient(135deg, #0d7aad, #14a0dc);
  color: #fff;
  border-radius: 32px;
  padding: 44px 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}

.cta-banner h3 {
  font-size: clamp(26px, 4vw, 42px);
  line-height: 1.1;
  font-weight: 300;
  margin-bottom: 12px;
}

.cta-banner h3 strong {
  font-weight: 600;
}

.cta-banner p {
  color: rgba(255,255,255,.78);
  font-size: 15px;
}

.cta-banner-btns {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.btn-white {
  background: #fff;
  color: #14a0dc;
}

.btn-white-outline {
  color: #fff;
  border: 1px solid rgba(255,255,255,.45);
}

/* Vergleich */

.compare-sec {
  background: #f5f5f7;
  padding: 80px 48px;
}

.compare-inner {
  max-width: 1100px;
  margin: 0 auto;
}

.compare-head {
  text-align: center;
  margin-bottom: 36px;
}

.compare-head h2 {
  font-size: clamp(32px, 5vw, 56px);
  font-weight: 300;
  letter-spacing: -2px;
  line-height: 1.05;
  margin-bottom: 14px;
}

.compare-head h2 strong {
  color: #14a0dc;
  font-weight: 600;
}

.compare-head p {
  color: #6e6e73;
}

.compare-table {
  overflow-x: auto;
}

.compare-header,
.compare-row {
  display: grid;
  grid-template-columns: 1.4fr repeat(4, 1fr);
  min-width: 760px;
}

.compare-header {
  background: #fff;
  padding: 18px 22px;
  font-size: 13px;
  font-weight: 600;
  color: #1d1d1f;
  border-bottom: 1px solid rgba(0,0,0,.08);
}

.compare-row {
  padding: 15px 22px;
  font-size: 13px;
  color: #3c3c3c;
}

.compare-row span:first-child {
  font-weight: 500;
  color: #1d1d1f;
}

/* Responsive */

@media (max-width: 900px) {
  .page-hero {
    padding: 56px 24px 64px;
  }

  .page-hero-inner,
  .model-header {
    grid-template-columns: 1fr;
    gap: 36px;
  }

  .page-hero-visual {
    margin: 0;
    max-width: 100%;
  }

  .models-sec,
  .compare-sec {
    padding: 56px 24px;
  }

  .model-nav-inner {
    padding: 10px 24px;
  }

  .specs-grid {
    grid-template-columns: 1fr;
  }

  .cta-banner {
    flex-direction: column;
    align-items: flex-start;
    padding: 36px 28px;
  }
}

@media (max-width: 600px) {
  .page-hero h1 {
    font-size: 42px;
    letter-spacing: -1.5px;
  }

  .page-hero-sub {
    font-size: 16px;
  }

  .steuerung-header,
  .steuerung-row {
    grid-template-columns: 1fr 70px 70px;
    font-size: 12px;
    padding-left: 14px;
    padding-right: 14px;
  }

  .spec-row {
    padding: 13px 16px;
  }
}

/* =========================================================
   LEISTUNGEN-SEITE FIX
   passend zu page-leistungen.php
========================================================= */

/* Section Navigation */

.page-leistungen .section-nav{
  position: sticky;
  top: 58px;
  z-index: 150;
  background: rgba(255,255,255,.94);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(0,0,0,.07);
}

.page-leistungen .section-nav-inner{
  max-width: 1100px;
  margin: 0 auto;
  padding: 10px 48px;
  display: flex;
  align-items: center;
  gap: 8px;
  overflow-x: auto;
}

.page-leistungen .section-nav-item{
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  text-decoration: none;
  color: #6e6e73;
  font-size: 13px;
  padding: 8px 14px;
  border-radius: 999px;
  transition: background .2s, color .2s;
}

.page-leistungen .section-nav-item:hover,
.page-leistungen .section-nav-item.active{
  background: rgba(20,160,220,.08);
  color: #14a0dc;
}

/* USP Strip */

.page-leistungen .usp-strip{
  background: #fff;
  padding: 64px 48px;
}

.page-leistungen .usp-strip-inner{
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 22px;
}

.page-leistungen .usp-card{
  background: #f5f5f7;
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 24px;
  padding: 28px 24px;
  min-height: 180px;
}

.page-leistungen .usp-num{
  font-size: 30px;
  line-height: 1;
  color: #14a0dc;
  font-weight: 600;
  margin-bottom: 18px;
}

.page-leistungen .usp-card h4{
  font-size: 16px;
  color: #1d1d1f;
  margin-bottom: 10px;
}

.page-leistungen .usp-card p{
  font-size: 13px;
  line-height: 1.6;
  color: #6e6e73;
}

/* Leistungen Hauptbereich */

.page-leistungen .leistungen-sec{
  background: #fff;
  padding: 86px 48px;
}

.page-leistungen .leistungen-inner{
  max-width: 1100px;
  margin: 0 auto;
}

.page-leistungen .leis-item{
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  align-items: center;
  gap: 64px;
  padding: 86px 0;
  border-bottom: 1px solid rgba(0,0,0,.07);
}

.page-leistungen .leis-item:first-child{
  padding-top: 0;
}

.page-leistungen .leis-item:last-child{
  border-bottom: none;
}

.page-leistungen .leis-item.reverse{
  grid-template-columns: .9fr 1.1fr;
}

.page-leistungen .leis-item.reverse > div:first-child{
  order: 2;
}

.page-leistungen .leis-item.reverse > div:last-child{
  order: 1;
}

.page-leistungen .leis-num{
  font-size: 13px;
  color: #14a0dc;
  font-weight: 600;
  margin-bottom: 14px;
  letter-spacing: .3px;
}

.page-leistungen .leis-title{
  font-size: clamp(36px, 5vw, 58px);
  line-height: 1.05;
  letter-spacing: -2px;
  font-weight: 300;
  color: #1d1d1f;
  margin-bottom: 22px;
}

.page-leistungen .leis-title strong{
  color: #14a0dc;
  font-weight: 600;
}

.page-leistungen .leis-desc{
  font-size: 16px;
  line-height: 1.75;
  color: #6e6e73;
  font-weight: 300;
  margin-bottom: 26px;
  max-width: 620px;
}

.page-leistungen .leis-details{
  display: grid;
  gap: 10px;
  margin: 24px 0;
}

.page-leistungen .leis-detail{
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 14px;
  color: #3c3c3c;
  line-height: 1.5;
}

.page-leistungen .leis-detail-dot{
  width: 7px;
  height: 7px;
  background: #14a0dc;
  border-radius: 50%;
  flex-shrink: 0;
  margin-top: 7px;
}

.page-leistungen .leis-tags{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 24px 0 28px;
}

.page-leistungen .leis-tag{
  display: inline-flex;
  align-items: center;
  background: #f5f5f7;
  color: #3c3c3c;
  border: 1px solid rgba(0,0,0,.07);
  border-radius: 999px;
  padding: 7px 12px;
  font-size: 12px;
}

/* Visual Boxen */

.page-leistungen .leis-visual{
  min-height: 360px;
  border-radius: 34px;
  background: linear-gradient(135deg, #0d7aad, #14a0dc);
  box-shadow: 0 30px 80px rgba(20,160,220,.24);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
}

.page-leistungen .leis-visual svg{
  width: 180px;
  height: 150px;
  max-width: 58%;
  max-height: 58%;
  fill: none;
  stroke: rgba(255,255,255,.9);
  stroke-width: 4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.page-leistungen .leis-visual-badge{
  position: absolute;
  left: 28px;
  bottom: 28px;
  color: rgba(255,255,255,.86);
  font-size: 13px;
  font-weight: 500;
}

.page-leistungen .leis-visual-label{
  position: absolute;
  top: 24px;
  right: 28px;
  color: rgba(255,255,255,.28);
  font-size: 60px;
  line-height: 1;
  font-weight: 600;
}

/* Materialien */

.page-leistungen .material-sec{
  background: #f5f5f7;
  padding: 86px 48px;
}

.page-leistungen .material-inner{
  max-width: 1100px;
  margin: 0 auto;
}

.page-leistungen .material-head,
.page-leistungen .prozess-head{
  text-align: center;
  max-width: 720px;
  margin: 0 auto 46px;
}

.page-leistungen .sec-label{
  font-size: 13px;
  color: #14a0dc;
  font-weight: 600;
  margin-bottom: 12px;
}

.page-leistungen .sec-title{
  font-size: clamp(34px, 5vw, 56px);
  line-height: 1.05;
  letter-spacing: -2px;
  font-weight: 300;
  color: #1d1d1f;
  margin-bottom: 16px;
}

.page-leistungen .sec-title strong{
  color: #14a0dc;
  font-weight: 600;
}

.page-leistungen .sec-sub{
  font-size: 16px;
  color: #6e6e73;
  font-weight: 300;
  line-height: 1.7;
}

.page-leistungen .material-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.page-leistungen .material-card{
  background: #fff;
  border-radius: 26px;
  padding: 32px 28px;
  border: 1px solid rgba(0,0,0,.07);
  box-shadow: 0 12px 40px rgba(0,0,0,.04);
}

.page-leistungen .material-icon{
  width: 46px;
  height: 46px;
  border-radius: 14px;
  background: rgba(20,160,220,.1);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 22px;
}

.page-leistungen .material-icon svg{
  width: 24px;
  height: 24px;
  fill: none;
  stroke: #14a0dc;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.page-leistungen .material-card h3{
  font-size: 22px;
  color: #1d1d1f;
  margin-bottom: 12px;
}

.page-leistungen .material-card p{
  color: #6e6e73;
  font-size: 14px;
  line-height: 1.7;
  margin-bottom: 22px;
}

.page-leistungen .material-specs{
  display: grid;
  gap: 8px;
}

.page-leistungen .material-spec{
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding-top: 8px;
  border-top: 1px solid rgba(0,0,0,.06);
  font-size: 13px;
}

.page-leistungen .material-spec-k{
  color: #6e6e73;
}

.page-leistungen .material-spec-v{
  color: #1d1d1f;
  font-weight: 500;
  text-align: right;
}

/* Prozess */

.page-leistungen .prozess-sec{
  background: #fff;
  padding: 86px 48px;
}

.page-leistungen .prozess-inner{
  max-width: 1100px;
  margin: 0 auto;
}

.page-leistungen .prozess-grid{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 22px;
}

.page-leistungen .p-step{
  background: #f5f5f7;
  border-radius: 24px;
  padding: 28px 24px;
  border: 1px solid rgba(0,0,0,.06);
}

.page-leistungen .p-step-n{
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: #14a0dc;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  margin-bottom: 18px;
}

.page-leistungen .p-step h4{
  font-size: 16px;
  color: #1d1d1f;
  margin-bottom: 10px;
}

.page-leistungen .p-step p{
  color: #6e6e73;
  font-size: 13px;
  line-height: 1.6;
}

/* CTA Banner Fix, falls noch nicht sauber */

.page-leistungen .cta-banner{
  margin-top: 72px;
  background: linear-gradient(135deg, #0d7aad, #14a0dc);
  color: #fff;
  border-radius: 32px;
  padding: 44px 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}

.page-leistungen .cta-banner h3{
  font-size: clamp(28px, 4vw, 42px);
  line-height: 1.1;
  font-weight: 300;
  margin-bottom: 12px;
}

.page-leistungen .cta-banner h3 strong{
  font-weight: 600;
}

.page-leistungen .cta-banner p{
  color: rgba(255,255,255,.78);
  font-size: 15px;
}

.page-leistungen .cta-banner-btns{
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.page-leistungen .btn-white{
  background: #fff;
  color: #14a0dc;
}

.page-leistungen .btn-white-outline{
  color: #fff;
  border: 1px solid rgba(255,255,255,.45);
}

/* Responsive */

@media (max-width: 900px) {
  .page-leistungen .section-nav-inner{
    padding: 10px 24px;
  }

  .page-leistungen .usp-strip{
    padding: 48px 24px;
  }

  .page-leistungen .usp-strip-inner{
    grid-template-columns: repeat(2, 1fr);
  }

  .page-leistungen .leistungen-sec,
.page-leistungen .material-sec,
.page-leistungen .prozess-sec{
    padding: 64px 24px;
  }

  .page-leistungen .leis-item,
.page-leistungen .leis-item.reverse{
    grid-template-columns: 1fr;
    gap: 36px;
    padding: 64px 0;
  }

  .page-leistungen .leis-item.reverse > div:first-child,
.page-leistungen .leis-item.reverse > div:last-child{
    order: initial;
  }

  .page-leistungen .leis-visual{
    min-height: 280px;
  }

  .page-leistungen .material-grid,
.page-leistungen .prozess-grid{
    grid-template-columns: 1fr;
  }

  .page-leistungen .cta-banner{
    flex-direction: column;
    align-items: flex-start;
    padding: 36px 28px;
  }
}

@media (max-width: 600px) {
  .page-leistungen .usp-strip-inner{
    grid-template-columns: 1fr;
  }

  .page-leistungen .leis-title,
.page-leistungen .sec-title{
    font-size: 36px;
    letter-spacing: -1.2px;
  }

  .page-leistungen .leis-desc,
.page-leistungen .sec-sub{
    font-size: 15px;
  }

  .page-leistungen .leis-visual{
    min-height: 230px;
    border-radius: 24px;
  }

  .page-leistungen .material-card,
.page-leistungen .p-step{
    padding: 24px 22px;
  }
}

/* =========================================================
   FÖRDERTECHNIK-SEITE FIX
   passend zu page-foerdertechnik.php
========================================================= */

/* Intro Banner */

.page-foerdertechnik .intro-banner{
  background: #fff;
  padding: 64px 48px 24px;
}

.page-foerdertechnik .intro-banner-inner{
  max-width: 1100px;
  margin: 0 auto;
  background: #f5f5f7;
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 30px;
  padding: 38px 42px;
  display: grid;
  grid-template-columns: 1.6fr .7fr .7fr;
  gap: 32px;
  align-items: center;
}

.page-foerdertechnik .intro-kicker{
  font-size: 13px;
  color: #14a0dc;
  font-weight: 600;
  margin-bottom: 10px;
}

.page-foerdertechnik .intro-banner h3{
  font-size: clamp(28px, 4vw, 44px);
  line-height: 1.08;
  letter-spacing: -1.5px;
  font-weight: 300;
  color: #1d1d1f;
}

.page-foerdertechnik .intro-banner h3 strong{
  color: #14a0dc;
  font-weight: 600;
}

.page-foerdertechnik .intro-stat{
  background: #fff;
  border: 1px solid rgba(0,0,0,.07);
  border-radius: 22px;
  padding: 24px 22px;
  min-height: 120px;
}

.page-foerdertechnik .intro-stat-n{
  font-size: 34px;
  line-height: 1;
  color: #14a0dc;
  font-weight: 600;
  margin-bottom: 12px;
}

.page-foerdertechnik .intro-stat-l{
  font-size: 13px;
  color: #6e6e73;
  line-height: 1.5;
}

/* Fördertechnik: Tabellenblock */

.page-foerdertechnik .specs-features-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin-top: 34px;
}

.page-foerdertechnik .features-table{
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 22px;
  overflow: hidden;
  box-shadow: 0 12px 40px rgba(0,0,0,.04);
}

.page-foerdertechnik .features-table h4{
  font-size: 15px;
  padding: 20px 24px;
  background: #f5f5f7;
  border-bottom: 1px solid rgba(0,0,0,.07);
  color: #1d1d1f;
}

.page-foerdertechnik .feature-row{
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 15px 24px;
  border-bottom: 1px solid rgba(0,0,0,.06);
}

.page-foerdertechnik .feature-row:last-child{
  border-bottom: 0;
}

.page-foerdertechnik .feature-dot{
  width: 7px;
  height: 7px;
  background: #14a0dc;
  border-radius: 50%;
  flex-shrink: 0;
  margin-top: 8px;
}

.page-foerdertechnik .feature-text{
  font-size: 14px;
  color: #3c3c3c;
  line-height: 1.55;
}

/* Fördertechnik: SVG im Hero sauber begrenzen */

.page-foerdertechnik .page-hero-visual svg{
  width: 70%;
  height: auto;
  max-width: 260px;
  max-height: 180px;
}

/* Fördertechnik: Modellvisuals breiter für Förderbänder */

.page-foerdertechnik .model-visual svg{
  width: 76%;
  height: auto;
  max-width: 260px;
  max-height: 180px;
}

/* Vergleichstabelle: 3-Spalten-Variante für Fördertechnik */

.page-foerdertechnik .compare-table .compare-header,
.page-foerdertechnik .compare-table .compare-row{
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr;
  align-items: center;
  min-width: 640px;
}

.page-foerdertechnik .compare-label{
  font-weight: 500;
  color: #1d1d1f;
}

/* Falls auf Niettechnik 5 Spalten gebraucht werden, dort explizit erhalten */
.page-foerdertechnik #vergleich .compare-table .compare-header:has(span:nth-child(5)),
.page-foerdertechnik #vergleich .compare-table .compare-row:has(span:nth-child(5)){
  grid-template-columns: 1.4fr repeat(4, 1fr);
  min-width: 760px;
}

/* Responsive Fördertechnik */

@media (max-width: 900px) {
  .page-foerdertechnik .intro-banner{
    padding: 48px 24px 12px;
  }

  .page-foerdertechnik .intro-banner-inner{
    grid-template-columns: 1fr;
    padding: 32px 26px;
  }

  .page-foerdertechnik .specs-features-grid{
    grid-template-columns: 1fr;
  }

  .page-foerdertechnik .page-hero-visual svg,
.page-foerdertechnik .model-visual svg{
    max-width: 220px;
  }
}

@media (max-width: 600px) {
  .page-foerdertechnik .intro-banner h3{
    font-size: 32px;
    letter-spacing: -1px;
  }

  .page-foerdertechnik .intro-stat{
    min-height: auto;
  }

  .page-foerdertechnik .compare-table{
    overflow-x: auto;
  }
}

/* =========================================================
   AUTOMATISIERUNG-SEITE FIX
   passend zu page-automatisierung.php
========================================================= */

/* Dunkler Hero */

.page-automatisierung .hero{
  position: relative;
  overflow: hidden;
  background: radial-gradient(circle at 70% 30%, rgba(20,160,220,.28), transparent 35%),
              linear-gradient(135deg, #111827 0%, #1d1d1f 55%, #0b1117 100%);
  color: #fff;
  padding: 92px 48px 110px;
  min-height: 680px;
}

.page-automatisierung .hero-glow{
  position: absolute;
  right: -160px;
  top: -160px;
  width: 520px;
  height: 520px;
  background: rgba(20,160,220,.22);
  filter: blur(80px);
  border-radius: 50%;
  pointer-events: none;
}

.page-automatisierung .hero-grid{
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.7), transparent 85%);
  pointer-events: none;
}

.page-automatisierung .hero > *:not(.hero-glow):not(.hero-grid){
  position: relative;
  z-index: 2;
  max-width: 1100px;
  margin-left: auto;
  margin-right: auto;
}

.page-automatisierung .hero .breadcrumb{
  color: rgba(255,255,255,.45);
  margin-bottom: 34px;
}

.page-automatisierung .hero .breadcrumb a{
  color: rgba(255,255,255,.55);
}

.page-automatisierung .hero .breadcrumb a:hover{
  color: #fff;
}

.page-automatisierung .hero-badge{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 999px;
  padding: 8px 14px;
  color: rgba(255,255,255,.78);
  font-size: 13px;
  margin-bottom: 24px;
}

.page-automatisierung .hero-badge-dot{
  width: 8px;
  height: 8px;
  background: #14a0dc;
  border-radius: 50%;
  box-shadow: 0 0 18px rgba(20,160,220,.8);
}

.page-automatisierung .hero h1{
  font-size: clamp(48px, 7vw, 92px);
  line-height: .95;
  letter-spacing: -4px;
  font-weight: 300;
  margin-bottom: 28px;
  max-width: 900px;
}

.page-automatisierung .hero h1 strong{
  color: #14a0dc;
  font-weight: 600;
}

.page-automatisierung .hero-sub{
  max-width: 700px;
  color: rgba(255,255,255,.72);
  font-size: 19px;
  font-weight: 300;
  line-height: 1.7;
  margin-bottom: 34px;
}

.page-automatisierung .btn-ghost-white{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  text-decoration: none;
  border: 1px solid rgba(255,255,255,.22);
  background: rgba(255,255,255,.06);
  border-radius: 999px;
  padding: 13px 24px;
  font-size: 14px;
  font-weight: 500;
  transition: background .2s, transform .2s;
}

.page-automatisierung .btn-ghost-white:hover{
  background: rgba(255,255,255,.12);
  transform: translateY(-1px);
}

.page-automatisierung .hero-stats{
  display: grid;
  grid-template-columns: repeat(3, minmax(140px, 1fr));
  gap: 18px;
  max-width: 680px !important;
  margin-left: 0 !important;
  margin-top: 48px;
}

.page-automatisierung .hero-stat{
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 22px;
  padding: 22px 20px;
  backdrop-filter: blur(14px);
}

.page-automatisierung .hero-stat-n{
  font-size: 32px;
  line-height: 1;
  color: #14a0dc;
  font-weight: 600;
  margin-bottom: 10px;
}

.page-automatisierung .hero-stat-l{
  color: rgba(255,255,255,.68);
  font-size: 13px;
  line-height: 1.45;
}

/* Intro */

.page-automatisierung .intro-sec{
  background: #fff;
  padding: 90px 48px;
}

.page-automatisierung .intro-inner{
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 64px;
  align-items: center;
}

.page-automatisierung .intro-features{
  display: grid;
  gap: 18px;
  margin-top: 34px;
}

.page-automatisierung .intro-feat{
  display: flex;
  gap: 16px;
  align-items: flex-start;
}

.page-automatisierung .intro-feat-icon{
  width: 42px;
  height: 42px;
  border-radius: 14px;
  background: rgba(20,160,220,.1);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.page-automatisierung .intro-feat-icon svg{
  width: 22px;
  height: 22px;
  fill: none;
  stroke: #14a0dc;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.page-automatisierung .intro-feat h4{
  font-size: 16px;
  color: #1d1d1f;
  margin-bottom: 5px;
}

.page-automatisierung .intro-feat p{
  font-size: 14px;
  color: #6e6e73;
  line-height: 1.6;
}

.page-automatisierung .intro-visual{
  background: #f5f5f7;
  border-radius: 32px;
  padding: 28px;
  display: grid;
  gap: 12px;
  border: 1px solid rgba(0,0,0,.06);
  box-shadow: 0 24px 70px rgba(0,0,0,.06);
}

.page-automatisierung .intro-vis-stat{
  background: #fff;
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 16px;
  padding: 16px 18px;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: center;
}

.page-automatisierung .intro-vis-label{
  color: #6e6e73;
  font-size: 13px;
}

.page-automatisierung .intro-vis-val{
  color: #14a0dc;
  font-size: 13px;
  font-weight: 600;
  text-align: right;
}

/* CNC */

.page-automatisierung .cnc-sec{
  background: #f5f5f7;
  padding: 90px 48px;
}

.page-automatisierung .cnc-inner{
  max-width: 1100px;
  margin: 0 auto;
}

.page-automatisierung .cnc-head,
.page-automatisierung .anlagen-head,
.page-automatisierung .robotik-head,
.page-automatisierung .prozess-head{
  max-width: 760px;
  margin-bottom: 46px;
}

.page-automatisierung .cnc-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.page-automatisierung .cnc-card{
  background: #fff;
  border: 1px solid rgba(0,0,0,.07);
  border-radius: 28px;
  overflow: hidden;
  box-shadow: 0 18px 50px rgba(0,0,0,.05);
}

.page-automatisierung .cnc-card-top{
  min-height: 190px;
  background: linear-gradient(135deg, #0d7aad, #14a0dc);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.page-automatisierung .cnc-card-top.c2{
  background: linear-gradient(135deg, #177ca8, #14a0dc);
}

.page-automatisierung .cnc-card-top.c3{
  background: linear-gradient(135deg, #0b5f86, #14a0dc);
}

.page-automatisierung .cnc-card-top svg{
  width: 110px;
  height: 110px;
  fill: none;
  stroke: rgba(255,255,255,.9);
  stroke-width: 3.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.page-automatisierung .cnc-tag{
  position: absolute;
  top: 18px;
  left: 18px;
  background: rgba(255,255,255,.16);
  color: #fff;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 999px;
  padding: 6px 11px;
  font-size: 12px;
  font-weight: 500;
}

.page-automatisierung .cnc-card-body{
  padding: 28px 24px 30px;
}

.page-automatisierung .cnc-card-body h3{
  font-size: 22px;
  color: #1d1d1f;
  margin-bottom: 12px;
}

.page-automatisierung .cnc-card-body p{
  color: #6e6e73;
  font-size: 14px;
  line-height: 1.7;
  margin-bottom: 22px;
}

.page-automatisierung .cnc-specs{
  display: grid;
  gap: 8px;
  margin-bottom: 24px;
}

.page-automatisierung .cnc-spec{
  display: flex;
  justify-content: space-between;
  gap: 14px;
  padding-top: 8px;
  border-top: 1px solid rgba(0,0,0,.06);
  font-size: 12.5px;
}

.page-automatisierung .cnc-spec-k{
  color: #6e6e73;
}

.page-automatisierung .cnc-spec-v{
  color: #1d1d1f;
  font-weight: 500;
  text-align: right;
}

.page-automatisierung .card-link{
  color: #14a0dc;
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
}

/* Anlagen */

.page-automatisierung .anlagen-sec{
  background: #fff;
  padding: 90px 48px;
}

.page-automatisierung .anlagen-inner{
  max-width: 1100px;
  margin: 0 auto;
}

.page-automatisierung .anlagen-item{
  display: grid;
  grid-template-columns: 1.08fr .92fr;
  gap: 64px;
  align-items: center;
  padding: 74px 0;
  border-top: 1px solid rgba(0,0,0,.07);
}

.page-automatisierung .anlagen-item.reverse > div:first-child{
  order: 2;
}

.page-automatisierung .anlagen-item.reverse > div:last-child{
  order: 1;
}

.page-automatisierung .anlagen-tag{
  font-size: 13px;
  color: #14a0dc;
  font-weight: 600;
  margin-bottom: 14px;
}

.page-automatisierung .anlagen-title{
  font-size: clamp(34px, 5vw, 56px);
  line-height: 1.05;
  letter-spacing: -2px;
  font-weight: 300;
  color: #1d1d1f;
  margin-bottom: 22px;
}

.page-automatisierung .anlagen-title strong{
  color: #14a0dc;
  font-weight: 600;
}

.page-automatisierung .anlagen-desc{
  color: #6e6e73;
  font-size: 16px;
  line-height: 1.75;
  margin-bottom: 24px;
}

.page-automatisierung .anlagen-pills{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 28px;
}

.page-automatisierung .anlagen-pill{
  background: #f5f5f7;
  border: 1px solid rgba(0,0,0,.07);
  border-radius: 999px;
  padding: 7px 12px;
  color: #3c3c3c;
  font-size: 12px;
}

.page-automatisierung .anlagen-visual{
  min-height: 350px;
  border-radius: 32px;
  background: linear-gradient(135deg, #0d7aad, #14a0dc);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 30px 80px rgba(20,160,220,.22);
  position: relative;
  overflow: hidden;
}

.page-automatisierung .anlagen-visual svg{
  width: 190px;
  height: 150px;
  fill: none;
  stroke: rgba(255,255,255,.9);
  stroke-width: 4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.page-automatisierung .anlagen-visual-label{
  position: absolute;
  bottom: 26px;
  left: 28px;
  color: rgba(255,255,255,.85);
  font-size: 13px;
  font-weight: 500;
}

/* Robotik */

.page-automatisierung .robotik-sec{
  background: #f5f5f7;
  padding: 90px 48px;
}

.page-automatisierung .robotik-inner{
  max-width: 1100px;
  margin: 0 auto;
}

.page-automatisierung .robotik-grid{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

.page-automatisierung .robotik-card{
  background: #fff;
  border: 1px solid rgba(0,0,0,.07);
  border-radius: 28px;
  padding: 34px 30px;
  box-shadow: 0 18px 50px rgba(0,0,0,.05);
}

.page-automatisierung .robotik-card-icon{
  width: 52px;
  height: 52px;
  border-radius: 16px;
  background: rgba(20,160,220,.1);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 24px;
}

.page-automatisierung .robotik-card-icon svg{
  width: 26px;
  height: 26px;
  fill: none;
  stroke: #14a0dc;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.page-automatisierung .robotik-card h3{
  font-size: 24px;
  color: #1d1d1f;
  margin-bottom: 12px;
}

.page-automatisierung .robotik-card p{
  color: #6e6e73;
  font-size: 14px;
  line-height: 1.7;
  margin-bottom: 22px;
}

.page-automatisierung .robotik-tags{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.page-automatisierung .robotik-tag{
  background: #f5f5f7;
  border: 1px solid rgba(0,0,0,.07);
  border-radius: 999px;
  padding: 7px 11px;
  color: #3c3c3c;
  font-size: 12px;
}

.page-automatisierung .robotik-banner{
  margin-top: 34px;
  background: linear-gradient(135deg, #111827, #1d1d1f);
  color: #fff;
  border-radius: 32px;
  padding: 42px 46px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}

.page-automatisierung .robotik-banner h3{
  font-size: clamp(28px, 4vw, 42px);
  line-height: 1.08;
  font-weight: 300;
  margin-bottom: 12px;
}

.page-automatisierung .robotik-banner h3 strong{
  color: #14a0dc;
  font-weight: 600;
}

.page-automatisierung .robotik-banner p{
  color: rgba(255,255,255,.68);
}

.page-automatisierung .btn-primary-outline{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  border: 1px solid rgba(20,160,220,.7);
  background: rgba(20,160,220,.18);
  text-decoration: none;
  border-radius: 999px;
  padding: 13px 24px;
  font-size: 14px;
  font-weight: 500;
  white-space: nowrap;
}

/* Prozess Timeline */

.page-automatisierung .prozess-timeline{
  display: grid;
  gap: 18px;
  max-width: 850px;
}

.page-automatisierung .prozess-step{
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 20px;
  align-items: flex-start;
  background: #f5f5f7;
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 24px;
  padding: 24px;
}

.page-automatisierung .prozess-num{
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #14a0dc;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
}

.page-automatisierung .prozess-content h4{
  font-size: 17px;
  color: #1d1d1f;
  margin-bottom: 8px;
}

.page-automatisierung .prozess-content p{
  color: #6e6e73;
  font-size: 14px;
  line-height: 1.65;
}

/* Schluss CTA */

.page-automatisierung .cta-sec{
  background: linear-gradient(135deg, #0d7aad, #14a0dc);
  color: #fff;
  text-align: center;
  padding: 90px 48px;
}

.page-automatisierung .cta-sec h2{
  font-size: clamp(36px, 6vw, 68px);
  line-height: 1.02;
  letter-spacing: -2.5px;
  font-weight: 300;
  margin-bottom: 18px;
}

.page-automatisierung .cta-sec h2 strong{
  font-weight: 600;
}

.page-automatisierung .cta-sec p{
  color: rgba(255,255,255,.78);
  font-size: 17px;
  margin-bottom: 30px;
}

/* Responsive Automatisierung */

@media (max-width: 900px) {
  .page-automatisierung .hero{
    padding: 74px 24px 84px;
    min-height: auto;
  }

  .page-automatisierung .hero h1{
    font-size: 54px;
    letter-spacing: -2px;
  }

  .page-automatisierung .hero-stats{
    grid-template-columns: 1fr;
    max-width: 100% !important;
  }

  .page-automatisierung .intro-sec,
.page-automatisierung .cnc-sec,
.page-automatisierung .anlagen-sec,
.page-automatisierung .robotik-sec,
.page-automatisierung .prozess-sec,
.page-automatisierung .cta-sec{
    padding: 64px 24px;
  }

  .page-automatisierung .intro-inner,
.page-automatisierung .anlagen-item{
    grid-template-columns: 1fr;
    gap: 36px;
  }

  .page-automatisierung .anlagen-item.reverse > div:first-child,
.page-automatisierung .anlagen-item.reverse > div:last-child{
    order: initial;
  }

  .page-automatisierung .cnc-grid,
.page-automatisierung .robotik-grid{
    grid-template-columns: 1fr;
  }

  .page-automatisierung .robotik-banner{
    flex-direction: column;
    align-items: flex-start;
    padding: 34px 28px;
  }

  .page-automatisierung .anlagen-visual{
    min-height: 280px;
  }
}

@media (max-width: 600px) {
  .page-automatisierung .hero h1{
    font-size: 42px;
    letter-spacing: -1.2px;
  }

  .page-automatisierung .hero-sub{
    font-size: 16px;
  }

  .page-automatisierung .intro-vis-stat{
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }

  .page-automatisierung .anlagen-title,
.page-automatisierung .sec-title{
    font-size: 36px;
    letter-spacing: -1.2px;
  }

  .page-automatisierung .prozess-step{
    grid-template-columns: 1fr;
  }
}

/* =========================================================
   ZUBEHÖR-SEITE FIX
   passend zu page-zubehoer.php
========================================================= */

/* Hero Visual Grid */

.page-zubehoer .page-hero-visual-grid{
  width: 100%;
  padding: 26px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}

.page-zubehoer .pv-item{
  background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 18px;
  padding: 18px 14px;
  min-height: 104px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  text-align: center;
}

.page-zubehoer .pv-item svg{
  width: 30px;
  height: 30px;
  fill: none;
  stroke: #fff;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.page-zubehoer .pv-item span{
  color: rgba(255,255,255,.9);
  font-size: 11px;
  line-height: 1.3;
}

/* Filter Navigation */

.page-zubehoer .filter-nav{
  position: sticky;
  top: 58px;
  z-index: 150;
  background: rgba(255,255,255,.94);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(0,0,0,.07);
}

.page-zubehoer .filter-nav-inner{
  max-width: 1100px;
  margin: 0 auto;
  padding: 10px 48px;
  display: flex;
  align-items: center;
  gap: 8px;
  overflow-x: auto;
}

.page-zubehoer .filter-item{
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  text-decoration: none;
  color: #6e6e73;
  font-size: 13px;
  padding: 8px 14px;
  border-radius: 999px;
  transition: background .2s, color .2s;
}

.page-zubehoer .filter-item:hover,
.page-zubehoer .filter-item.active{
  background: rgba(20,160,220,.08);
  color: #14a0dc;
}

/* Zubehör Hauptbereich */

.page-zubehoer .zubehoer-sec{
  background: #fff;
  padding: 86px 48px;
}

.page-zubehoer .zubehoer-inner{
  max-width: 1100px;
  margin: 0 auto;
}

.page-zubehoer .zubehoer-item{
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  align-items: center;
  gap: 64px;
  padding: 86px 0;
  border-bottom: 1px solid rgba(0,0,0,.07);
}

.page-zubehoer .zubehoer-item:first-child{
  padding-top: 0;
}

.page-zubehoer .zubehoer-item:last-child{
  border-bottom: none;
}

.page-zubehoer .zubehoer-item.reverse{
  grid-template-columns: .9fr 1.1fr;
}

.page-zubehoer .zubehoer-item.reverse > div:first-child{
  order: 2;
}

.page-zubehoer .zubehoer-item.reverse > div:last-child{
  order: 1;
}

.page-zubehoer .item-label{
  font-size: 13px;
  color: #14a0dc;
  font-weight: 600;
  margin-bottom: 14px;
  letter-spacing: .3px;
}

.page-zubehoer .item-title{
  font-size: clamp(36px, 5vw, 58px);
  line-height: 1.05;
  letter-spacing: -2px;
  font-weight: 300;
  color: #1d1d1f;
  margin-bottom: 22px;
}

.page-zubehoer .item-title strong{
  color: #14a0dc;
  font-weight: 600;
}

.page-zubehoer .item-desc{
  font-size: 16px;
  line-height: 1.75;
  color: #6e6e73;
  font-weight: 300;
  margin-bottom: 26px;
  max-width: 650px;
}

.page-zubehoer .compat-label{
  font-size: 13px;
  color: #1d1d1f;
  font-weight: 600;
  margin-bottom: 10px;
}

.page-zubehoer .compat-pills{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 28px;
}

.page-zubehoer .compat-pill{
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 7px 12px;
  font-size: 12px;
  border: 1px solid rgba(0,0,0,.08);
  background: #f5f5f7;
  color: #3c3c3c;
}

.page-zubehoer .compat-pill.yes{
  background: rgba(20,160,220,.08);
  border-color: rgba(20,160,220,.18);
  color: #0d7aad;
}

.page-zubehoer .compat-pill.cond{
  background: rgba(255,180,0,.12);
  border-color: rgba(255,180,0,.25);
  color: #8a5a00;
}

.page-zubehoer .item-actions{
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

/* Zubehör Visuals */

.page-zubehoer .item-visual{
  min-height: 360px;
  border-radius: 34px;
  background: linear-gradient(135deg, #0d7aad, #14a0dc);
  box-shadow: 0 30px 80px rgba(20,160,220,.24);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
}

.page-zubehoer .item-visual svg{
  width: 170px;
  height: 170px;
  max-width: 58%;
  max-height: 58%;
  fill: none;
  stroke: rgba(255,255,255,.9);
  stroke-width: 4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.page-zubehoer .item-num{
  position: absolute;
  top: 24px;
  right: 28px;
  color: rgba(255,255,255,.28);
  font-size: 60px;
  line-height: 1;
  font-weight: 600;
}

/* CTA innerhalb Zubehör */

.page-zubehoer .zubehoer-sec .cta-banner{
  margin-top: 72px;
}

/* Responsive Zubehör */

@media (max-width: 900px) {
  .page-zubehoer .filter-nav-inner{
    padding: 10px 24px;
  }

  .page-zubehoer .zubehoer-sec{
    padding: 64px 24px;
  }

  .page-zubehoer .zubehoer-item,
.page-zubehoer .zubehoer-item.reverse{
    grid-template-columns: 1fr;
    gap: 36px;
    padding: 64px 0;
  }

  .page-zubehoer .zubehoer-item.reverse > div:first-child,
.page-zubehoer .zubehoer-item.reverse > div:last-child{
    order: initial;
  }

  .page-zubehoer .item-visual{
    min-height: 280px;
  }

  .page-zubehoer .page-hero-visual-grid{
    grid-template-columns: repeat(2, 1fr);
    padding: 22px;
  }
}

@media (max-width: 600px) {
  .page-zubehoer .item-title{
    font-size: 36px;
    letter-spacing: -1.2px;
  }

  .page-zubehoer .item-desc{
    font-size: 15px;
  }

  .page-zubehoer .item-visual{
    min-height: 230px;
    border-radius: 24px;
  }

  .page-zubehoer .page-hero-visual-grid{
    grid-template-columns: 1fr;
  }

  .page-zubehoer .pv-item{
    min-height: 82px;
  }
}

/* =========================================================
   SERVICE-SEITE FIX
   passend zu page-service.php
========================================================= */

/* Hero Service Cards */

.page-service .page-hero-visual-inner{
  width: 100%;
  padding: 26px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}

.page-service .pv-card{
  background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 18px;
  padding: 18px 14px;
  min-height: 122px;
}

.page-service .pv-card-icon{
  width: 38px;
  height: 38px;
  border-radius: 12px;
  background: rgba(255,255,255,.16);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 14px;
}

.page-service .pv-card-icon svg{
  width: 20px;
  height: 20px;
  fill: none;
  stroke: #fff;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.page-service .pv-card h4{
  color: #fff;
  font-size: 14px;
  margin-bottom: 5px;
}

.page-service .pv-card p{
  color: rgba(255,255,255,.72);
  font-size: 12px;
  line-height: 1.35;
}

/* Reaktionsbanner */

.page-service .reaktion-banner{
  background: #fff;
  padding: 64px 48px 24px;
}

.page-service .reaktion-inner{
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}

.page-service .reaktion-stat{
  background: #f5f5f7;
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 24px;
  padding: 30px 26px;
  min-height: 160px;
}

.page-service .reaktion-stat-n{
  font-size: 44px;
  line-height: 1;
  color: #14a0dc;
  font-weight: 600;
  margin-bottom: 14px;
}

.page-service .reaktion-stat-l{
  color: #6e6e73;
  font-size: 14px;
  line-height: 1.55;
}

/* Service Items */

.page-service .service-sec{
  background: #fff;
  padding: 86px 48px;
}

.page-service .service-inner{
  max-width: 1100px;
  margin: 0 auto;
}

.page-service .service-item{
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  align-items: center;
  gap: 64px;
  padding: 86px 0;
  border-bottom: 1px solid rgba(0,0,0,.07);
}

.page-service .service-item:first-child{
  padding-top: 0;
}

.page-service .service-item:last-child{
  border-bottom: none;
}

.page-service .service-item.reverse{
  grid-template-columns: .9fr 1.1fr;
}

.page-service .service-item.reverse > div:first-child{
  order: 2;
}

.page-service .service-item.reverse > div:last-child{
  order: 1;
}

.page-service .service-num{
  font-size: 13px;
  color: #14a0dc;
  font-weight: 600;
  margin-bottom: 14px;
  letter-spacing: .3px;
}

.page-service .service-title{
  font-size: clamp(36px, 5vw, 58px);
  line-height: 1.05;
  letter-spacing: -2px;
  font-weight: 300;
  color: #1d1d1f;
  margin-bottom: 22px;
}

.page-service .service-title strong{
  color: #14a0dc;
  font-weight: 600;
}

.page-service .service-desc{
  font-size: 16px;
  line-height: 1.75;
  color: #6e6e73;
  font-weight: 300;
  margin-bottom: 26px;
  max-width: 650px;
}

.page-service .service-details{
  display: grid;
  gap: 10px;
  margin: 24px 0 28px;
}

.page-service .service-detail{
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 14px;
  color: #3c3c3c;
  line-height: 1.5;
}

.page-service .service-detail-dot{
  width: 7px;
  height: 7px;
  background: #14a0dc;
  border-radius: 50%;
  flex-shrink: 0;
  margin-top: 7px;
}

/* Service Visuals */

.page-service .service-visual{
  min-height: 360px;
  border-radius: 34px;
  background: linear-gradient(135deg, #0d7aad, #14a0dc);
  box-shadow: 0 30px 80px rgba(20,160,220,.24);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
}

.page-service .service-visual svg{
  width: 170px;
  height: 150px;
  max-width: 58%;
  max-height: 58%;
  fill: none;
  stroke: rgba(255,255,255,.9);
  stroke-width: 4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.page-service .service-visual-badge{
  position: absolute;
  left: 28px;
  bottom: 28px;
  color: rgba(255,255,255,.86);
  font-size: 13px;
  font-weight: 500;
}

.page-service .service-visual-label{
  position: absolute;
  top: 24px;
  right: 28px;
  color: rgba(255,255,255,.28);
  font-size: 60px;
  line-height: 1;
  font-weight: 600;
}

/* Leasing */

.page-service .leasing-sec{
  background: linear-gradient(135deg, #0d7aad, #14a0dc);
  color: #fff;
  padding: 90px 48px;
}

.page-service .leasing-inner{
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 64px;
  align-items: center;
}

.page-service .leasing-label{
  font-size: 13px;
  color: rgba(255,255,255,.72);
  font-weight: 600;
  margin-bottom: 14px;
}

.page-service .leasing-title{
  font-size: clamp(36px, 5vw, 58px);
  line-height: 1.05;
  letter-spacing: -2px;
  font-weight: 300;
  margin-bottom: 22px;
}

.page-service .leasing-title strong{
  font-weight: 600;
}

.page-service .leasing-desc{
  font-size: 16px;
  line-height: 1.75;
  color: rgba(255,255,255,.78);
  font-weight: 300;
  margin-bottom: 28px;
}

.page-service .leasing-checks{
  display: grid;
  gap: 10px;
  margin-bottom: 30px;
}

.page-service .leasing-check{
  display: flex;
  gap: 10px;
  align-items: flex-start;
  color: rgba(255,255,255,.9);
  font-size: 14px;
  line-height: 1.5;
}

.page-service .leasing-check-dot{
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #fff;
  flex-shrink: 0;
  margin-top: 7px;
}

.page-service .leasing-visual{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}

.page-service .leasing-vis-card{
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 22px;
  padding: 26px 22px;
  min-height: 130px;
}

.page-service .leasing-vis-n{
  font-size: 34px;
  line-height: 1;
  font-weight: 600;
  margin-bottom: 12px;
}

.page-service .leasing-vis-l{
  color: rgba(255,255,255,.74);
  font-size: 13px;
  line-height: 1.5;
}

/* Kontakt direkt */

.page-service .kontakt-direkt{
  background: #f5f5f7;
  padding: 90px 48px;
}

.page-service .kontakt-inner{
  max-width: 1100px;
  margin: 0 auto;
}

.page-service .kontakt-head{
  text-align: center;
  max-width: 720px;
  margin: 0 auto 46px;
}

.page-service .kontakt-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.page-service .kontakt-card{
  background: #fff;
  border: 1px solid rgba(0,0,0,.07);
  border-radius: 28px;
  padding: 34px 30px;
  box-shadow: 0 18px 50px rgba(0,0,0,.05);
}

.page-service .kontakt-card-icon{
  width: 52px;
  height: 52px;
  border-radius: 16px;
  background: rgba(20,160,220,.1);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 24px;
}

.page-service .kontakt-card-icon svg{
  width: 26px;
  height: 26px;
  fill: none;
  stroke: #14a0dc;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.page-service .kontakt-card h3{
  font-size: 24px;
  color: #1d1d1f;
  margin-bottom: 12px;
}

.page-service .kontakt-card p{
  color: #6e6e73;
  font-size: 14px;
  line-height: 1.7;
  margin-bottom: 22px;
}

.page-service .kontakt-card-link{
  color: #14a0dc;
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
}

/* Responsive Service */

@media (max-width: 900px) {
  .page-service .page-hero-visual-inner{
    grid-template-columns: repeat(2, 1fr);
  }

  .page-service .reaktion-banner{
    padding: 48px 24px 12px;
  }

  .page-service .reaktion-inner{
    grid-template-columns: 1fr;
  }

  .page-service .service-sec,
.page-service .leasing-sec,
.page-service .kontakt-direkt{
    padding: 64px 24px;
  }

  .page-service .service-item,
.page-service .service-item.reverse,
.page-service .leasing-inner{
    grid-template-columns: 1fr;
    gap: 36px;
  }

  .page-service .service-item.reverse > div:first-child,
.page-service .service-item.reverse > div:last-child{
    order: initial;
  }

  .page-service .service-visual{
    min-height: 280px;
  }

  .page-service .kontakt-grid{
    grid-template-columns: 1fr;
  }
}

@media (max-width: 600px) {
  .page-service .page-hero-visual-inner,
.page-service .leasing-visual{
    grid-template-columns: 1fr;
  }

  .page-service .service-title,
.page-service .leasing-title{
    font-size: 36px;
    letter-spacing: -1.2px;
  }

  .page-service .service-desc,
.page-service .leasing-desc{
    font-size: 15px;
  }

  .page-service .service-visual{
    min-height: 230px;
    border-radius: 24px;
  }

  .page-service .reaktion-stat-n{
    font-size: 36px;
  }
}

/* =========================================================
   KONTAKT-SEITE FIX
   passend zu page-kontakt.php
========================================================= */

/* Kontakt Hero Sonderfall */

.page-kontakt .page-hero .hero-inner{
  max-width: 1100px;
  margin: 0 auto;
}

/* Hauptbereich Formular + Sidebar */

.page-kontakt .main-sec{
  background: #fff;
  padding: 86px 48px;
}

.page-kontakt .main-inner{
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 40px;
  align-items: start;
}

.page-kontakt .form-card,
.page-kontakt .info-card,
.page-kontakt .anfahrt-card{
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 28px;
  box-shadow: 0 18px 50px rgba(0,0,0,.05);
}

.page-kontakt .form-card{
  padding: 38px 34px;
}

.page-kontakt .form-title{
  font-size: 30px;
  line-height: 1.1;
  letter-spacing: -1px;
  color: #1d1d1f;
  margin-bottom: 10px;
  font-weight: 500;
}

.page-kontakt .form-sub{
  color: #6e6e73;
  font-size: 14px;
  line-height: 1.6;
  margin-bottom: 28px;
}

.page-kontakt .form-row{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 18px;
  margin-bottom: 18px;
}

.page-kontakt .form-group{
  margin-bottom: 18px;
}

.page-kontakt .form-card label{
  display: block;
  font-size: 13px;
  color: #3c3c3c;
  font-weight: 500;
  margin-bottom: 8px;
}

.page-kontakt .form-card input,
.page-kontakt .form-card select,
.page-kontakt .form-card textarea{
  width: 100%;
  border: 1px solid rgba(0,0,0,.12);
  background: #f5f5f7;
  border-radius: 14px;
  padding: 13px 14px;
  font-family: inherit;
  font-size: 14px;
  color: #1d1d1f;
  outline: none;
  transition: border-color .2s, background .2s, box-shadow .2s;
}

.page-kontakt .form-card input:focus,
.page-kontakt .form-card select:focus,
.page-kontakt .form-card textarea:focus{
  border-color: rgba(20,160,220,.55);
  background: #fff;
  box-shadow: 0 0 0 4px rgba(20,160,220,.08);
}

.page-kontakt .form-card textarea{
  min-height: 150px;
  resize: vertical;
}

.page-kontakt .form-checkbox{
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 22px 0;
}

.page-kontakt .form-checkbox input{
  width: auto;
  margin-top: 3px;
}

.page-kontakt .form-checkbox label{
  font-size: 12.5px;
  line-height: 1.55;
  color: #6e6e73;
  margin: 0;
}

.page-kontakt .form-checkbox a{
  color: #14a0dc;
  text-decoration: none;
}

.page-kontakt .btn-submit{
  width: 100%;
  border: none;
  background: #14a0dc;
  color: #fff;
  border-radius: 999px;
  padding: 15px 24px;
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: opacity .2s, transform .2s;
}

.page-kontakt .btn-submit:hover{
  opacity: .9;
  transform: translateY(-1px);
}

.page-kontakt .form-success{
  display: none;
  margin-top: 18px;
  background: rgba(20,160,220,.08);
  border: 1px solid rgba(20,160,220,.16);
  color: #0d7aad;
  border-radius: 16px;
  padding: 14px 16px;
  font-size: 14px;
}

/* Sidebar */

.page-kontakt .sidebar{
  display: grid;
  gap: 24px;
  position: sticky;
  top: 90px;
}

.page-kontakt .info-card,
.page-kontakt .anfahrt-card{
  overflow: hidden;
}

.page-kontakt .info-card{
  padding: 30px 28px;
}

.page-kontakt .info-card-title{
  font-size: 22px;
  font-weight: 600;
  color: #1d1d1f;
  margin-bottom: 24px;
}

.page-kontakt .info-row{
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding: 18px 0;
  border-top: 1px solid rgba(0,0,0,.06);
}

.page-kontakt .info-icon{
  width: 38px;
  height: 38px;
  border-radius: 13px;
  background: rgba(20,160,220,.1);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.page-kontakt .info-icon svg{
  width: 20px;
  height: 20px;
  fill: none;
  stroke: #14a0dc;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.page-kontakt .info-label{
  font-size: 12px;
  color: #6e6e73;
  margin-bottom: 4px;
}

.page-kontakt .info-value{
  font-size: 14px;
  color: #1d1d1f;
  line-height: 1.55;
}

.page-kontakt .info-value a{
  color: #14a0dc;
  text-decoration: none;
}

/* Karte */

.page-kontakt .map-placeholder{
  height: 240px;
  background:
    linear-gradient(90deg, rgba(255,255,255,.35) 1px, transparent 1px),
    linear-gradient(rgba(255,255,255,.35) 1px, transparent 1px),
    linear-gradient(135deg, #0d7aad, #14a0dc);
  background-size: 32px 32px, 32px 32px, auto;
  position: relative;
}

.page-kontakt .map-pin{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}

.page-kontakt .map-pin-dot{
  width: 22px;
  height: 22px;
  background: #fff;
  border: 6px solid #14a0dc;
  border-radius: 50%;
  margin: 0 auto 10px;
  box-shadow: 0 12px 30px rgba(0,0,0,.22);
}

.page-kontakt .map-pin-label{
  background: #fff;
  color: #1d1d1f;
  border-radius: 999px;
  padding: 7px 12px;
  font-size: 12px;
  font-weight: 500;
  white-space: nowrap;
}

.page-kontakt .anfahrt-body{
  padding: 24px 26px 28px;
}

.page-kontakt .anfahrt-address{
  color: #3c3c3c;
  font-size: 14px;
  line-height: 1.6;
  margin-bottom: 18px;
}

.page-kontakt .btn-maps,
.page-kontakt .btn-download{
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #14a0dc;
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
}

/* Anfrageformulare */

.page-kontakt .formulare-sec{
  background: #f5f5f7;
  padding: 86px 48px;
}

.page-kontakt .formulare-inner{
  max-width: 1100px;
  margin: 0 auto;
}

.page-kontakt .formulare-head{
  text-align: center;
  max-width: 720px;
  margin: 0 auto 46px;
}

.page-kontakt .formulare-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.page-kontakt .formular-card{
  background: #fff;
  border: 1px solid rgba(0,0,0,.07);
  border-radius: 28px;
  padding: 34px 30px;
  box-shadow: 0 18px 50px rgba(0,0,0,.05);
}

.page-kontakt .formular-icon{
  width: 52px;
  height: 52px;
  border-radius: 16px;
  background: rgba(20,160,220,.1);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 24px;
}

.page-kontakt .formular-icon svg{
  width: 26px;
  height: 26px;
  fill: none;
  stroke: #14a0dc;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.page-kontakt .formular-card h3{
  font-size: 22px;
  color: #1d1d1f;
  margin-bottom: 12px;
}

.page-kontakt .formular-card p{
  color: #6e6e73;
  font-size: 14px;
  line-height: 1.7;
  margin-bottom: 22px;
}

/* Vertriebspartner */

.page-kontakt .partner-sec{
  background: #fff;
  padding: 86px 48px;
}

.page-kontakt .partner-inner{
  max-width: 1100px;
  margin: 0 auto;
}

.page-kontakt .partner-head{
  text-align: center;
  max-width: 720px;
  margin: 0 auto 46px;
}

.page-kontakt .partner-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.page-kontakt .partner-card{
  background: #f5f5f7;
  border: 1px solid rgba(0,0,0,.07);
  border-radius: 28px;
  padding: 34px 30px;
}

.page-kontakt .partner-flag{
  font-size: 38px;
  margin-bottom: 18px;
}

.page-kontakt .partner-country{
  font-size: 13px;
  color: #14a0dc;
  font-weight: 600;
  margin-bottom: 10px;
}

.page-kontakt .partner-name{
  font-size: 20px;
  color: #1d1d1f;
  font-weight: 600;
  margin-bottom: 12px;
}

.page-kontakt .partner-addr{
  color: #6e6e73;
  font-size: 14px;
  line-height: 1.65;
  margin-bottom: 22px;
}

.page-kontakt .partner-link{
  color: #14a0dc;
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
}

/* Responsive Kontakt */

@media (max-width: 900px) {
  .page-kontakt .main-sec,
.page-kontakt .formulare-sec,
.page-kontakt .partner-sec{
    padding: 64px 24px;
  }

  .page-kontakt .main-inner{
    grid-template-columns: 1fr;
  }

  .page-kontakt .sidebar{
    position: static;
  }

  .page-kontakt .formulare-grid,
.page-kontakt .partner-grid{
    grid-template-columns: 1fr;
  }
}

@media (max-width: 600px) {
  .page-kontakt .form-card{
    padding: 28px 22px;
  }

  .page-kontakt .form-row{
    grid-template-columns: 1fr;
  }

  .page-kontakt .form-title{
    font-size: 26px;
  }

  .page-kontakt .map-placeholder{
    height: 200px;
  }
}

/* =========================================================
   RECHTLICHE SEITEN FIX
   passend zu page-impressum.php / Datenschutz / AGB
========================================================= */

/* Legal Hero */

.page-legal .hero{
  background: #f5f5f7;
  color: #1d1d1f;
  padding: 72px 48px 80px;
  min-height: auto;
  overflow: hidden;
}

.page-legal .hero > *{
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
}

.page-legal .hero .breadcrumb{
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: #b0b0b8;
  margin-bottom: 28px;
}

.page-legal .hero .breadcrumb a{
  color: #b0b0b8;
  text-decoration: none;
}

.page-legal .hero .breadcrumb a:hover{
  color: #14a0dc;
}

.page-legal .hero-inner{
  max-width: 1000px;
  margin: 0 auto;
}

.page-legal .hero-label{
  font-size: 13px;
  color: #14a0dc;
  font-weight: 600;
  margin-bottom: 14px;
}

.page-legal .hero h1{
  font-size: clamp(42px, 6vw, 72px);
  line-height: .98;
  letter-spacing: -3px;
  font-weight: 300;
  color: #1d1d1f;
  margin-bottom: 20px;
}

.page-legal .hero h1 strong{
  color: #14a0dc;
  font-weight: 600;
}

.page-legal .hero-sub{
  font-size: 18px;
  color: #6e6e73;
  line-height: 1.7;
  font-weight: 300;
  max-width: 680px;
}

/* Legal Content */

.page-legal .content{
  max-width: 900px;
  margin: 0 auto;
  padding: 72px 48px 90px;
  color: #3c3c3c;
  font-size: 16px;
  line-height: 1.75;
}

.page-legal .content h2{
  font-size: clamp(24px, 3vw, 34px);
  line-height: 1.2;
  letter-spacing: -1px;
  font-weight: 500;
  color: #1d1d1f;
  margin: 46px 0 16px;
}

.page-legal .content h2:first-of-type{
  margin-top: 0;
}

.page-legal .content p{
  margin-bottom: 20px;
  color: #3c3c3c;
  font-weight: 300;
}

.page-legal .content strong{
  color: #1d1d1f;
  font-weight: 600;
}

.page-legal .content a{
  color: #14a0dc;
  text-decoration: none;
}

.page-legal .content a:hover{
  text-decoration: underline;
}

.page-legal .divider{
  height: 1px;
  background: rgba(0,0,0,.08);
  margin: 44px 0;
}

/* Legal Navigation */

.page-legal .legal-nav{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 0 34px;
}

.page-legal .legal-nav:last-child{
  margin: 34px 0 0;
}

.page-legal .legal-nav a{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: #6e6e73;
  background: #f5f5f7;
  border: 1px solid rgba(0,0,0,.07);
  border-radius: 999px;
  padding: 9px 16px;
  font-size: 13px;
  font-weight: 500;
  transition: background .2s, color .2s, border-color .2s;
}

.page-legal .legal-nav a:hover,
.page-legal .legal-nav a.current{
  color: #14a0dc;
  background: rgba(20,160,220,.08);
  border-color: rgba(20,160,220,.18);
  text-decoration: none;
}

/* Responsive Legal */

@media (max-width: 900px) {
  .page-legal .hero{
    padding: 56px 24px 64px;
  }

  .page-legal .content{
    padding: 56px 24px 72px;
  }
}

@media (max-width: 600px) {
  .page-legal .hero h1{
    font-size: 42px;
    letter-spacing: -1.5px;
  }

  .page-legal .hero-sub{
    font-size: 16px;
  }

  .page-legal .content{
    font-size: 15px;
  }

  .page-legal .legal-nav{
    flex-direction: column;
  }

  .page-legal .legal-nav a{
    width: 100%;
  }
}

/* =========================================================
   DATENSCHUTZ-SEITE ERGÄNZUNG
   passend zu page-datenschutz.php
========================================================= */

.page-legal .highlight-box{
  background: rgba(20,160,220,.08);
  border: 1px solid rgba(20,160,220,.18);
  border-left: 4px solid #14a0dc;
  border-radius: 0 18px 18px 0;
  padding: 24px 28px;
  margin: 0 0 42px;
}

.page-legal .highlight-box p{
  margin: 0;
  color: #1d1d1f;
  font-weight: 400;
  line-height: 1.7;
}

.page-legal .content ul{
  list-style: none;
  padding: 0;
  margin: 16px 0 26px;
  display: grid;
  gap: 10px;
}

.page-legal .content ul li{
  position: relative;
  padding-left: 24px;
  color: #3c3c3c;
  font-weight: 300;
  line-height: 1.65;
}

.page-legal .content ul li::before{
  content: "";
  position: absolute;
  left: 0;
  top: 11px;
  width: 7px;
  height: 7px;
  background: #14a0dc;
  border-radius: 50%;
}

.page-legal .content ol{
  padding-left: 22px;
  margin: 16px 0 26px;
}

.page-legal .content ol li{
  margin-bottom: 10px;
  color: #3c3c3c;
  font-weight: 300;
  line-height: 1.65;
}

@media (max-width: 600px) {
  .page-legal .highlight-box{
    padding: 20px 22px;
    border-radius: 0 14px 14px 0;
  }
}

/* =========================================================
   AGB-SEITE ERGÄNZUNG
========================================================= */

.page-legal .content h2{
  scroll-margin-top: 90px;
}

.page-legal .content p[style]{
  font-size: 13px !important;
  color: #b0b0b8 !important;
  font-weight: 300 !important;
}

.page-legal .content .highlight-box strong{
  color: #1d1d1f;
}

@media (max-width: 600px) {
  .page-legal .content h2{
    font-size: 24px;
  }
}

/* =========================================================
   GLOBAL: ACTIVE NAV + SCROLL TO TOP
========================================================= */
.model-nav-item.active,
.section-nav-item.active,
.filter-item.active {
  background: rgba(20,160,220,.12);
  color: #14a0dc;
  font-weight: 600;
}
.model-block,
.leis-item,
.zubehoer-item,
.service-item,
.anlagen-item,
.cnc-sec,
.anlagen-sec,
.robotik-sec,
.prozess-sec,
.compare-sec { scroll-margin-top: 120px; }
.scroll-top-btn {
  position: fixed; right: 24px; bottom: 24px; width: 46px; height: 46px;
  border-radius: 50%; border: none; background: #14a0dc; color: #fff;
  font-size: 24px; line-height: 1; display: flex; align-items: center; justify-content: center;
  cursor: pointer; z-index: 500; box-shadow: 0 12px 34px rgba(20,160,220,.32);
  opacity: 0; pointer-events: none; transform: translateY(12px);
  transition: opacity .2s, transform .2s, background .2s;
}
.scroll-top-btn.show { opacity: 1; pointer-events: auto; transform: translateY(0); }
.scroll-top-btn:hover { background: #0d7aad; }
@media (max-width: 600px) {.scroll-top-btn { right: 18px; bottom: 18px; width: 42px; height: 42px; font-size: 22px; }}

/* =========================================================
   GLOBAL: STICKY ANCHOR NAVS
========================================================= */
.section-nav,
.filter-nav {
  position: sticky;
  top: 58px;
  z-index: 150;
  background: rgba(255,255,255,.94);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(0,0,0,.07);
}
.section-nav-inner,
.filter-nav-inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 10px 48px;
  display: flex;
  align-items: center;
  gap: 8px;
  overflow-x: auto;
}
.section-nav-item,
.filter-item {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  text-decoration: none;
  color: #6e6e73;
  font-size: 13px;
  padding: 8px 14px;
  border-radius: 999px;
  transition: background .2s, color .2s;
}
.section-nav-item:hover,
.section-nav-item.active,
.filter-item:hover,
.filter-item.active {
  background: rgba(20,160,220,.08);
  color: #14a0dc;
}
@media (max-width: 900px) {
  .section-nav-inner,
  .filter-nav-inner { padding: 10px 24px; }
}

/* =========================================================
   BLOG INDEX FIX
========================================================= */
.page-blog-index .blog-hero h1{font-size:clamp(36px,5vw,56px);font-weight:300;letter-spacing:-2px;color:#1d1d1f;margin-bottom:12px;line-height:1.1}
.page-blog-index .blog-hero h1 strong{font-weight:600;color:#14a0dc}
.page-blog-index .blog-hero-sub{font-size:17px;color:#6e6e73;font-weight:300;max-width:480px;line-height:1.65}
.blog-index-sec{padding:64px 48px 100px;background:#fff}
.blog-pagination{margin-top:48px;text-align:center}
.blog-empty{color:#6e6e73;font-weight:300}
.st-post-thumb-icon{width:64px;height:64px;fill:none;stroke:rgba(255,255,255,.78);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 8px 18px rgba(0,0,0,.12))}
.st-post-thumb{position:relative}
.st-post-thumb::after{content:'';position:absolute;inset:auto 0 0 0;height:22px;background:rgba(255,255,255,.16);pointer-events:none}
@media(max-width:700px){.blog-index-sec{padding:56px 24px 76px}.page-blog-index .blog-hero h1{letter-spacing:-1.2px}}

/* =========================================================
   FINAL FIXES
   Cursor + Blogübersicht
========================================================= */

/* Custom Cursor final erzwingen */
@media (hover:hover) and (pointer:fine) {
  html,
  body,
  body *,
  a,
  button,
  input,
  textarea,
  select,
  label,
  [role="button"] {
    cursor: none !important;
  }

  .cursor,
  .cursor-ring {
    pointer-events: none !important;
  }
}

@media (hover:none), (pointer:coarse) {
  html,
  body,
  body * {
    cursor: auto !important;
  }

  .cursor,
  .cursor-ring {
    display: none !important;
  }
}


/* =========================================================
   BLOG SEITE – LISTE MIT BILD LINKS / TEXT RECHTS
   schlicht, sauber, ohne Schnickschnack
========================================================= */

.page-blog-index,
body.blog,
body.archive {
  background: #f6f8fb !important;
}

/* Gesamtbereich */
.page-blog-index .blog-index-sec,
body.blog .blog-index-sec,
body.archive .blog-index-sec {
  background: #f6f8fb !important;
  padding: 64px 48px 90px !important;
}

/* Layout: Sidebar links, Beiträge rechts */
.page-blog-index .blog-layout,
body.blog .blog-layout,
body.archive .blog-layout {
  max-width: 1180px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: 260px minmax(0, 1fr) !important;
  gap: 32px !important;
  align-items: start !important;
}

/* Sidebar links */
.page-blog-index .blog-sidebar,
body.blog .blog-sidebar,
body.archive .blog-sidebar {
  display: flex !important;
  flex-direction: column !important;
  gap: 18px !important;
  position: sticky !important;
  top: 90px !important;
}

/* Sidebar Box */
.page-blog-index .blog-widget,
body.blog .blog-widget,
body.archive .blog-widget {
  background: #fff !important;
  border: 1px solid rgba(0,0,0,.08) !important;
  border-radius: 18px !important;
  padding: 20px !important;
  box-shadow: 0 10px 28px rgba(15,35,55,.05) !important;
}

/* Sidebar Titel */
.page-blog-index .blog-widget-title,
body.blog .blog-widget-title,
body.archive .blog-widget-title {
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 1.2px !important;
  text-transform: uppercase !important;
  color: #1d1d1f !important;
  margin: 0 0 14px !important;
}

/* Suche */
.page-blog-index .blog-search-form,
body.blog .blog-search-form,
body.archive .blog-search-form {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

.page-blog-index .blog-search-form input,
body.blog .blog-search-form input,
body.archive .blog-search-form input {
  width: 100% !important;
  height: 42px !important;
  border: 1px solid rgba(0,0,0,.12) !important;
  border-radius: 12px !important;
  padding: 0 13px !important;
  font-size: 14px !important;
  font-family: inherit !important;
  background: #f6f8fb !important;
  color: #1d1d1f !important;
  outline: none !important;
}

.page-blog-index .blog-search-form input:focus,
body.blog .blog-search-form input:focus,
body.archive .blog-search-form input:focus {
  border-color: #14a0dc !important;
  background: #fff !important;
}

.page-blog-index .blog-search-form button,
body.blog .blog-search-form button,
body.archive .blog-search-form button {
  height: 42px !important;
  border: none !important;
  border-radius: 12px !important;
  background: #14a0dc !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  font-family: inherit !important;
  cursor: pointer !important;
}

/* Themenliste */
.page-blog-index .blog-topic-list,
body.blog .blog-topic-list,
body.archive .blog-topic-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

.page-blog-index .blog-topic-list a,
body.blog .blog-topic-list a,
body.archive .blog-topic-list a {
  display: flex !important;
  justify-content: space-between !important;
  gap: 10px !important;
  text-decoration: none !important;
  color: #3c3c3c !important;
  background: #f6f8fb !important;
  border-radius: 10px !important;
  padding: 9px 11px !important;
  font-size: 14px !important;
  line-height: 1.35 !important;
}

.page-blog-index .blog-topic-list a:hover,
body.blog .blog-topic-list a:hover,
body.archive .blog-topic-list a:hover {
  color: #14a0dc !important;
}

/* Hauptbereich */
.page-blog-index .blog-main,
body.blog .blog-main,
body.archive .blog-main {
  min-width: 0 !important;
}

/* Beitragsliste */
.page-blog-index .st-blog-grid,
body.blog .st-blog-grid,
body.archive .st-blog-grid {
  display: flex !important;
  flex-direction: column !important;
  gap: 22px !important;
  max-width: none !important;
  margin: 0 !important;
}

/* Beitrag: EIN Rahmen */
.page-blog-index .st-post-card,
body.blog .st-post-card,
body.archive .st-post-card {
  display: grid !important;
  grid-template-columns: 260px minmax(0, 1fr) !important;
  gap: 0 !important;
  background: #fff !important;
  border: 1px solid rgba(0,0,0,.08) !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  box-shadow: 0 12px 34px rgba(15,35,55,.06) !important;
  text-decoration: none !important;
  color: inherit !important;
  min-height: 190px !important;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease !important;
}

.page-blog-index .st-post-card:hover,
body.blog .st-post-card:hover,
body.archive .st-post-card:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(20,160,220,.28) !important;
  box-shadow: 0 18px 46px rgba(15,35,55,.10) !important;
}

/* Bild links */
.page-blog-index .st-post-thumb,
body.blog .st-post-thumb,
body.archive .st-post-thumb {
  width: 260px !important;
  height: 100% !important;
  min-height: 190px !important;
  background: #e9eef3 !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Bild selbst */
.page-blog-index .st-post-thumb img,
body.blog .st-post-thumb img,
body.archive .st-post-thumb img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

/* Platzhalter, wenn kein Bild vorhanden */
.page-blog-index .st-post-thumb:not(:has(img)),
body.blog .st-post-thumb:not(:has(img)),
body.archive .st-post-thumb:not(:has(img)) {
  background: linear-gradient(135deg, #0d7aad, #14a0dc) !important;
}

/* Alte Pseudo-Felder weg */
.page-blog-index .st-post-thumb::before,
.page-blog-index .st-post-thumb::after,
body.blog .st-post-thumb::before,
body.blog .st-post-thumb::after,
body.archive .st-post-thumb::before,
body.archive .st-post-thumb::after {
  display: none !important;
  content: none !important;
}

/* Icon im Platzhalter */
.page-blog-index .st-post-thumb-icon,
body.blog .st-post-thumb-icon,
body.archive .st-post-thumb-icon {
  width: 42px !important;
  height: 42px !important;
  stroke: rgba(255,255,255,.8) !important;
  fill: none !important;
  stroke-width: 1.5 !important;
}

/* Text rechts */
.page-blog-index .st-post-body,
body.blog .st-post-body,
body.archive .st-post-body {
  padding: 26px 30px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  min-width: 0 !important;
  background: #fff !important;
}

/* Kategorie */
.page-blog-index .st-post-cat,
body.blog .st-post-cat,
body.archive .st-post-cat {
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 1.5px !important;
  text-transform: uppercase !important;
  color: #14a0dc !important;
  margin: 0 0 10px !important;
}

/* Titel */
.page-blog-index .st-post-body h3,
body.blog .st-post-body h3,
body.archive .st-post-body h3 {
  font-size: 25px !important;
  line-height: 1.2 !important;
  font-weight: 600 !important;
  color: #1d1d1f !important;
  margin: 0 0 10px !important;
  letter-spacing: -.5px !important;
}

/* Vorschautext */
.page-blog-index .st-post-body p,
body.blog .st-post-body p,
body.archive .st-post-body p {
  font-size: 15px !important;
  line-height: 1.65 !important;
  color: #6e6e73 !important;
  margin: 0 0 18px !important;
  font-weight: 300 !important;

  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

/* Footer in der Textbox */
.page-blog-index .st-post-footer,
body.blog .st-post-footer,
body.archive .st-post-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  padding-top: 14px !important;
  border-top: 1px solid rgba(0,0,0,.08) !important;
  margin-top: auto !important;
}

.page-blog-index .st-post-date,
body.blog .st-post-date,
body.archive .st-post-date {
  font-size: 13px !important;
  color: #a6abb5 !important;
}

.page-blog-index .st-post-read,
body.blog .st-post-read,
body.archive .st-post-read {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #14a0dc !important;
  white-space: nowrap !important;
}

/* Links nicht unterstreichen */
.page-blog-index .st-post-card a,
body.blog .st-post-card a,
body.archive .st-post-card a {
  text-decoration: none !important;
}

/* Responsive */
@media (max-width: 900px) {
  .page-blog-index .blog-layout,
  body.blog .blog-layout,
  body.archive .blog-layout {
    grid-template-columns: 1fr !important;
  }

  .page-blog-index .blog-sidebar,
  body.blog .blog-sidebar,
  body.archive .blog-sidebar {
    position: static !important;
  }

  .page-blog-index .st-post-card,
  body.blog .st-post-card,
  body.archive .st-post-card {
    grid-template-columns: 220px minmax(0, 1fr) !important;
  }

  .page-blog-index .st-post-thumb,
  body.blog .st-post-thumb,
  body.archive .st-post-thumb {
    width: 220px !important;
  }
}

@media (max-width: 650px) {
  .page-blog-index .blog-index-sec,
  body.blog .blog-index-sec,
  body.archive .blog-index-sec {
    padding: 44px 22px 70px !important;
  }

  .page-blog-index .st-post-card,
  body.blog .st-post-card,
  body.archive .st-post-card {
    grid-template-columns: 1fr !important;
  }

  .page-blog-index .st-post-thumb,
  body.blog .st-post-thumb,
  body.archive .st-post-thumb {
    width: 100% !important;
    height: 200px !important;
    min-height: 200px !important;
  }

  .page-blog-index .st-post-body,
  body.blog .st-post-body,
  body.archive .st-post-body {
    padding: 22px !important;
  }

  .page-blog-index .st-post-body h3,
  body.blog .st-post-body h3,
  body.archive .st-post-body h3 {
    font-size: 22px !important;
  }
}