/* ===== KG — Next Level Design ===== */
:root {
  --blue: #2563eb;
  --blue-d: #1d4ed8;
  --blue-dd: #1e3a8a;
  --blue-l: #eff6ff;
  --blue-ll: #f0f5ff;
  --orange: #f97316;
  --green: #059669;
  --text: #0f172a;
  --text-2: #475569;
  --text-3: #94a3b8;
  --bg: #fff;
  --bg-2: #f8fafc;
  --bg-3: #f1f5f9;
  --border: #e2e8f0;
  --dark: #0f172a;
  --dark-2: #1e293b;
  --r: 10px;
  --r-lg: 16px;
  --r-xl: 24px;
  --sh: 0 1px 3px rgba(0,0,0,.04), 0 1px 2px rgba(0,0,0,.06);
  --sh-md: 0 4px 6px -1px rgba(0,0,0,.07), 0 2px 4px -2px rgba(0,0,0,.05);
  --sh-lg: 0 10px 25px -3px rgba(0,0,0,.08), 0 4px 10px -4px rgba(0,0,0,.04);
  --sh-xl: 0 20px 50px -12px rgba(0,0,0,.12);
  --ease: cubic-bezier(.4,0,.2,1);
  --mw: 1180px;
}

/* === Self-hosted Inter font (DSGVO-konform) === */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url('/assets/fonts/inter-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

/* === Reset === */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:'Inter',system-ui,-apple-system,BlinkMacSystemFont,sans-serif;color:var(--text);background:var(--bg);line-height:1.7;font-size:16px;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--blue);text-decoration:none;transition:color .2s var(--ease)}
a:hover{color:var(--blue-d)}
ul{list-style:none}

/* Global SVG sizing — prevents blow-up */
svg{flex-shrink:0}
svg:not([width]){width:18px;height:18px}

/* === Typography === */
h1,h2,h3,h4{color:var(--text);line-height:1.2;letter-spacing:-.025em}
h1{font-size:clamp(2.1rem,4.5vw,3.4rem);font-weight:800}
h2{font-size:clamp(1.6rem,3vw,2.4rem);font-weight:700}
h3{font-size:1.1rem;font-weight:600;letter-spacing:-.01em}
.eyebrow{font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--blue);margin-bottom:8px;display:block}

/* === Layout === */
.container{max-width:var(--mw);margin:0 auto;padding:0 24px}
.container--sm{max-width:720px}
.tc{text-align:center}
.lead{font-size:clamp(1.05rem,1.8vw,1.2rem);color:var(--text-2);line-height:1.7}
.sec{padding:96px 0}
.sec--alt{background:var(--bg-2)}
.sec--hero-sm{padding:64px 0 48px;background:linear-gradient(180deg,var(--bg-2) 0%,var(--bg) 100%)}
.head{max-width:600px;margin:0 auto 56px;text-align:center}
.head .lead{margin-top:12px}
.head--left{text-align:left;margin-left:0}

/* === Animation === */
.anim{opacity:0;transform:translateY(20px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.anim.is-visible{opacity:1;transform:none}
.anim-d1{transition-delay:.08s}.anim-d2{transition-delay:.16s}.anim-d3{transition-delay:.24s}.anim-d4{transition-delay:.32s}

/* === Buttons === */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:13px 28px;border-radius:var(--r);font-weight:600;font-size:.9rem;
  border:1.5px solid var(--blue);background:var(--blue);color:#fff;
  cursor:pointer;transition:all .2s var(--ease);white-space:nowrap;line-height:1.4;
}
.btn:hover{background:var(--blue-d);border-color:var(--blue-d);color:#fff;box-shadow:var(--sh-md);transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn svg{width:16px!important;height:16px!important;flex-shrink:0;stroke:currentColor}
.btn--white svg{stroke:var(--blue)}
.btn--ghost svg{stroke:#fff}
.btn--outline svg{stroke:var(--blue)}
.btn--outline:hover svg{stroke:#fff}
.btn--outline{background:transparent;color:var(--blue)}
.btn--outline:hover{background:var(--blue);color:#fff}
.btn--white{background:#fff;color:var(--blue);border-color:#fff}
.btn--white:hover{background:var(--blue-l);border-color:var(--blue-l);color:var(--blue-d)}
.btn--ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.35)}
.btn--ghost:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.6);color:#fff}
.btn--sm{padding:9px 18px;font-size:.82rem}
.btn--lg{padding:15px 36px;font-size:.95rem}
.btn-row{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.btn-row--c{justify-content:center;text-align:center}

/* === Topbar === */
.topbar{background:var(--dark);color:#fff;font-size:.78rem;padding:6px 0}
.topbar__wrap{display:flex;align-items:center;justify-content:center;gap:24px;max-width:var(--mw);margin:0 auto;padding:0 24px}
.topbar__item{color:rgba(255,255,255,.8);display:inline-flex;align-items:center;gap:5px;transition:color .2s var(--ease);white-space:nowrap}
.topbar__item:hover{color:#fff}
.topbar__item svg{stroke:rgba(255,255,255,.6)}
.topbar__wa svg{stroke:#25d366}

/* === Nav === */
.nav{position:sticky;top:0;z-index:1000;background:rgba(255,255,255,.92);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid rgba(226,232,240,.6);transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.nav--scrolled{box-shadow:0 1px 8px rgba(0,0,0,.06)}
.nav--hidden{transform:translateY(-100%)}
.nav__wrap{display:flex;align-items:center;justify-content:space-between;max-width:var(--mw);margin:0 auto;padding:10px 24px}
.nav__logo{display:flex;align-items:center;gap:10px;color:var(--text);font-size:.82rem;line-height:1.25}
.nav__logo img{width:38px;height:38px;border-radius:10px;object-fit:cover}
.nav__logo strong{color:var(--blue);font-weight:700}
.nav__menu{display:flex;align-items:center;gap:2px}
.nav__menu a{display:flex;align-items:center;gap:6px;padding:7px 14px;color:var(--text-2);font-weight:500;font-size:.88rem;border-radius:8px;transition:all .2s var(--ease)}
.nav__menu a:hover{color:var(--blue);background:var(--blue-l)}
.nav__phone a{color:var(--blue)!important;font-weight:600!important}
.nav__phone svg{stroke:var(--blue)}
.nav__cta{background:var(--blue)!important;color:#fff!important;font-weight:600!important;padding:8px 20px!important;border-radius:var(--r)!important}
.nav__cta:hover{background:var(--blue-d)!important;color:#fff!important}
.nav__burger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:6px}
.nav__burger span{display:block;width:20px;height:2px;background:var(--text);border-radius:2px;transition:all .3s var(--ease)}
.nav__burger.is-active span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.nav__burger.is-active span:nth-child(2){opacity:0}
.nav__burger.is-active span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}

/* === Hero === */
.hero{padding:72px 0 88px;background:linear-gradient(170deg,#f0f5ff 0%,#e8f0fe 40%,var(--bg) 100%);position:relative;overflow:hidden}
.hero::after{content:'';position:absolute;top:-200px;right:-150px;width:500px;height:500px;background:radial-gradient(circle,rgba(37,99,235,.06) 0%,transparent 70%);border-radius:50%;pointer-events:none}
.hero__grid{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:center}
.hero__text{position:relative;z-index:1}
.hero__text h1{margin-bottom:16px}
.hero__text .lead{margin-bottom:32px;max-width:520px}
.hero__badges{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}
.hero__badge{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;background:#fff;border-radius:100px;font-size:.78rem;font-weight:500;color:var(--text-2);border:1px solid var(--border);box-shadow:var(--sh)}
.hero__badge svg{width:14px!important;height:14px!important;stroke:var(--blue);color:var(--blue)}
.hero__img{position:relative;z-index:1}
.hero__img img{border-radius:var(--r-xl);box-shadow:var(--sh-xl)}

/* === Trust === */
.trust{padding:20px 0;background:var(--bg);border-bottom:1px solid var(--border)}
.trust__row{display:flex;align-items:center;justify-content:center;gap:40px;flex-wrap:wrap}
.trust__row img{height:32px;width:auto;opacity:.6;filter:grayscale(.3);transition:all .3s var(--ease)}
.trust__row img:hover{opacity:1;filter:none}

/* === Stats === */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.stat{background:#fff;padding:28px 16px;border-radius:var(--r-lg);border:1px solid var(--border);text-align:center;transition:all .3s var(--ease)}
.stat:hover{border-color:var(--blue);box-shadow:var(--sh-md)}
.stat__n{font-size:1.8rem;font-weight:800;color:var(--blue);line-height:1}
.stat__l{font-size:.82rem;color:var(--text-2);margin-top:4px;font-weight:500}

/* === Feature cards === */
.features{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.fc{padding:32px 28px;background:#fff;border-radius:var(--r-lg);border:1px solid var(--border);transition:all .3s var(--ease);position:relative;overflow:hidden}
.fc::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--blue);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease)}
.fc:hover{border-color:var(--blue);box-shadow:var(--sh-lg)}.fc:hover::before{transform:scaleX(1)}
.fc__ic{width:44px;height:44px;border-radius:12px;background:var(--blue-l);display:flex;align-items:center;justify-content:center;margin-bottom:16px;color:var(--blue)}
.fc__ic svg{width:22px!important;height:22px!important;color:var(--blue);stroke:var(--blue)}
.fc h3{margin-bottom:8px}
.fc p{color:var(--text-2);font-size:.88rem;line-height:1.65}

/* === Split === */
.split{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.split--r{direction:rtl}.split--r>*{direction:ltr}
.split__img{border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--sh-lg)}
.split__img img{width:100%;display:block}
.split__t h2{margin-bottom:12px}
.split__t .lead{margin-bottom:20px}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:16px}
.tag{padding:5px 14px;background:var(--bg-2);border:1px solid var(--border);border-radius:100px;font-size:.78rem;font-weight:500;color:var(--text-2);transition:all .2s var(--ease)}
.tag:hover{background:var(--blue-l);border-color:var(--blue);color:var(--blue)}
.check-list{margin-top:16px}
.check-list li{padding:10px 0;display:flex;gap:10px;align-items:flex-start;color:var(--text-2);font-size:.92rem;border-bottom:1px solid var(--border)}
.check-list li:last-child{border:0}
.check-list svg{width:18px!important;height:18px!important;stroke:var(--green)!important;color:var(--green);flex-shrink:0;margin-top:2px}

/* === Branchen === */
/* Branchen: fixed 3x3 grid */
.branchen{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.br{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:28px 12px;background:#fff;border-radius:var(--r-lg);border:1px solid var(--border);transition:all .3s var(--ease);aspect-ratio:1/1;max-width:100%}
.br:hover{border-color:var(--blue);box-shadow:var(--sh-lg);transform:translateY(-3px)}
.br img{width:72px;height:72px;border-radius:50%;object-fit:cover;margin-bottom:12px;border:3px solid var(--bg-3);transition:border-color .3s var(--ease)}
.br:hover img{border-color:var(--blue-l)}
.br span{font-weight:600;font-size:.85rem;color:var(--text);line-height:1.3}

/* === Testimonial === */
.testi{max-width:640px;margin:0 auto;text-align:center;position:relative}
.testi__stars{display:flex;gap:2px;justify-content:center;margin-bottom:16px}
.testi__stars svg{width:18px!important;height:18px!important}
.testi__q{font-size:1.08rem;color:var(--text-2);line-height:1.8;font-style:italic}
.testi__a{margin-top:20px;font-weight:700;font-size:.9rem;color:var(--text)}

/* === FAQ === */
.faq{max-width:640px;margin:0 auto}
.faq details{border:1px solid var(--border);border-radius:var(--r);margin-bottom:6px;transition:all .2s var(--ease);overflow:hidden}
.faq details[open]{border-color:var(--blue);background:var(--blue-ll)}
.faq summary{padding:16px 20px;cursor:pointer;font-weight:600;font-size:.9rem;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px;transition:background .2s}
.faq summary:hover{background:var(--bg-2)}
.faq summary::after{content:'+';font-size:1.2rem;font-weight:300;color:var(--blue);transition:transform .3s var(--ease);flex-shrink:0}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p,.faq details a{padding:0 20px 16px;color:var(--text-2);font-size:.88rem;line-height:1.7}

/* === CTA === */
.cta-sec{background:linear-gradient(135deg,var(--blue-dd) 0%,var(--blue) 50%,#3b82f6 100%);padding:88px 0;text-align:center;color:#fff;position:relative;overflow:hidden}
.cta-sec::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E")}
.cta-sec h2{color:#fff;margin-bottom:12px;position:relative}
.cta-sec .lead{color:rgba(255,255,255,.8);margin:0 auto 32px;max-width:500px;position:relative}
.cta-sec .btn-row{position:relative}

/* === Pricing === */
.pricing{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:start}
.pc{background:#fff;border-radius:var(--r-xl);border:1.5px solid var(--border);padding:36px 28px;position:relative;transition:all .3s var(--ease)}
.pc:hover{box-shadow:var(--sh-xl)}
.pc--pop{border-color:var(--blue);box-shadow:var(--sh-xl);z-index:1}
.pc__badge{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:var(--orange);color:#fff;padding:5px 18px;border-radius:100px;font-size:.72rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}
.pc__badge--light{background:var(--blue-l);color:var(--blue)}
.pc__badge--pro{background:var(--blue-dd);color:#fff}
.pc__icon{width:48px;height:48px;border-radius:14px;background:var(--blue-l);display:flex;align-items:center;justify-content:center;margin:8px 0 16px}
.pc__icon svg{width:24px!important;height:24px!important;stroke:var(--blue);color:var(--blue)}
.pc--pop .pc__icon{background:var(--blue);}.pc--pop .pc__icon svg{stroke:#fff;color:#facc15}
.pc__name{font-size:1.05rem;font-weight:700}
.pc__desc{font-size:.82rem;color:var(--text-3);margin:2px 0 20px}
.pc__price{font-size:2.6rem;font-weight:800;color:var(--text);line-height:1}
.pc__price span{font-size:.85rem;font-weight:400;color:var(--text-3)}
.pc__list{margin:24px 0;border-top:1px solid var(--border);padding-top:20px}
.pc__list li{padding:6px 0;font-size:.85rem;color:var(--text-2);display:flex;align-items:baseline;gap:8px}
.pc__list li::before{content:'';display:inline-block;width:16px;height:16px;min-width:16px;border-radius:50%;background:var(--blue-l) url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' fill='%232563eb' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.5 11.5L3 8l1-1 2.5 2.5 5-5 1 1z'/%3E%3C/svg%3E") center/12px no-repeat}
.pc .btn{width:100%;margin-top:8px}
.pricing-note{text-align:center;margin-top:24px;font-size:.78rem;color:var(--text-3)}

/* === Contact === */
.contact{display:grid;grid-template-columns:1fr 1.3fr;gap:48px}
.contact__item{display:flex;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid var(--border)}
.contact__item svg{width:18px!important;height:18px!important;color:var(--blue);stroke:var(--blue);flex-shrink:0}
.contact__item a{color:var(--text);font-weight:500;font-size:.92rem}.contact__item a:hover{color:var(--blue)}
.contact__regions{margin-top:28px;padding:20px;background:var(--bg-2);border-radius:var(--r-lg)}
.contact__regions h3{font-size:.95rem;margin-bottom:6px}
.contact__regions p{color:var(--text-2);font-size:.88rem}
.contact__form{background:#fff;border-radius:var(--r-xl);padding:36px;box-shadow:var(--sh-lg);border:1px solid var(--border)}
.fg{margin-bottom:14px}
.fg label{display:block;font-weight:600;font-size:.82rem;margin-bottom:5px;color:var(--text)}
.fg input,.fg textarea{width:100%;padding:11px 14px;border:1.5px solid var(--border);border-radius:var(--r);font-size:.9rem;font-family:inherit;transition:all .2s var(--ease);background:var(--bg-2)}
.fg input:focus,.fg textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-l);background:#fff}
.fg textarea{resize:vertical;min-height:100px}
.fg-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}

/* === Products === */
.products{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.prodcard{background:#fff;border-radius:var(--r-xl);overflow:hidden;border:1px solid var(--border);transition:all .4s var(--ease)}
.prodcard:hover{box-shadow:var(--sh-xl);transform:translateY(-3px)}
.prodcard__img{height:220px;overflow:hidden}
.prodcard__img img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.prodcard:hover .prodcard__img img{transform:scale(1.04)}
.prodcard__body{padding:24px 28px}
.prodcard__body h3{margin-bottom:8px}
.prodcard__body p{color:var(--text-2);font-size:.88rem}

/* === About === */
.about__img{border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--sh-xl)}
.about__quote{border-left:3px solid var(--blue);padding:14px 20px;margin-top:20px;background:var(--blue-l);border-radius:0 var(--r) var(--r) 0;font-style:italic;color:var(--text-2);font-size:.95rem}

/* === Blog === */
.blog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px}
.bcard{display:flex;flex-direction:column;background:#fff;border-radius:var(--r-xl);overflow:hidden;border:1px solid var(--border);transition:all .35s var(--ease);color:var(--text)}
.bcard:hover{box-shadow:var(--sh-xl);transform:translateY(-3px);color:var(--text)}
.bcard__img{height:190px;overflow:hidden}
.bcard__img img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.bcard:hover .bcard__img img{transform:scale(1.04)}
.bcard__body{padding:20px 24px;flex:1;display:flex;flex-direction:column}
.bcard__body time{font-size:.75rem;color:var(--text-3);font-weight:600;text-transform:uppercase;letter-spacing:.03em}
.bcard__body h3{margin:6px 0 8px;font-size:.95rem}
.bcard__body p{font-size:.84rem;color:var(--text-2);flex:1;line-height:1.6}

/* Article */
.article{padding:56px 0}
.article h1{margin-bottom:8px}
.article time{color:var(--text-3);font-size:.85rem;font-weight:500;display:block;margin-bottom:28px}
.article img{border-radius:var(--r-xl);margin-bottom:28px}
.article h2{margin:36px 0 12px}
.article p{margin-bottom:16px;color:var(--text-2)}
.article ul{margin:0 0 20px 20px;list-style:disc;color:var(--text-2)}
.article li{margin-bottom:6px;font-size:.92rem}
.article table{width:100%;border-collapse:collapse;margin:20px 0 28px;border-radius:var(--r);overflow:hidden;font-size:.9rem}
.article th,.article td{padding:12px 16px;text-align:left;border:1px solid var(--border)}
.article th{background:var(--bg-2);font-weight:600}
.article td{color:var(--text-2)}

/* Legal */
.legal h2{margin:36px 0 10px;font-size:1.15rem}
.legal p{margin-bottom:12px;color:var(--text-2);font-size:.92rem}
.legal ul{margin:0 0 16px 20px;list-style:disc;color:var(--text-2)}
.legal li{margin-bottom:6px;font-size:.92rem}

/* === WhatsApp Float === */
.wa-float{position:fixed;bottom:24px;right:24px;z-index:999;width:54px;height:54px;border-radius:50%;background:#25d366;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 14px rgba(37,211,102,.4);transition:all .3s var(--ease)}
.wa-float:hover{transform:scale(1.08) translateY(-2px);box-shadow:0 6px 20px rgba(37,211,102,.5)}

/* Success */
.success-icon{width:64px;height:64px;border-radius:50%;background:var(--green);color:#fff;font-size:1.6rem;display:flex;align-items:center;justify-content:center;margin:0 auto 16px}

/* === Footer === */
.footer{background:var(--dark);color:#94a3b8;padding:56px 0 28px}
.footer a{color:#94a3b8;transition:color .2s var(--ease)}.footer a:hover{color:#fff}
.footer__grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:36px;margin-bottom:40px}
.footer__brand{display:flex;align-items:center;gap:10px;color:#fff;font-weight:700;font-size:.9rem;margin-bottom:12px}
.footer__brand img{width:32px;height:32px;border-radius:8px;object-fit:cover}
.footer__col h4{color:#e2e8f0;font-size:.78rem;font-weight:700;margin-bottom:12px;text-transform:uppercase;letter-spacing:.08em}
.footer__col p{font-size:.85rem;margin-bottom:4px;line-height:1.6}
.footer__col a{display:block;font-size:.85rem;padding:2px 0}
.footer__bottom{border-top:1px solid var(--dark-2);padding-top:20px;text-align:center;font-size:.75rem;color:#64748b}
.footer__bottom p+p{margin-top:4px}

/* === Responsive === */

/* Tablet landscape */
@media(max-width:960px){
  .hero__grid,.split,.split--r{grid-template-columns:1fr}.split--r{direction:ltr}
  .hero__img{order:-1;max-width:440px;margin:0 auto}
  .features,.pricing,.products{grid-template-columns:1fr 1fr}
  .stats{grid-template-columns:repeat(2,1fr)}
  .footer__grid{grid-template-columns:1fr 1fr}
  .contact{grid-template-columns:1fr}
  .pc--pop{z-index:auto}
  .nav__phone{display:none}
  .topbar__wrap{gap:16px}
}

/* Tablet portrait / large phone */
@media(max-width:768px){
  .sec{padding:56px 0}
  .topbar{display:none}
  .nav__burger{display:flex}
  .nav__menu{
    display:none;flex-direction:column;position:absolute;top:100%;left:0;right:0;
    background:rgba(255,255,255,.98);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
    padding:8px 16px 16px;border-bottom:1px solid var(--border);box-shadow:var(--sh-lg);gap:0;
  }
  .nav__menu.is-open{display:flex}
  .nav__menu a{padding:12px 16px;border-radius:var(--r)}
  .nav__phone{display:list-item!important;border-top:1px solid var(--border);margin-top:4px;padding-top:4px}
  .nav__phone a{font-size:.92rem!important;justify-content:center}
  .nav__cta{text-align:center;margin-top:4px}
  .features,.pricing,.products{grid-template-columns:1fr}
  .fg-row{grid-template-columns:1fr}
  .blog-grid{grid-template-columns:1fr}
  .branchen{grid-template-columns:repeat(3,1fr);gap:12px}
  .br{padding:20px 8px;aspect-ratio:auto}
  .br img{width:56px;height:56px}
  .br span{font-size:.78rem}
  .head{margin-bottom:40px}
  .hero{padding:48px 0 64px}
  .hero h1{font-size:1.8rem}
  .split{gap:40px}
  .contact__form{padding:24px}
  .cta-sec{padding:64px 0}
  .footer__grid{grid-template-columns:1fr 1fr}
  .footer{padding:40px 0 20px}
}

/* Phone */
@media(max-width:480px){
  .sec{padding:40px 0}
  .hero{padding:32px 0 48px}
  .hero h1{font-size:1.5rem}
  .hero .lead{font-size:.95rem}
  .stats{grid-template-columns:1fr 1fr;gap:8px}
  .stat{padding:16px 10px}.stat__n{font-size:1.3rem}.stat__l{font-size:.75rem}
  .branchen{grid-template-columns:repeat(3,1fr);gap:8px}
  .br{padding:12px 4px;aspect-ratio:auto}
  .br img{width:40px;height:40px;margin-bottom:6px;border-width:2px}
  .br span{font-size:.7rem}
  .fc{padding:24px 20px}
  .fc__ic{width:38px;height:38px}.fc__ic svg{width:18px!important;height:18px!important}
  .footer__grid{grid-template-columns:1fr;gap:24px}
  .btn-row{flex-direction:column}.btn-row .btn{width:100%}
  .hero__badges{justify-content:center}
  .hero__badge{font-size:.7rem;padding:5px 10px}
  .wa-float{bottom:16px;right:16px;width:48px;height:48px}
  .cta-sec{padding:48px 0}
  .cta-sec h2{font-size:1.4rem}
  .trust__row{gap:16px}.trust__row img{height:22px}
  .head{margin-bottom:32px}
  .head .lead{font-size:.9rem}
  .split{gap:32px}
  .split__t h2{font-size:1.3rem}
  .testi__q{font-size:.95rem}
  .pricing{gap:16px}
  .pc{padding:28px 20px}
  .pc__price{font-size:2rem}
  .contact__form{padding:20px 16px}
  .faq summary{padding:14px 16px;font-size:.85rem}
  .faq details p{padding:0 16px 14px;font-size:.84rem}
  .nav__wrap{padding:8px 16px}
  .nav__logo img{width:34px;height:34px}
  .nav__logo span{font-size:.75rem}
  .article{padding:32px 0}
  .article h1{font-size:1.4rem}
  .blog-grid{gap:16px}
  .prodcard__img{height:160px}
  .prodcard__body{padding:18px 20px}
}