:root{--navy:#0b2d5b;--navy2:#102f55;--blue:#4f7db8;--blue2:#2f76d2;--ice:#eef6ff;--text:#10223d;--muted:#65738a;--line:#e4ebf3;--white:#fff;--shadow:0 16px 45px rgba(20,47,83,.10)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Arial,sans-serif;color:var(--text);background:#fff;line-height:1.55}img{max-width:100%;display:block}a{text-decoration:none;color:inherit}.container{width:min(1180px,calc(100% - 40px));margin:0 auto}.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.96);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}.nav-wrap{height:74px;display:flex;align-items:center;gap:30px}.brand img{width:220px}.desktop-nav{margin-left:auto;display:flex;gap:30px;font-size:14px;font-weight:600}.desktop-nav a{color:#34465f}.header-actions{display:flex;gap:10px}.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:10px;padding:11px 18px;font-weight:700;font-size:14px;transition:.2s ease;border:1px solid transparent}.btn:hover{transform:translateY(-1px)}.btn-primary{background:var(--navy);color:#fff;box-shadow:0 8px 20px rgba(11,45,91,.18)}.btn-ghost{border-color:#c9d7e9;color:var(--navy)}.btn-outline{border-color:#a8bfdc;color:#1e66b3;background:#fff}.btn-white{background:#fff;color:var(--navy)}.btn-lg{padding:14px 22px;border-radius:11px}.full{width:100%}.hero{position:relative;overflow:hidden;padding:70px 0 50px;background:linear-gradient(180deg,#fff 0%,#f8fbff 100%)}.hero-bg{position:absolute;inset:0;background:radial-gradient(circle at 78% 30%,rgba(79,125,184,.12),transparent 28%),linear-gradient(135deg,transparent 52%,rgba(79,125,184,.05) 52% 70%,transparent 70%);pointer-events:none}.hero-grid{position:relative;display:grid;grid-template-columns:1.02fr 1.25fr;gap:56px;align-items:center}.eyebrow{display:block;font-size:12px;letter-spacing:.14em;font-weight:800;color:#7b8da7;margin-bottom:14px}.hero h1{font-size:58px;line-height:1.02;letter-spacing:-.045em;margin:0 0 22px;color:var(--navy)}.hero-copy>p{font-size:18px;color:var(--muted);max-width:590px}.hero-actions{display:flex;gap:12px;margin:26px 0 32px}.industries>span{font-size:11px;letter-spacing:.11em;font-weight:800;color:#8a99ad}.industry-icons{display:flex;gap:18px;margin-top:12px;font-size:27px;filter:grayscale(1);opacity:.75}.hero-visual{padding:10px}.hero-visual img{width:100%;border-radius:18px;filter:drop-shadow(0 22px 30px rgba(11,45,91,.14))}.feature-strip{padding:18px 0 44px}.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.feature-card{display:flex;gap:14px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px;box-shadow:0 6px 20px rgba(20,47,83,.05)}.icon-box{width:46px;height:46px;flex:0 0 46px;border-radius:12px;background:#e9f3ff;color:#1f63aa;display:grid;place-items:center;font-size:24px}.feature-card h3{font-size:16px;margin:1px 0 6px}.feature-card p{font-size:13px;line-height:1.45;color:var(--muted);margin:0}.section{padding:92px 0}.section-sm{padding:70px 0}.workflow{background:#fbfdff}.workflow-grid{display:grid;grid-template-columns:1.15fr .9fr .75fr;gap:34px;align-items:center}.ui-frame{background:#fff;border:1px solid var(--line);border-radius:18px;padding:8px;box-shadow:var(--shadow)}.ui-frame img{border-radius:12px;width:100%}.workflow-copy h2,.pricing h2,.cta h2,.section-title{font-size:42px;line-height:1.08;letter-spacing:-.035em;color:var(--navy);margin:0 0 18px}.workflow-copy p,.pricing-head p{color:var(--muted)}.check-list{list-style:none;padding:0;margin:22px 0 0}.check-list li{position:relative;padding-left:30px;margin:12px 0;color:#44566f}.check-list li:before{content:'✓';position:absolute;left:0;top:0;width:20px;height:20px;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;font-size:12px;font-weight:800}.worker-card{position:relative;border-radius:18px;overflow:hidden;min-height:330px;background:#f0f5fa}.worker-card img{width:100%;height:100%;min-height:330px;object-fit:cover}.note{position:absolute;z-index:2;left:18px;top:20px;font-family:cursive;font-size:22px;line-height:1.1;color:#4d6c91;transform:rotate(-4deg);text-shadow:0 1px #fff}.testimonials{background:#fff}.section-title{max-width:660px}.quote-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:30px}.quote-grid blockquote{margin:0;border:1px solid var(--line);border-radius:16px;padding:26px;background:#fff;box-shadow:0 8px 24px rgba(20,47,83,.05);font-size:16px;color:#33445d}.quote-grid footer{margin-top:20px;font-size:13px;color:#7c8ba1;font-weight:700}.pricing{background:#f7fbff}.pricing-head{display:flex;justify-content:space-between;align-items:end;gap:30px}.pricing-head p{max-width:440px}.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:40px}.price-card{position:relative;background:#fff;border:1px solid var(--line);border-radius:18px;padding:30px;box-shadow:0 8px 28px rgba(20,47,83,.06)}.price-card.featured{border:2px solid var(--blue2);transform:translateY(-8px)}.badge{position:absolute;left:-2px;right:-2px;top:-32px;height:32px;border-radius:12px 12px 0 0;background:linear-gradient(90deg,#1c66bd,#3984dc);color:#fff;display:grid;place-items:center;font-size:11px;font-weight:800;letter-spacing:.08em}.price-card h3{font-size:23px;margin:0 0 12px;color:var(--navy)}.price{font-size:32px;font-weight:800;color:#0d315f}.price small{font-size:14px;color:#7c8ba1}.price-card ul{padding-left:20px;color:#55657b;min-height:150px}.price-card li{margin:10px 0}.cta{background:#fff}.cta-box{display:flex;justify-content:space-between;align-items:center;gap:30px;background:linear-gradient(135deg,#0b2d5b,#1f5f9f);color:#fff;border-radius:24px;padding:42px 48px}.cta h2{color:#fff;margin:0}.eyebrow.light{color:#c6d8ee}.footer{padding:62px 0 26px;background:#0b2340;color:#d7e1ee}.footer-grid{display:grid;grid-template-columns:2fr repeat(3,1fr);gap:40px}.footer-logo{width:220px;filter:brightness(0) invert(1)}.footer p{max-width:330px;color:#9db0c7}.footer h4{color:#fff;margin:0 0 14px}.footer a{display:block;color:#a9bad0;margin:9px 0;font-size:14px}.copyright{margin-top:44px;padding-top:22px;border-top:1px solid rgba(255,255,255,.12);font-size:12px;color:#7f96b0}
@media (max-width:980px){.desktop-nav{display:none}.header-actions .btn-ghost{display:none}.hero-grid,.workflow-grid{grid-template-columns:1fr}.hero{padding-top:48px}.hero h1{font-size:48px}.hero-visual{order:2}.feature-grid{grid-template-columns:repeat(2,1fr)}.worker-card{display:none}.workflow-grid{gap:28px}.price-grid{grid-template-columns:1fr}.price-card.featured{transform:none;margin-top:32px}.pricing-head{display:block}.quote-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr}.cta-box{align-items:flex-start;flex-direction:column}}
@media (max-width:640px){.container{width:min(100% - 28px,1180px)}.site-header .nav-wrap{height:66px}.brand img{width:185px}.header-actions .btn-primary{padding:10px 12px;font-size:12px}.hero h1{font-size:40px}.hero-copy>p{font-size:16px}.hero-actions{flex-direction:column;align-items:stretch}.feature-grid{grid-template-columns:1fr}.section{padding:68px 0}.section-sm{padding:54px 0}.workflow-copy h2,.pricing h2,.cta h2,.section-title{font-size:34px}.footer-grid{grid-template-columns:1fr}.cta-box{padding:34px 26px}.industry-icons{font-size:22px}.hero-visual{padding:0}}

/* Updated brand asset */
.brand{display:flex;align-items:center;min-width:0}
.brand img{width:238px;height:auto;max-height:50px;object-fit:contain;object-position:left center}
.footer-logo{width:238px;height:auto;filter:none}
.hero-visual{display:flex;align-items:center;justify-content:center}
.hero-visual img{background:transparent;object-fit:contain}
@media (max-width:640px){.brand img{width:190px;max-height:44px}}

/* ===== Brand + accounting integrations refinements ===== */
.site-header .brand img{
  width:190px;
  max-height:42px;
  object-fit:contain;
  object-position:left center;
}

.footer-logo{
  width:205px;
  max-height:48px;
  object-fit:contain;
  object-position:left center;
  filter:brightness(0) invert(1) !important;
  opacity:.98;
}

/* Small accounting teaser in the hero */
.accounting-inline{
  display:inline-flex;
  align-items:center;
  gap:18px;
  margin:4px 0 28px;
  padding:12px 14px;
  border:1px solid var(--line);
  border-radius:14px;
  background:rgba(255,255,255,.86);
  box-shadow:0 8px 24px rgba(20,47,83,.05);
}
.accounting-inline-copy{display:flex;align-items:center;gap:10px;white-space:nowrap}
.accounting-inline-copy>span:last-child{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.accounting-inline-copy strong{font-size:14px;color:var(--navy)}
.accounting-inline-copy small{font-size:12px;color:var(--muted)}
.status-dot{width:8px;height:8px;border-radius:50%;background:#2c7be5;box-shadow:0 0 0 4px #e9f3ff;flex:0 0 auto}
.accounting-inline-logos{display:flex;align-items:center;gap:13px}
.accounting-inline-logos .divider{width:1px;height:26px;background:var(--line)}
.accounting-inline-logos img{width:auto;height:25px;max-width:100px;object-fit:contain}
.accounting-inline-logos img[alt="Lexware"]{height:22px;max-width:105px}

/* Accounting section */
.integrations{background:#fff}
.integrations-shell{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(520px,1.1fr);
  gap:64px;
  align-items:center;
}
.integrations-copy h2{
  font-size:42px;
  line-height:1.08;
  letter-spacing:-.035em;
  color:var(--navy);
  margin:0 0 18px;
}
.integrations-copy>p{color:var(--muted);max-width:570px}
.integration-checks{margin-top:24px}

.integration-visual{
  position:relative;
  min-height:470px;
  border:1px solid var(--line);
  border-radius:24px;
  background:linear-gradient(145deg,#f8fbff 0%,#eef5fc 100%);
  overflow:hidden;
  box-shadow:var(--shadow);
}
.integration-visual:before{
  content:"";
  position:absolute;
  width:330px;height:330px;border-radius:50%;
  background:rgba(66,133,224,.07);
  left:50%;top:50%;transform:translate(-50%,-50%);
}
.flow-card{
  position:absolute;
  z-index:2;
  background:#fff;
  border:1px solid #e2eaf3;
  border-radius:16px;
  box-shadow:0 12px 32px rgba(20,47,83,.09);
}
.target-card{
  width:230px;
  padding:18px 20px;
}
.target-card.sevdesk-card{right:28px;top:42px}
.target-card.lexware-card{right:28px;bottom:42px}
.integration-status{font-size:11px;font-weight:700;color:#6f8199;display:flex;align-items:center;gap:7px;margin-bottom:15px}
.integration-status span{width:7px;height:7px;border-radius:50%;background:#39a96b}
.target-card img{
  width:auto !important;
  height:42px !important;
  max-width:180px !important;
  object-fit:contain !important;
  object-position:left center;
  margin:0 0 14px !important;
}
.lexware-card img{height:32px !important;max-width:170px !important}
.target-card p{font-size:12px;line-height:1.5;color:#73839a;margin:0}

.source-card{
  width:230px;
  padding:21px 20px;
  left:28px;
  top:50%;
  transform:translateY(-50%);
}
.source-card img{
  width:180px !important;
  height:auto !important;
  max-height:54px !important;
  object-fit:contain !important;
  object-position:left center;
  margin:0 0 15px !important;
}
.source-card span{font-size:12px;color:#718198;display:block}
.flow-line{
  position:absolute;
  z-index:1;
  left:252px;
  width:calc(100% - 500px);
  height:2px;
  background:#c9d9eb;
  transform-origin:left center;
}
.flow-line.line-one{top:48%;transform:rotate(-18deg)}
.flow-line.line-two{top:52%;transform:rotate(18deg)}
.flow-line i{position:absolute;right:-3px;top:-3px;width:8px;height:8px;border-radius:50%;background:#2f76d2}

@media (max-width:980px){
  .site-header .brand img{width:175px;max-height:40px}
  .integrations-shell{grid-template-columns:1fr;gap:34px}
  .integration-visual{min-height:440px}
}
@media (max-width:640px){
  .site-header .brand img{width:155px;max-height:36px}
  .accounting-inline{display:flex;align-items:flex-start;flex-direction:column;gap:12px;width:100%}
  .accounting-inline-logos{width:100%}
  .accounting-inline-logos img{height:23px;max-width:95px}
  .integrations-copy h2{font-size:34px}
  .integration-visual{min-height:auto;padding:18px;display:grid;gap:14px}
  .flow-card{position:relative;inset:auto !important;transform:none !important;width:100%}
  .source-card{order:1}
  .sevdesk-card{order:2}
  .lexware-card{order:3}
  .flow-line{display:none}
  .footer-logo{width:190px}
}

/* ===== Before / after workflow comparison ===== */
.workflow-compare{
  background:#fbfdff;
  padding:70px 0 76px;
}
.workflow-compare .container{
  width:min(1460px,calc(100% - 36px));
}
.workflow-compare-image{
  border-radius:26px;
  overflow:hidden;
  background:#fff;
  box-shadow:0 24px 70px rgba(16,47,85,.10);
  border:1px solid rgba(228,235,243,.9);
}
.workflow-compare-image img{
  width:100%;
  height:auto;
  display:block;
}
@media (max-width:980px){
  .workflow-compare{padding:56px 0 60px}
  .workflow-compare .container{width:min(100% - 24px,1460px)}
  .workflow-compare-image{border-radius:20px}
}
@media (max-width:640px){
  .workflow-compare{padding:42px 0 46px}
  .workflow-compare .container{width:min(100% - 16px,1460px)}
  .workflow-compare-image{border-radius:14px}
}

/* ===== Interactive before / after workflow slider ===== */
.workflow-compare{background:#fbfdff;padding:82px 0 88px}
.workflow-compare-shell{width:min(1380px,calc(100% - 36px))}
.workflow-compare-heading{text-align:center;max-width:880px;margin:0 auto 38px}
.workflow-compare-heading h2{font-size:48px;line-height:1.06;letter-spacing:-.04em;color:var(--navy);margin:10px 0 14px}
.workflow-compare-heading p{font-size:18px;line-height:1.6;color:var(--muted);margin:0}
.workflow-compare-grid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:30px;align-items:stretch}
.before-after-slider{--position:50%;position:relative;min-height:560px;border:1px solid var(--line);border-radius:26px;overflow:hidden;background:#edf4fb;box-shadow:0 24px 70px rgba(16,47,85,.10);isolation:isolate}
.compare-layer{position:absolute;inset:0;overflow:hidden}
.compare-layer img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.compare-before{z-index:1}
.compare-before img{object-position:56% center;filter:saturate(.88) contrast(.98) brightness(.90)}
.compare-before .compare-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,24,44,.72) 0%,rgba(8,24,44,.28) 48%,rgba(8,24,44,.08) 100%)}
.compare-after{z-index:2;clip-path:inset(0 0 0 var(--position));background:linear-gradient(145deg,#f8fbff 0%,#e9f4ff 100%)}
.after-bg{position:absolute;inset:0;background:radial-gradient(circle at 82% 22%,rgba(79,125,184,.14),transparent 34%),linear-gradient(145deg,#f9fcff,#eaf4ff)}
.after-device{object-fit:contain!important;object-position:center!important;padding:72px 48px 38px;filter:drop-shadow(0 24px 34px rgba(13,49,95,.16))}
.compare-badge{position:absolute;top:24px;z-index:5;padding:11px 16px;border-radius:12px;font-size:15px;font-weight:800;box-shadow:0 8px 22px rgba(12,42,80,.12)}
.compare-badge-before{left:24px;background:#fff2f2;color:#9e3030}
.compare-badge-after{right:24px;background:#e9fff1;color:#177746}
.compare-copy{position:absolute;z-index:5;display:flex;flex-direction:column;gap:10px;max-width:290px}
.compare-copy strong{font-size:25px;line-height:1.1}
.compare-copy span{font-size:15px;font-weight:600}
.before-copy{left:30px;bottom:32px;color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.28)}
.after-copy{right:30px;bottom:30px;color:var(--navy);background:rgba(255,255,255,.86);backdrop-filter:blur(10px);padding:17px 18px;border:1px solid rgba(214,228,243,.9);border-radius:16px;box-shadow:0 12px 30px rgba(20,47,83,.08)}
.compare-divider{position:absolute;z-index:7;top:0;bottom:0;left:var(--position);width:3px;background:#fff;transform:translateX(-50%);box-shadow:0 0 0 1px rgba(13,49,95,.10),0 0 20px rgba(13,49,95,.16);pointer-events:none}
.compare-divider span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--navy);font-size:22px;font-weight:800;box-shadow:0 10px 28px rgba(11,45,91,.20)}
.compare-range{position:absolute;z-index:8;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0}
.workflow-benefits{display:grid;grid-template-columns:1fr;gap:14px}
.workflow-benefits article{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px 19px;box-shadow:0 8px 24px rgba(20,47,83,.05)}
.benefit-icon{width:44px;height:44px;flex:0 0 44px;border-radius:13px;display:grid;place-items:center;background:#eef6ff;color:#1267cf;font-weight:800;font-size:22px}
.workflow-benefits h3{margin:1px 0 6px;color:var(--navy);font-size:18px}
.workflow-benefits p{margin:0;color:var(--muted);font-size:14px;line-height:1.5}
.workflow-transition{display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center;margin:24px 26px 0}
.paper-pill,.digital-pill{display:inline-flex;align-items:center;padding:12px 18px;border-radius:999px;font-size:14px;font-weight:800;white-space:nowrap}
.paper-pill{background:#fff0f1;color:#b23d43}.digital-pill{background:#edf5ff;color:#1267cf}
.transition-line{color:#6aa0e0;letter-spacing:2px;overflow:hidden;white-space:nowrap;text-align:center;opacity:.85}
@media (max-width:1080px){
  .workflow-compare-grid{grid-template-columns:1fr}
  .workflow-benefits{grid-template-columns:repeat(2,1fr)}
  .before-after-slider{min-height:520px}
}
@media (max-width:700px){
  .workflow-compare{padding:58px 0 62px}
  .workflow-compare-shell{width:min(100% - 22px,1380px)}
  .workflow-compare-heading h2{font-size:36px}
  .workflow-compare-heading p{font-size:16px}
  .before-after-slider{min-height:470px;border-radius:20px}
  .after-device{padding:92px 20px 74px}
  .compare-copy{max-width:210px}
  .compare-copy strong{font-size:20px}.compare-copy span{font-size:13px}
  .before-copy{left:18px;bottom:20px}.after-copy{right:18px;bottom:18px;padding:14px}
  .compare-badge{top:16px;padding:9px 12px;font-size:13px}.compare-badge-before{left:16px}.compare-badge-after{right:16px}
  .workflow-benefits{grid-template-columns:1fr}
  .workflow-transition{grid-template-columns:1fr;justify-items:center;margin-inline:0}.transition-line{display:none}
}