:root{
  --page:#f4f4f1; --card:#ffffff; --ink:#101012; --ink-2:#3a3d40; --mut:#73767a; --line:#e9e9e4; --line-2:#f0f0ec;
  --brand:#F6612F; --brand-d:#d44e1f; --brand-ink:#2a1006; --tint:#fdeee7;
  --mint:#eaf6ee; --mint-d:#2f9e5e; --sky:#e9f1fb; --sky-d:#2f6fd0; --lilac:#f1edfb; --lilac-d:#6a4fd0; --amber:#fdf3e0;
  --r:18px; --r-sm:12px; --r-lg:26px; --pill:100px;
  --sans:-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,Roboto,'Helvetica Neue',Arial,sans-serif; --mono:ui-monospace,'SF Mono','Cascadia Code',Consolas,'Liberation Mono',monospace;
  --max:1180px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--page);color:var(--ink);font-family:var(--sans);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:var(--max);margin:0 auto;padding:0 26px}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--brand-d);
  background:var(--tint);border:1px solid #f7d3c2;border-radius:var(--pill);padding:6px 14px}
.eyebrow .dot{width:7px;height:7px;border-radius:50%;background:var(--brand)}
h2.sec{font-size:clamp(28px,3.6vw,42px);font-weight:800;letter-spacing:-.025em;line-height:1.12;text-align:center}
.sec-sub{text-align:center;color:var(--mut);font-size:16.5px;max-width:560px;margin:14px auto 0}
.sec-head{text-align:center;margin-bottom:48px}
.sec-head .eyebrow{margin-bottom:18px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--sans);font-size:15px;
  font-weight:700;border-radius:var(--pill);padding:13px 24px;cursor:pointer;border:1px solid transparent;transition:.16s;white-space:nowrap}
.btn-brand{background:var(--brand);color:#fff}
.btn-brand:hover{background:var(--brand-d);transform:translateY(-1px)}
.btn-dark{background:var(--ink);color:#fff}
.btn-dark:hover{background:#000}
.btn-ghost{background:#fff;color:var(--ink);border-color:var(--line)}
.btn-ghost:hover{border-color:var(--ink)}
.btn-sm{padding:10px 18px;font-size:14px}
section{padding:84px 0}

/* ============ NAV ============ */
header{position:sticky;top:0;z-index:80;background:rgba(244,244,241,.82);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
nav{display:flex;align-items:center;justify-content:space-between;height:72px}
.logo img{height:26px;width:auto}
.nav-links{display:flex;gap:30px;font-size:15px;font-weight:500;color:var(--ink-2)}
.nav-links a:hover{color:var(--brand-d)}
.nav-right{display:flex;align-items:center;gap:14px}
.nav-right .login{font-size:15px;font-weight:600}
.burger{display:none;font-size:22px;background:none;border:0;cursor:pointer}

/* ============ HERO ============ */
.hero{padding:64px 0 0;text-align:center;position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;top:-180px;left:50%;transform:translateX(-50%);width:900px;height:560px;
  background:radial-gradient(ellipse at center,rgba(246,97,47,.12),transparent 62%);pointer-events:none}
.hero .wrap{position:relative}
.hero h1{font-size:clamp(38px,5.6vw,68px);font-weight:800;letter-spacing:-.035em;line-height:1.04;max-width:16ch;margin:22px auto 0}
.hero h1 em{font-style:normal;color:var(--brand)}
.hero .lead{font-size:18px;color:var(--mut);max-width:600px;margin:22px auto 0}
.hero-form{display:flex;gap:10px;max-width:480px;margin:32px auto 14px;background:#fff;border:1px solid var(--line);
  border-radius:var(--pill);padding:7px 7px 7px 20px;box-shadow:0 12px 40px -22px rgba(0,0,0,.3)}
.hero-form input{flex:1;border:0;outline:0;font-family:var(--sans);font-size:15px;background:none;color:var(--ink)}
.hero-form input::placeholder{color:#9a9d9f}
.hero-note{font-size:13px;color:var(--mut);font-family:var(--mono)}
.hero-mock{margin:44px auto -120px;max-width:980px;position:relative}

/* dashboard browser mock */
.win{background:#fff;border:1px solid var(--line);border-radius:16px 16px 0 0;box-shadow:0 40px 90px -40px rgba(20,20,30,.5);overflow:hidden}
.win-bar{display:flex;align-items:center;gap:14px;padding:12px 16px;border-bottom:1px solid var(--line-2);background:#fbfbf9}
.win-dots{display:flex;gap:7px}.win-dots i{width:11px;height:11px;border-radius:50%;display:block}
.win-dots i:nth-child(1){background:#ff5f57}.win-dots i:nth-child(2){background:#febc2e}.win-dots i:nth-child(3){background:#28c840}
.win-url{font-family:var(--mono);font-size:12px;color:var(--mut);background:#fff;border:1px solid var(--line);border-radius:8px;padding:4px 14px}
.dash{display:grid;grid-template-columns:200px 1fr;min-height:430px;text-align:left}
.dash-side{background:#fafaf8;border-right:1px solid var(--line-2);padding:18px 14px;display:flex;flex-direction:column;gap:5px}
.dash-side .mk{display:flex;align-items:center;gap:9px;margin-bottom:18px;font-weight:800;font-size:15px}
.dash-side .mk .b{width:22px;height:22px;border-radius:7px;background:var(--brand);display:flex;align-items:center;justify-content:center;color:#fff;font-size:12px}
.dash-side a{font-size:13.5px;color:var(--mut);padding:9px 11px;border-radius:9px;display:flex;align-items:center;gap:9px;font-weight:500}
.dash-side a.on{background:var(--tint);color:var(--brand-d);font-weight:700}
.dash-main{padding:22px 24px}
.dash-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
.dash-h b{font-size:18px;font-weight:800;letter-spacing:-.02em}
.dash-h .chip{font-size:12px;background:var(--mint);color:var(--mint-d);font-weight:700;border-radius:var(--pill);padding:5px 12px}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:18px}
.kpi{background:#fafaf8;border:1px solid var(--line-2);border-radius:12px;padding:13px 15px}
.kpi small{font-size:11px;color:var(--mut);font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.kpi b{display:block;font-size:22px;font-weight:800;letter-spacing:-.03em;margin-top:4px}
.kpi b span{color:var(--brand)}
.chart{display:flex;align-items:flex-end;gap:9px;height:120px;padding:14px;background:#fafaf8;border:1px solid var(--line-2);border-radius:12px;margin-bottom:14px}
.chart i{flex:1;background:linear-gradient(180deg,var(--brand),#ffb594);border-radius:5px 5px 0 0;display:block}
.app-row{display:flex;align-items:center;gap:12px;padding:10px 13px;border:1px solid var(--line-2);border-radius:11px;margin-bottom:8px;font-size:13px}
.app-row .d{width:8px;height:8px;border-radius:50%;background:var(--mint-d);box-shadow:0 0 8px var(--mint-d)}
.app-row .nm{font-family:var(--mono);font-weight:600}
.app-row .meta{margin-left:auto;color:var(--mut);font-family:var(--mono);font-size:11.5px}
.toast{position:absolute;right:-14px;bottom:30px;background:#fff;border:1px solid var(--line);border-radius:14px;
  box-shadow:0 24px 60px -26px rgba(0,0,0,.45);padding:14px 16px;display:flex;gap:11px;align-items:center;max-width:250px}
.toast .ic{width:34px;height:34px;border-radius:10px;background:var(--mint);color:var(--mint-d);display:flex;align-items:center;justify-content:center;font-size:17px;flex-shrink:0}
.toast b{font-size:13.5px;display:block}.toast span{font-size:12px;color:var(--mut);font-family:var(--mono)}

/* ============ LOGO STRIP ============ */
.strip{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:150px 0 40px}
.strip-cap{text-align:center;font-size:13px;font-weight:600;color:var(--mut);text-transform:uppercase;letter-spacing:.12em;margin-bottom:26px}
.strip-row{display:flex;flex-wrap:wrap;gap:18px 38px;justify-content:center;align-items:center}
.tool{display:inline-flex;align-items:center;gap:10px;font-size:16.5px;font-weight:600;color:#9a9d98;letter-spacing:-.01em}
.tlogo{width:23px;height:23px;flex-shrink:0;background:currentColor;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain}

/* ============ KEY FEATURES ============ */
.feat3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.fcard{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:30px 26px;transition:.18s}
.fcard:hover{transform:translateY(-4px);box-shadow:0 26px 60px -34px rgba(0,0,0,.28)}
.fcard .fi{width:54px;height:54px;border-radius:15px;display:flex;align-items:center;justify-content:center;font-size:25px;margin-bottom:20px}
.fcard h3{font-size:20px;font-weight:700;letter-spacing:-.02em;margin-bottom:9px}
.fcard p{color:var(--mut);font-size:14.5px}
.caro{display:flex;justify-content:center;gap:10px;margin-top:30px}
.caro button{width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:#fff;cursor:pointer;font-size:17px;color:var(--ink-2);transition:.15s}
.caro button:hover{background:var(--ink);color:#fff;border-color:var(--ink)}

/* ============ INNOVATION ============ */
.hl-card{background:var(--mint);border:1px solid #d6ecdd;border-radius:var(--r-lg);padding:42px;display:grid;grid-template-columns:1fr 1fr;gap:34px;align-items:center;margin-bottom:18px}
.hl-card h3{font-size:30px;font-weight:800;letter-spacing:-.025em;line-height:1.12;margin-bottom:16px}
.hl-card p{color:var(--ink-2);font-size:15px;margin-bottom:20px}
.hl-list{list-style:none;display:flex;flex-direction:column;gap:12px}
.hl-list li{display:flex;gap:11px;align-items:center;font-size:15px;font-weight:600}
.hl-list li::before{content:"✓";width:24px;height:24px;border-radius:50%;background:var(--mint-d);color:#fff;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0}
.mini-cards{display:flex;flex-direction:column;gap:12px}
.mini{background:#fff;border:1px solid #e3efe7;border-radius:16px;padding:16px 18px}
.mini-top{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--mut);font-family:var(--mono);margin-bottom:10px}
.mini-big{font-size:30px;font-weight:800;letter-spacing:-.03em}
.mini-big span{color:var(--brand);font-size:15px;margin-left:6px}
.spark{display:flex;align-items:flex-end;gap:4px;height:42px;margin-top:8px}
.spark i{flex:1;background:#cfe8d8;border-radius:3px}
.spark i.hot{background:var(--brand)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.icard{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:28px;display:flex;flex-direction:column;gap:18px}
.icard h4{font-size:21px;font-weight:700;letter-spacing:-.02em}
.icard p{color:var(--mut);font-size:14.5px}
.stat-mock{background:#fafaf8;border:1px solid var(--line-2);border-radius:14px;padding:18px}
.stat-mock .row{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:12px}
.stat-mock .row b{font-size:26px;font-weight:800;letter-spacing:-.03em}
.stat-mock .row b span{color:var(--brand)}
.stat-mock .row em{font-style:normal;font-size:12px;color:var(--mint-d);font-weight:700;font-family:var(--mono)}
.bars{display:flex;align-items:flex-end;gap:7px;height:64px}
.bars i{flex:1;border-radius:4px 4px 0 0;background:linear-gradient(180deg,var(--brand),#ffc6ab)}
.donut{display:flex;align-items:center;gap:18px}
.ring{width:96px;height:96px;border-radius:50%;background:conic-gradient(var(--brand) 0 64%,var(--lilac-d) 64% 82%,#e7e7e2 82% 100%);position:relative;flex-shrink:0}
.ring::after{content:"";position:absolute;inset:15px;background:#fff;border-radius:50%}
.ring b{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:18px;z-index:1}
.legend{font-size:13px;display:flex;flex-direction:column;gap:8px}
.legend span{display:flex;align-items:center;gap:8px;color:var(--ink-2)}
.legend span i{width:10px;height:10px;border-radius:3px}

/* ============ EFFICIENCY / TABS ============ */
.eff{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:42px;margin-top:8px}
.tabs{display:flex;gap:6px;border:1px solid var(--line);border-radius:var(--pill);padding:5px;width:max-content;margin:0 auto 36px;background:#fafaf8}
.tabs button{font-family:var(--sans);font-size:14px;font-weight:600;border:0;background:none;cursor:pointer;border-radius:var(--pill);padding:9px 18px;color:var(--mut);transition:.15s}
.tabs button.on{background:var(--ink);color:#fff}
.eff-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:36px;align-items:center}
.eff-grid h3{font-size:28px;font-weight:800;letter-spacing:-.025em;line-height:1.14;margin-bottom:14px}
.eff-grid p{color:var(--mut);font-size:15px;margin-bottom:24px}
.eff-steps{list-style:none;display:flex;flex-direction:column;gap:14px;margin-bottom:26px}
.eff-steps li{display:flex;gap:12px;font-size:15px;font-weight:600;align-items:center}
.eff-steps li .n{width:26px;height:26px;border-radius:8px;background:var(--tint);color:var(--brand-d);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;flex-shrink:0}
.eff-img{background:#fafaf8;border:1px solid var(--line);border-radius:18px;overflow:hidden}
.eff-img .win-bar{background:#fff}
.eff-pane{padding:20px;font-family:var(--mono);font-size:13px;line-height:1.9}
.eff-pane .ln{color:var(--mut)}.eff-pane .ok{color:var(--mint-d)}.eff-pane .br{color:var(--brand-d)}

/* ============ INTEGRATIONS ============ */
.intg{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.orbit{position:relative;width:360px;height:360px;margin:0 auto}
.orbit::before,.orbit::after{content:"";position:absolute;border:1px dashed #d9dbd6;border-radius:50%}
.orbit::before{inset:46px}.orbit::after{inset:96px}
.orbit .core{position:absolute;inset:0;margin:auto;width:86px;height:86px;border-radius:25px;background:var(--brand);
  display:flex;align-items:center;justify-content:center;box-shadow:0 16px 40px -14px rgba(246,97,47,.6);z-index:2}
.core-mark{width:46px;height:46px;display:block}
.core-mark path{fill:#fff}
.bub{position:absolute;top:50%;left:50%;width:52px;height:52px;margin:-26px;border-radius:15px;background:#fff;border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;box-shadow:0 10px 26px -14px rgba(0,0,0,.28);
  transform:rotate(var(--a)) translate(var(--r,132px)) rotate(calc(-1 * var(--a)))}
.blogo{width:26px;height:26px;background:#181818;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain}
@media (prefers-reduced-motion: no-preference){
  .bub{animation:vdOrbit 34s linear infinite}
  @keyframes vdOrbit{
    from{transform:rotate(var(--a)) translate(var(--r,132px)) rotate(calc(-1 * var(--a)))}
    to{transform:rotate(calc(var(--a) + 360deg)) translate(var(--r,132px)) rotate(calc(-1 * var(--a) - 360deg))}
  }
  .orbit:hover .bub{animation-play-state:paused}
}
.intg-txt h2{text-align:left}
.intg-txt p{color:var(--mut);font-size:15.5px;margin:16px 0 26px;max-width:440px}

/* ============ PRICING ============ */
.toggle-wrap{display:flex;align-items:center;justify-content:center;gap:14px;margin-bottom:40px}
.toggle{width:54px;height:30px;border-radius:var(--pill);background:var(--brand);position:relative;cursor:pointer;border:0}
.toggle::after{content:"";position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;transition:.2s}
.toggle.year::after{left:27px}
.toggle-wrap .lab{font-size:15px;font-weight:600;color:var(--mut)}
.toggle-wrap .lab.on{color:var(--ink)}
.save{font-size:12px;font-weight:700;color:var(--brand-d);background:var(--tint);border-radius:var(--pill);padding:4px 11px}
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-items:stretch}
.pcard{border-radius:var(--r-lg);padding:30px 26px;display:flex;flex-direction:column;border:1px solid transparent}
.pcard.c-mint{background:var(--mint);border-color:#d6ecdd}
.pcard.c-pop{background:var(--ink);color:#fff;position:relative;box-shadow:0 30px 70px -30px rgba(20,20,30,.6)}
.pcard.c-lilac{background:var(--lilac);border-color:#e2d9f7}
.pcard .badge{position:absolute;top:18px;right:18px;font-size:11px;font-weight:800;background:var(--brand);color:#fff;border-radius:var(--pill);padding:5px 12px;text-transform:uppercase;letter-spacing:.06em}
.pcard .pname{font-size:15px;font-weight:700;display:flex;align-items:center;gap:9px;margin-bottom:14px}
.pcard .pico{width:30px;height:30px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:15px}
.pcard .amt{font-size:46px;font-weight:800;letter-spacing:-.04em;line-height:1}
.pcard .amt small{font-size:15px;font-weight:600;opacity:.6;letter-spacing:0}
.pcard .pdesc{font-size:13.5px;opacity:.72;margin:6px 0 22px;min-height:38px}
.pcard ul{list-style:none;display:flex;flex-direction:column;gap:12px;margin-bottom:26px;flex:1}
.pcard li{display:flex;gap:10px;font-size:14px;align-items:flex-start}
.pcard li::before{content:"✓";font-weight:800;color:var(--brand)}
.pcard.c-pop li::before{color:#ffb594}
.pcard .btn{width:100%}
.c-pop .btn-pick{background:var(--brand);color:#fff}
.c-mint .btn-pick,.c-lilac .btn-pick{background:#fff;color:var(--ink);border:1px solid rgba(0,0,0,.1)}

/* ============ TESTIMONIALS ============ */
.tcards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.tcard{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px}
.tcard .stars{color:var(--brand);font-size:15px;letter-spacing:2px;margin-bottom:14px}
.tcard p{font-size:14.5px;color:var(--ink-2);margin-bottom:20px}
.tcard .who{display:flex;align-items:center;gap:12px}
.tcard .av{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;color:#fff}
.tcard .who b{font-size:14.5px;display:block}.tcard .who span{font-size:12.5px;color:var(--mut)}

/* ============ FAQ ============ */
.faq{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.qa{background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px 24px}
.qa h4{font-size:16px;font-weight:700;margin-bottom:8px}
.qa p{font-size:14px;color:var(--mut)}

/* ============ BLOG ============ */
.blog-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:40px;flex-wrap:wrap;gap:16px}
.blog-head h2{text-align:left}
.blog2{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.bcard{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;transition:.18s}
.bcard:hover{transform:translateY(-4px);box-shadow:0 26px 60px -34px rgba(0,0,0,.28)}
.bcard .thumb{height:200px;background:linear-gradient(120deg,#1a1c20,#2b1d16)}
.bcard.b2 .thumb{background:linear-gradient(120deg,#241018,#3a1c10)}
.bcard .body{padding:24px 26px}
.bcard .date{font-size:12.5px;color:var(--mut);font-family:var(--mono)}
.bcard h3{font-size:20px;font-weight:700;letter-spacing:-.02em;margin:8px 0 8px}
.bcard p{font-size:14px;color:var(--mut)}

/* ============ FOOTER ============ */
footer{background:#fff;border-top:1px solid var(--line);padding:60px 0 28px}
.foot-top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:36px;padding-bottom:42px;border-bottom:1px solid var(--line)}
.foot-brand img{height:26px;margin-bottom:16px}
.foot-brand p{font-size:14px;color:var(--mut);max-width:260px;margin-bottom:18px}
.sub-form{display:flex;gap:8px;background:#fafaf8;border:1px solid var(--line);border-radius:var(--pill);padding:5px 5px 5px 16px;max-width:300px}
.sub-form input{flex:1;border:0;background:none;outline:0;font-family:var(--sans);font-size:13.5px}
.foot-col h5{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--mut);margin-bottom:16px}
.foot-col a{display:block;font-size:14.5px;color:var(--ink-2);margin-bottom:11px}
.foot-col a:hover{color:var(--brand-d)}
.foot-bot{display:flex;align-items:center;justify-content:space-between;padding-top:22px;flex-wrap:wrap;gap:14px}
.foot-bot small{font-size:13px;color:var(--mut)}
.socials{display:flex;gap:10px}
.socials a{width:36px;height:36px;border-radius:10px;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:15px;color:var(--ink-2)}
.socials a:hover{background:var(--brand);color:#fff;border-color:var(--brand)}

/* ===================== MOTION / ANIMATIONEN ===================== */
@media (prefers-reduced-motion: no-preference){
  /* -- Hover-Feedback -- */
  .btn{transition:transform .16s cubic-bezier(.2,.7,.2,1),background .16s,box-shadow .22s,border-color .16s}
  .btn-brand:hover{box-shadow:0 12px 28px -10px rgba(246,97,47,.55)}
  .btn-dark:hover{box-shadow:0 12px 28px -12px rgba(16,16,18,.5)}
  .btn:active{transform:scale(.97)}
  .nav-links a{position:relative}
  .nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:-5px;height:2px;border-radius:2px;background:var(--brand);transform:scaleX(0);transform-origin:left;transition:transform .24s cubic-bezier(.2,.7,.2,1)}
  .nav-links a:hover::after{transform:scaleX(1)}
  .fcard,.icard,.tcard,.qa,.bcard,.pcard,.mini{transition:transform .26s cubic-bezier(.2,.7,.2,1),box-shadow .28s,border-color .2s}
  .tcard:hover,.qa:hover,.mini:hover{transform:translateY(-4px);box-shadow:0 26px 60px -34px rgba(0,0,0,.2)}
  .pcard.c-mint:hover,.pcard.c-lilac:hover{transform:translateY(-6px);box-shadow:0 30px 64px -34px rgba(0,0,0,.18)}
  .pcard.c-pop:hover{transform:translateY(-6px) scale(1.012)}
  .fcard .fi{transition:transform .26s cubic-bezier(.2,.7,.2,1)}
  .fcard:hover .fi{transform:translateY(-3px) rotate(-5deg)}
  .bub{transition:box-shadow .22s,border-color .22s}
  .bub:hover{box-shadow:0 16px 34px -12px rgba(246,97,47,.4);border-color:rgba(246,97,47,.5);z-index:3}
  .blogo{transition:transform .2s}
  .bub:hover .blogo{transform:scale(1.16)}
  .tool{transition:color .2s,transform .2s}
  .tool:hover{color:var(--brand-d);transform:translateY(-2px)}
  .foot-col a{transition:color .15s,transform .18s}
  .foot-col a:hover{transform:translateX(4px)}
  .socials a{transition:transform .16s,background .16s,color .16s,border-color .16s}
  .socials a:hover{transform:translateY(-2px)}
  .caro button{transition:transform .15s,background .15s,color .15s,border-color .15s}
  .caro button:hover{transform:scale(1.08)}
  .hero-form{transition:box-shadow .22s,border-color .2s}
  .hero-form:focus-within{border-color:var(--brand);box-shadow:0 14px 44px -20px rgba(246,97,47,.42)}

  /* -- Aufbau / Scroll-Reveal -- */
  .reveal{opacity:0;transform:translateY(22px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
  .reveal.in{opacity:1;transform:none}

  /* -- Hero-Loop -- */
  .hero::before{animation:vdGlow 7s ease-in-out infinite}
  @keyframes vdGlow{0%,100%{opacity:.7;transform:translateX(-50%) scale(1)}50%{opacity:1;transform:translateX(-50%) scale(1.08)}}
  .hero-mock{animation:vdFloat 6s ease-in-out infinite}
  @keyframes vdFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

  /* -- Dashboard-Mock-Animation -- */
  .chart i{transform-origin:bottom;animation:vdBar .9s cubic-bezier(.2,.7,.2,1) both}
  @keyframes vdBar{from{transform:scaleY(0)}to{transform:scaleY(1)}}
  .chart i:nth-child(1){animation-delay:.05s}.chart i:nth-child(2){animation-delay:.12s}.chart i:nth-child(3){animation-delay:.19s}.chart i:nth-child(4){animation-delay:.26s}.chart i:nth-child(5){animation-delay:.33s}.chart i:nth-child(6){animation-delay:.4s}.chart i:nth-child(7){animation-delay:.47s}.chart i:nth-child(8){animation-delay:.54s}
  .chart i:last-child{animation:vdBar .9s .54s cubic-bezier(.2,.7,.2,1) both,vdBarPulse 2.6s 1.6s ease-in-out infinite}
  @keyframes vdBarPulse{0%,100%{filter:brightness(1)}50%{filter:brightness(1.22)}}
  .app-row .d{animation:vdDot 2.2s ease-in-out infinite}
  @keyframes vdDot{0%,100%{box-shadow:0 0 0 0 rgba(47,158,94,.5)}55%{box-shadow:0 0 0 6px rgba(47,158,94,0)}}
  .toast{animation:vdToast 9s ease-in-out infinite}
  @keyframes vdToast{0%{opacity:0;transform:translateY(16px) scale(.95)}7%,42%{opacity:1;transform:translateY(0) scale(1)}50%,100%{opacity:0;transform:translateY(16px) scale(.95)}}
  .toast .ic{animation:vdPop 9s ease-in-out infinite}
  @keyframes vdPop{0%,4%{transform:scale(0)}10%{transform:scale(1.18)}14%,100%{transform:scale(1)}}
}

@media(max-width:880px){
  .nav-links{display:none} .burger{display:block}
  .feat3,.two,.eff-grid,.intg,.price-grid,.tcards,.faq,.blog2,.foot-top{grid-template-columns:1fr}
  .hl-card{grid-template-columns:1fr;padding:30px} .dash{grid-template-columns:1fr}.dash-side{display:none}
  .hero-mock{margin-bottom:-60px}.strip{padding-top:90px}
}

/* ===== i18n / Sprachwechsel + Blog-Karten als Links (bilingual ergänzt) ===== */
.lang-switch{font-size:14px;font-weight:600;color:var(--mut);border:1px solid var(--line);border-radius:var(--pill);padding:6px 12px;transition:color .15s,border-color .15s}
.lang-switch:hover{color:var(--brand-d);border-color:var(--brand)}
.foot-lang{display:flex;gap:6px}
.foot-lang a{font-size:12.5px;font-weight:700;color:var(--mut);border:1px solid var(--line);border-radius:var(--pill);padding:4px 10px;transition:color .15s}
.foot-lang a[aria-current]{background:var(--ink);color:#fff;border-color:var(--ink)}
.foot-lang a:hover{color:var(--brand-d)}
a.bcard{display:block;color:inherit}
