/* cyrillic */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("/fonts/geist/6b8a53dd-4078-452f-ace9-0e3811fcac24.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("/fonts/geist/45afa127-7d6a-4ef6-a131-3ed8a791cbdd.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("/fonts/geist/852a99ed-4a6d-4df9-b1b4-6fa8bf46f13a.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;
}
/* cyrillic */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/geist/6b8a53dd-4078-452f-ace9-0e3811fcac24.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/geist/45afa127-7d6a-4ef6-a131-3ed8a791cbdd.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/geist/852a99ed-4a6d-4df9-b1b4-6fa8bf46f13a.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;
}
/* cyrillic */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/fonts/geist/6b8a53dd-4078-452f-ace9-0e3811fcac24.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/fonts/geist/45afa127-7d6a-4ef6-a131-3ed8a791cbdd.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/fonts/geist/852a99ed-4a6d-4df9-b1b4-6fa8bf46f13a.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;
}
/* cyrillic */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/fonts/geist/6b8a53dd-4078-452f-ace9-0e3811fcac24.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/fonts/geist/45afa127-7d6a-4ef6-a131-3ed8a791cbdd.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/fonts/geist/852a99ed-4a6d-4df9-b1b4-6fa8bf46f13a.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;
}
/* cyrillic */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/fonts/geist/6b8a53dd-4078-452f-ace9-0e3811fcac24.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/fonts/geist/45afa127-7d6a-4ef6-a131-3ed8a791cbdd.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/fonts/geist/852a99ed-4a6d-4df9-b1b4-6fa8bf46f13a.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;
}
/* cyrillic */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("/fonts/geist/6b8a53dd-4078-452f-ace9-0e3811fcac24.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("/fonts/geist/45afa127-7d6a-4ef6-a131-3ed8a791cbdd.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("/fonts/geist/852a99ed-4a6d-4df9-b1b4-6fa8bf46f13a.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;
}
/* cyrillic */
@font-face {
  font-family: 'Geist Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/geist/1b2b8798-22b9-4b40-99a4-90f28697e71e.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
  font-family: 'Geist Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/geist/999e5fba-f740-45b9-9134-90f4ebc06486.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Geist Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/geist/9429af30-58c9-437e-ad6d-6bca580858d1.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;
}
/* cyrillic */
@font-face {
  font-family: 'Geist Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/fonts/geist/1b2b8798-22b9-4b40-99a4-90f28697e71e.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
  font-family: 'Geist Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/fonts/geist/999e5fba-f740-45b9-9134-90f4ebc06486.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Geist Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/fonts/geist/9429af30-58c9-437e-ad6d-6bca580858d1.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;
}



  :root{
    --bg:#fafaf9;
    --ink:#131841;
    --ink-2:#1a1c2e;
    --muted:#5a5f74;
    --line:#e6e6ea;
    --line-2:#d4d5dc;
    --card:#ffffff;
    --navy:#0a0b1a;
    --navy-2:#141630;
    --ai:#4f6bff;       /* AI blue accent */
    --ai-2:#7d8aff;
    --basics:#14b8a6;   /* teal */
    --work:#2563eb;     /* blue */
    --finance:#ea580c;  /* orange */
    --modules:#8b5cf6;  /* violet */
    --intel:#10b981;    /* green */
    --ok:#059669;
    --warn:#d97706;
    --err:#dc2626;
    --radius:14px;
  }
  *{box-sizing:border-box}
  html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font-family:"Geist",system-ui,sans-serif;-webkit-font-smoothing:antialiased;font-feature-settings:"ss01","cv11"}
  body{font-size:16px;line-height:1.55}
  a{color:inherit;text-decoration:none}
  button{font-family:inherit;cursor:pointer;border:0;background:none;color:inherit}
  .mono{font-family:"Geist Mono",ui-monospace,monospace}
  .container{max-width:1240px;margin:0 auto;padding:0 24px}
  .container-sm{max-width:900px;margin:0 auto;padding:0 24px}
  h1,h2,h3,h4{margin:0;letter-spacing:-0.02em;font-weight:600;line-height:1.05;text-wrap:balance}
  h1{font-size:clamp(44px,6vw,88px);font-weight:700;letter-spacing:-0.035em}
  h2{font-size:clamp(32px,3.6vw,52px);letter-spacing:-0.025em}
  h3{font-size:22px}
  p{margin:0;text-wrap:pretty}
  .eyebrow{font-family:"Geist Mono",monospace;font-size:11px;letter-spacing:0.18em;text-transform:uppercase;color:var(--muted)}
  .section{padding:120px 0;position:relative}
  .section-sm{padding:80px 0}
  .divider{height:1px;background:var(--line)}
  .pill{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;font-size:12px;font-weight:500;border:1px solid var(--line)}
  .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 22px;border-radius:10px;font-weight:500;font-size:15px;transition:.2s;border:1px solid transparent;cursor:pointer}
  .btn-primary{background:var(--ink);color:#fff}
  .btn-primary:hover{background:#0b0f2c;transform:translateY(-1px)}
  .btn-ghost{border-color:var(--line-2);background:transparent}
  .btn-ghost:hover{background:#f3f3f5}
  .btn-ai{background:var(--ai);color:#fff}
  .btn-ai:hover{background:#3a54e8}
  .chip{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:6px;font-size:12px;font-weight:500;background:#f0f0f2;color:var(--ink-2);border:1px solid var(--line)}
  /* Feature-Chip: gleicher Accent-Verlauf wie „Unbegrenzt erweiterbar." */
  .feature > div > .chip{background:linear-gradient(120deg,#4f6bff 0%,#8b5cf6 55%,#ea580c 100%);color:#fff;border:0;font-weight:600;letter-spacing:0.02em;box-shadow:0 4px 14px -6px rgba(79,107,255,.5)}
  .fadein{opacity:0;transform:translateY(12px);transition:opacity .6s, transform .6s}
  .fadein.in{opacity:1;transform:none}

  /* === HEADER === */
  /* sticky + backdrop-filter auf demselben Element bricht in Safari/WebKit; fixed ist zuverlässig */
  header.nav{
    position:fixed;
    top:0;
    left:0;
    right:0;
    z-index:100;
    width:100%;
    box-sizing:border-box;
    background:rgba(250,250,249,.82);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
    border-bottom:1px solid var(--line);
    padding-top:env(safe-area-inset-top,0px);
  }
  body > main{
    padding-top:calc(68px + env(safe-area-inset-top,0px));
  }
  html{
    scroll-padding-top:calc(68px + env(safe-area-inset-top,0px));
  }
  html:has(body[data-preview]){
    scroll-padding-top:calc(68px + 40px + env(safe-area-inset-top,0px));
  }
  body[data-preview] header.nav{top:40px}
  body[data-preview] > main{
    padding-top:calc(68px + 40px + env(safe-area-inset-top,0px));
  }
  .nav-inner{display:flex;align-items:center;justify-content:space-between;height:68px}
  .logo{display:flex;align-items:center;gap:10px;font-weight:700;font-size:20px;letter-spacing:-0.02em}
  .logo-mark{width:28px;height:28px;border-radius:8px;background:var(--ink);display:grid;place-items:center;color:#fff;font-weight:800;font-size:16px;font-family:"Geist Mono",monospace;letter-spacing:-0.04em}
  .logo-mark b{background:linear-gradient(135deg,#6d82ff,#b7a8ff);-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:800}
  nav.primary{display:flex;gap:28px}
  nav.primary a{font-size:14px;color:var(--muted);font-weight:500}
  nav.primary a:hover{color:var(--ink)}
  .nav-right{display:flex;align-items:center;gap:10px}
  .flag{font-size:14px;padding:4px 6px;border-radius:6px;border:1px solid var(--line)}
  @media(max-width:860px){nav.primary{display:none}}

  /* === HERO === */
  .hero{padding:72px 0 60px;position:relative;overflow:hidden;border-bottom:1px solid var(--line);box-shadow:0 4px 20px rgba(10,11,26,.05)}
  .hero-pre{display:inline-flex;align-items:center;gap:8px;font-family:"Geist Mono",monospace;font-size:11px;letter-spacing:0.2em;text-transform:uppercase;color:var(--ink-2);background:#fff;border:1px solid var(--line);padding:7px 14px;border-radius:999px;margin-bottom:28px}
  .hero h1{max-width:1100px}
  .hero h1 .accent{background:linear-gradient(120deg,#4f6bff 0%,#8b5cf6 55%,#ea580c 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
  .hero-sub{max-width:680px;color:var(--muted);font-size:19px;margin-top:24px;line-height:1.5}
  .hero-ctas{display:flex;gap:12px;flex-wrap:wrap;margin-top:32px}
  .hero-trust{display:flex;gap:20px;flex-wrap:wrap;margin-top:28px;font-size:13px;color:var(--muted)}
  .hero-trust span{display:inline-flex;align-items:center;gap:6px}
  .hero-trust.hero-trust--laurels{align-items:center;gap:16px 24px;margin-top:32px}
  .hero-trust.hero-trust--laurels .trust-item{display:inline-flex;align-items:center;gap:9px;color:#6b7299;font-size:15px;font-weight:400;line-height:1}
  .hero-trust.hero-trust--laurels .trust-item b{color:var(--ink);font-weight:600}
  .hero-trust.hero-trust--laurels .trust-laurel{width:11px;height:30px;display:inline-flex;align-items:center;justify-content:center;color:rgba(10,11,26,.3);flex-shrink:0}
  .hero-trust.hero-trust--laurels .trust-laurel svg{width:100%;height:100%;display:block}
  .hero-trust.hero-trust--laurels .trust-laurel:not(.trust-laurel-r) svg{transform:scaleX(-1)}
  .hero-trust.hero-trust--below{margin-top:32px}
  .hero-mockup{margin-top:72px;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:0 30px 80px -30px rgba(10,11,26,.25),0 2px 6px rgba(10,11,26,.04);overflow:hidden;position:relative}
  .hero-caption{text-align:center;color:var(--muted);font-size:12px;margin-top:14px}

  /* --- Layout: split (text left / mockup right) --- */
  body[data-hero="split"] .hero{padding:72px 0 56px}
  body[data-hero="split"] .hero-inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:56px;align-items:start}
  body[data-hero="split"] .hero h1{font-size:clamp(42px,4vw,64px)!important;line-height:1.05;max-width:none}
  body[data-hero="split"] .hero-sub{font-size:17px;margin-top:20px;max-width:520px}
  body[data-hero="split"] .hero-ctas{margin-top:28px}
  body[data-hero="split"] .hero-trust.hero-trust--below{margin-top:28px}
  body[data-hero="split"] .hero-trust{margin-top:24px;font-size:13px;gap:16px}
  body[data-hero="split"] .hero-trust.hero-trust--laurels{gap:14px 22px}
  body[data-hero="split"] .hero-trust.hero-trust--laurels .trust-item{font-size:14px;gap:8px}
  body[data-hero="split"] .hero-trust.hero-trust--laurels .trust-laurel{width:10px;height:26px}
  /* Mockup renders at natural size, then the column clips it with a gradient fade */
  body[data-hero="split"] .hero-mockup{margin-top:0;overflow:hidden;box-shadow:0 24px 60px -24px rgba(10,11,26,.25),0 2px 6px rgba(10,11,26,.04);position:relative}
  body[data-hero="split"] .mock{grid-template-columns:200px minmax(480px,1fr);min-height:520px;transform-origin:top left}
  /* Hide overflow on the right column so the mockup visually "bleeds" off-screen */
  body[data-hero="split"] .hero-mockup::after{content:"";position:absolute;right:0;top:0;bottom:0;width:60px;background:linear-gradient(to right,transparent,#fff);pointer-events:none}
  body[data-hero="split"] .hero-caption{text-align:left;margin-top:12px;font-size:11px}

  /* --- Layout: text (stacked without mockup) --- */
  body[data-hero="text"] .hero{padding:100px 0 80px}
  body[data-hero="text"] .hero h1{max-width:1100px}
  body[data-hero="text"] .hero-sub{font-size:21px;max-width:720px}
  body[data-hero="text"] .hero-mockup,body[data-hero="text"] .hero-caption,body[data-hero="text"] .hero-visual{display:none}

  /* --- Layout: compact (text-only hero + small Bruno orbit visual) --- */
  body[data-hero="compact"] .hero{padding:72px 0 64px}
  body[data-hero="compact"] .hero-inner{display:grid;grid-template-columns:1.3fr 1fr;gap:56px;align-items:center}
  body[data-hero="compact"] .hero h1{font-size:clamp(40px,5vw,72px);max-width:none}
  body[data-hero="compact"] .hero-mockup,body[data-hero="compact"] .hero-caption{display:none}
  body[data-hero="compact"] .hero-visual{position:relative;aspect-ratio:1;max-width:480px;margin-left:auto;background:radial-gradient(circle at center,rgba(79,107,255,.12),transparent 70%);border-radius:24px;display:grid;place-items:center;border:1px solid var(--line)}
  body[data-hero="compact"] .hero-visual .hv-core{width:120px;height:120px;border-radius:28px;background:linear-gradient(135deg,var(--ai),#8b5cf6);display:grid;place-items:center;color:#fff;font-weight:700;font-family:"Geist Mono",monospace;font-size:20px;box-shadow:0 20px 60px rgba(79,107,255,.4)}
  body[data-hero="compact"] .hero-visual .hv-ring{position:absolute;border:1px dashed rgba(79,107,255,.25);border-radius:50%}
  body[data-hero="compact"] .hero-visual .hv-r1{width:60%;height:60%}
  body[data-hero="compact"] .hero-visual .hv-r2{width:92%;height:92%}
  body[data-hero="compact"] .hero-visual .hv-tag{position:absolute;background:#fff;border:1px solid var(--line);padding:6px 11px;border-radius:99px;font-size:11px;font-family:"Geist Mono",monospace;box-shadow:0 4px 14px rgba(10,11,26,.08);white-space:nowrap}

  body:not([data-hero="split"]):not([data-hero="compact"]) .hero-visual{display:none}
  body[data-hero="split"] .hero-visual{display:none}

  @media(max-width:960px){
    body[data-hero="split"] .hero-inner,body[data-hero="compact"] .hero-inner{grid-template-columns:1fr;gap:36px}
    body[data-hero="compact"] .hero-visual{max-width:320px;margin:0 auto}
  }

  /* === MOCKUP (styled screenshot of app) === */
  .mock{display:grid;grid-template-columns:220px 1fr;background:#fff;min-height:560px}
  .mock-side{background:#fafafb;border-right:1px solid var(--line);padding:18px 14px;font-size:13px}
  .mock-side .logo-mini{font-weight:700;display:flex;align-items:center;gap:8px;margin-bottom:20px;font-size:15px}
  .mock-side h6{font-family:"Geist Mono",monospace;font-size:9px;letter-spacing:0.18em;color:#9a9fb1;margin:16px 0 6px;text-transform:uppercase}
  .mock-side .item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;color:#32364d;cursor:default}
  .mock-side .item svg{width:16px;height:16px;opacity:.7}
  .mock-side .item.active{background:#eef1ff;color:var(--ai);font-weight:500}
  .mock-side .item.active svg{opacity:1}
  .mock-body{padding:20px 24px;display:flex;flex-direction:column;gap:16px;background:#fafafb}
  .mock-top{display:flex;justify-content:space-between;align-items:center}
  .mock-top .search{background:#fff;border:1px solid var(--line);border-radius:8px;padding:8px 12px;font-size:13px;color:#9a9fb1;flex:1;max-width:360px}
  .mock-h1{font-size:22px;font-weight:600;letter-spacing:-0.015em}
  .mock-sub{color:var(--muted);font-size:13px;margin-top:2px}
  .kpi-row{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
  .kpi{background:#fff;border:1px solid var(--line);border-radius:10px;padding:14px}
  .kpi .label{font-size:11px;color:var(--muted);font-family:"Geist Mono",monospace;letter-spacing:0.1em;text-transform:uppercase}
  .kpi .value{font-size:22px;font-weight:600;margin-top:6px;letter-spacing:-0.02em}
  .kpi .delta{font-size:11px;color:var(--ok);margin-top:2px;font-family:"Geist Mono",monospace}
  .bruno-card{background:linear-gradient(135deg,#eff3ff 0%,#fff 100%);border:1px solid #d7deff;border-radius:12px;padding:16px 18px;display:flex;gap:14px;align-items:flex-start}
  .bruno-dot{width:32px;height:32px;border-radius:8px;background:var(--ai);color:#fff;display:grid;place-items:center;flex-shrink:0;font-weight:700;font-size:13px;font-family:"Geist Mono",monospace}
  .bruno-card .lines{font-size:13px;color:var(--ink-2)}
  .bruno-card .lines .line{display:flex;gap:8px;align-items:center;padding:3px 0}
  .bruno-card .lines .line .dot{width:6px;height:6px;border-radius:99px;background:#ffb020}
  .mock-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:12px}
  .widget{background:#fff;border:1px solid var(--line);border-radius:10px;padding:14px 16px}
  .widget h5{font-size:13px;font-weight:600;margin:0 0 10px;display:flex;justify-content:space-between;align-items:center}
  .widget h5 .tag{font-size:10px;font-weight:500;color:var(--ai);font-family:"Geist Mono",monospace}
  .agent-row{display:flex;justify-content:space-between;align-items:center;padding:6px 0;font-size:12px;color:var(--ink-2);border-bottom:1px dashed #eef0f5}
  .agent-row:last-child{border:0}
  .agent-row .n{font-family:"Geist Mono",monospace;color:var(--muted);font-size:11px}
  .health{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px}
  .health .h{padding:10px 8px;text-align:center;border-radius:8px;background:#f5f7ff}
  .health .h .n{font-size:20px;font-weight:700}
  .health .h .l{font-size:10px;color:var(--muted);font-family:"Geist Mono",monospace;margin-top:2px}

  .mock-tag{position:absolute;bottom:10px;left:0;right:0;text-align:center;font-size:12px;color:var(--muted)}

  .hero-chips{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:-28px;position:relative;z-index:2}
  .hero-chips .c{background:#fff;border:1px solid var(--line);padding:10px 16px;border-radius:999px;font-size:13px;box-shadow:0 4px 14px rgba(10,11,26,.06);display:inline-flex;align-items:center;gap:8px}

  /* === USP STRIP === */
  .usp-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#fff}
  .usp{padding:32px 28px;border-right:1px solid var(--line);display:flex;gap:16px;align-items:center}
  .usp:last-child{border-right:0}
  .usp .ico{flex-shrink:0;width:40px;height:40px;border-radius:10px;background:#eef1ff;color:var(--ai);display:grid;place-items:center}
  .usp .ico svg{width:22px;height:22px}
  .usp .t{font-weight:600;font-size:14px}
  .usp .d{font-size:12px;color:var(--muted);margin-top:2px}
  @media(max-width:860px){.usp-strip{grid-template-columns:repeat(2,1fr)}.usp:nth-child(2){border-right:0}.usp:nth-child(1),.usp:nth-child(2){border-bottom:1px solid var(--line)}}

  /* === PROBLEM === */
  .problem-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:48px}
  .pain{background:#fff;border:1px solid var(--line);border-radius:14px;padding:24px;position:relative}
  .pain .n{position:absolute;top:18px;right:20px;font-family:"Geist Mono",monospace;font-size:13px;font-weight:700;letter-spacing:0.04em;background:linear-gradient(120deg,#4f6bff 0%,#8b5cf6 55%,#ea580c 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
  .pain .t{font-size:17px;font-weight:600;margin-bottom:10px;letter-spacing:-0.01em}
  .pain .d{font-size:14px;color:var(--muted);line-height:1.5}
  .pain::before{content:"";width:36px;height:2px;background:var(--ink);display:block;margin-bottom:20px;opacity:.3}
  @media(max-width:960px){.problem-grid{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:540px){.problem-grid{grid-template-columns:1fr}}

  /* === BENTO === */
  .bento{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin-top:48px}
  .b{background:#fff;border:1px solid var(--line);border-radius:16px;padding:28px;position:relative;overflow:hidden;display:flex;flex-direction:column}
  .b h3{font-size:22px;letter-spacing:-0.02em;margin-bottom:10px}
  .b p{color:var(--muted);font-size:14px;line-height:1.55}
  .b .b-icon{display:inline-flex;width:42px;height:42px;border-radius:11px;align-items:center;justify-content:center;margin-bottom:18px;flex-shrink:0}
  .b .b-icon svg{width:22px;height:22px}
  /* Bruno tile = 2-column internal layout, no overflow */
  .b-bruno{grid-column:span 4;background:linear-gradient(135deg,#0a0b1a 0%,#1a1d3e 100%);color:#fff;min-height:260px;display:grid;grid-template-columns:1.2fr 1fr;gap:24px;align-items:center;overflow:hidden}
  .b-bruno .b-bruno-content{padding:4px 0}
  .b-bruno h3{color:#fff;font-size:28px}
  .b-bruno p{color:#b8bcd9}
  .b-bruno .b-icon{background:rgba(79,107,255,.18);color:#fff}
  .b-bruno .b-bruno-visual{height:100%;display:grid;place-items:center;opacity:.95}
  .b-span2{grid-column:span 2}
  .b-span3{grid-column:span 3}
  .b-lg{grid-column:span 6;display:grid;grid-template-columns:1.5fr 1fr;gap:24px;align-items:center;background:linear-gradient(135deg,#fff 60%,#eff3ff 100%);border-color:#d7deff}
  .b-lg .calc-pill{background:var(--ai);color:#fff;padding:12px 18px;border-radius:10px;display:inline-flex;gap:8px;align-items:center;font-size:14px;font-weight:500;margin-top:14px;cursor:pointer;border:0;font-family:inherit;transition:.15s;align-self:flex-start}
  .b-lg .calc-pill:hover{background:#3a54e8}
  .b .b-icon.teal{background:#d1faf5;color:#0d9488}
  .b .b-icon.blue{background:#dbeafe;color:#1d4ed8}
  .b .b-icon.orange{background:#ffedd5;color:#c2410c}
  .b .b-icon.violet{background:#ede9fe;color:#6d28d9}
  .b .b-icon.green{background:#d1fae5;color:#059669}
  @media(max-width:960px){
    .bento{grid-template-columns:1fr}
    .b-bruno,.b-span2,.b-span3,.b-lg{grid-column:1}
    .b-bruno{grid-template-columns:1fr;min-height:auto}
    .b-bruno .b-bruno-visual{max-height:200px}
    .b-lg{grid-template-columns:1fr}
  }

  /* === BRUNO SPOTLIGHT === */
  .bruno-spot{background:var(--navy);color:#fff;padding:140px 0;position:relative;overflow:hidden}
  .bruno-spot h2{color:#fff;max-width:760px}
  .bruno-spot .eyebrow{color:#8b93c2}
  .bruno-spot-sub{color:#b8bcd9;max-width:720px;font-size:19px;margin-top:22px;line-height:1.5}
  .bruno-channels{display:flex;gap:10px;margin-top:30px;flex-wrap:wrap}
  .bruno-channels .c{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);padding:8px 14px;border-radius:999px;font-size:13px;display:inline-flex;align-items:center;gap:8px}
  .bruno-channels .c svg{width:15px;height:15px;opacity:.9}
  .bruno-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:48px}
  .bs{border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:28px;background:rgba(255,255,255,.03)}
  .bs .n{font-size:48px;font-weight:700;letter-spacing:-0.03em;background:linear-gradient(135deg,#fff,#8b93c2);-webkit-background-clip:text;background-clip:text;color:transparent}
  .bs .l{color:#8b93c2;font-size:13px;margin-top:8px;font-family:"Geist Mono",monospace}
  .orbit-wrap{position:relative;margin-top:64px;height:420px}
  .orbit-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:100px;height:100px;border-radius:24px;background:linear-gradient(135deg,#4f6bff,#8b5cf6);display:grid;place-items:center;font-weight:700;font-family:"Geist Mono",monospace;box-shadow:0 0 60px rgba(79,107,255,.6)}
  .orbit-ring{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border:1px dashed rgba(255,255,255,.14);border-radius:50%}
  .ring1{width:280px;height:280px;animation:spin 40s linear infinite}
  .ring2{width:420px;height:420px;animation:spin 60s linear infinite reverse}
  @keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
  .agent{position:absolute;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);padding:7px 12px;border-radius:99px;font-size:12px;font-family:"Geist",sans-serif;font-weight:500;backdrop-filter:blur(6px);white-space:nowrap;display:inline-flex;align-items:center;gap:7px;color:#e4e7f5}
  .agent svg{width:13px;height:13px;color:#9db0ff}
  .data-flow{margin-top:56px;display:flex;align-items:stretch;gap:8px;flex-wrap:wrap;font-family:"Geist Mono",monospace;font-size:12px}
  .df{flex:1;min-width:130px;padding:16px 14px;border:1px solid rgba(255,255,255,.14);border-radius:10px;text-align:center;background:rgba(255,255,255,.03)}
  .df .k{color:#8b93c2;font-size:10px;letter-spacing:0.14em;text-transform:uppercase}
  .df .v{margin-top:6px;color:#fff;font-size:13px}
  .df-arrow{display:grid;place-items:center;color:#5a5f8a;width:20px}

  /* === ARCHITECTURE === */
  .basics-bar{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;background:linear-gradient(180deg,#ecfdfa,#fff);border:1px solid #a7f3e8;border-radius:16px;padding:20px;margin-bottom:28px;position:relative}
  .basics-bar::before{content:"FUNDAMENT · fynoBasics";position:absolute;top:-11px;left:20px;background:#fff;padding:2px 10px;font-family:"Geist Mono",monospace;font-size:10px;letter-spacing:0.14em;color:var(--basics);border:1px solid #a7f3e8;border-radius:99px}
  .basic-card{text-align:center;padding:14px 8px;border-right:1px dashed #a7f3e8}
  .basic-card:last-child{border:0}
  .basic-card .ic{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;background:#d1faf5;color:var(--basics);margin:0 auto}
  .basic-card .ic svg{width:20px;height:20px}
  .basic-card .t{font-weight:600;font-size:14px;margin-top:6px}
  .basic-card .u{font-size:12px;color:var(--muted);margin-top:2px}
  @media(max-width:860px){.basics-bar{grid-template-columns:repeat(2,1fr)}.basic-card{border:0;border-bottom:1px dashed #a7f3e8;padding:10px}}

  .tabs{display:flex;gap:8px;border-bottom:1px solid var(--line);padding-bottom:0;overflow-x:auto;scrollbar-width:none}
  .tabs::-webkit-scrollbar{display:none}
  .tab{padding:14px 20px;border-radius:10px 10px 0 0;font-weight:500;font-size:14px;color:var(--muted);border:1px solid transparent;border-bottom:0;background:transparent;white-space:nowrap;position:relative;bottom:-1px}
  .tab.active{color:var(--ink);background:#fff;border-color:var(--line)}
  .tab .dot{width:8px;height:8px;border-radius:99px;display:inline-block;margin-right:8px}
  .tab .count{font-family:"Geist Mono",monospace;font-size:11px;opacity:.6;margin-left:6px}

  .slide{background:#fff;border:1px solid var(--line);border-top:0;border-radius:0 16px 16px 16px;padding:40px;display:grid;grid-template-columns:1fr 1.15fr;gap:48px;align-items:stretch;min-height:560px}
  .slide-text h3{font-size:32px;letter-spacing:-0.025em;margin:18px 0 14px}
  .slide-text .status{align-self:flex-start;width:fit-content;max-width:100%;display:inline-flex;align-items:center;gap:6px;margin-bottom:12px;padding:4px 10px;border-radius:99px;font-size:11px;font-family:"Geist Mono",monospace;letter-spacing:0.06em}
  .slide-text .usp{font-size:17px;color:var(--muted);margin:10px 0 28px;line-height:1.55}
  .slide-text ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:12px}
  .slide-text li{font-size:14px;display:flex;gap:10px;align-items:flex-start}
  .slide-text li::before{content:"";width:5px;height:5px;border-radius:99px;margin-top:8px;flex-shrink:0}
  .slide-visual{background:#f5f6f9;border-radius:14px;border:1px solid var(--line);height:480px;min-height:480px;max-height:480px;padding:20px;display:flex;flex-direction:column;position:relative;overflow:hidden}
  .vis-body{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;gap:10px;overflow:hidden}
  /* Force all inner widgets to grow */
  .chat,.meet,.chart,.bi,.kanban,.email-list,.files,.vault,.cal,.ports,.invoice,.drive,.docs-editor,.chat-workspace{flex:1 1 auto!important;min-height:0}
  /* Unified top-bar for all visuals */
  .vis-topbar{display:flex;align-items:center;gap:10px;padding:0 0 14px;border-bottom:1px dashed var(--line-2);margin-bottom:14px;flex:0 0 auto!important}
  .vis-topbar .vis-ic{width:28px;height:28px;border-radius:7px;background:#fff;border:1px solid var(--line);display:grid;place-items:center;color:var(--ai);flex-shrink:0}
  .vis-topbar .vis-ic svg{width:15px;height:15px}
  .vis-topbar .vis-title{font-size:13px;font-weight:600;color:var(--ink);letter-spacing:-0.01em;line-height:1.2}
  .vis-topbar .vis-sub{font-size:10px;color:var(--muted);font-family:"Geist Mono",monospace;letter-spacing:0.08em;text-transform:uppercase;margin-top:2px}
  .vis-topbar .vis-stat{margin-left:auto;font-size:10px;font-family:"Geist Mono",monospace;color:var(--ok);display:inline-flex;align-items:center;gap:5px;padding:4px 9px;border-radius:99px;background:#d1fae5;font-weight:500}
  .vis-topbar .vis-stat::before{content:"";width:6px;height:6px;border-radius:99px;background:var(--ok);animation:pulse 2s infinite}
  @keyframes pulse{0%,100%{opacity:1}50%{opacity:.5}}

  /* === RESPONSIVE VISUALS ===
     Strategie:
       > 860px  Desktop-Mockup: .slide-visual fuellt die rechte Spalte (stretch),
                feste Hoehe 480px — gleiche Optik fuer alle Funktionen-Visuals.
       721–860  Tablet-Zwischenschritt: KEIN Phone-Chrome, weiterhin Desktop-Rahmen,
                aber innere Widgets bereits 1-Col (Kanban/Chat/Drive etc.).
       ≤ 720px  Phone-Chrome (Status-Bar, Bottom-Nav, schwarzer Rahmen, feste Breite).
     Dadurch schrumpft Desktop nicht mehr auf Phone-Breite, Tablet sieht sauber aus,
     Mobile bleibt das echte Phone-Mockup.
  */

  /* Tablet + Mobile: innere Widgets auf Single-Column umschalten, aber Mockup-Rahmen
     bleibt der Desktop-Rahmen. Das Phone-Chrome kommt erst ≤720px dazu. */
  @media(max-width:860px){
    :root{
      --mobile-mockup-width:320px;
      --mobile-mockup-body-height:400px;
    }
    .chat-workspace{grid-template-columns:1fr!important;min-height:360px}
    .chat-workspace .chw-side{display:none}
    .drive-grid{grid-template-columns:1fr!important}
    .drive-side{display:none}
    .drive-main{grid-template-columns:1fr!important}
    .files{grid-template-columns:1fr 1fr!important}
    .kanban{grid-template-columns:1fr!important;gap:10px}
    .kanban .col{max-height:none;overflow:hidden}
    .cal{grid-template-columns:repeat(5,1fr)!important;gap:3px!important}
    .cal .day{padding:6px 3px!important}
    .cal .day :is(h6, .vis-h){font-size:8px}
    .cal .evt{font-size:8px!important;padding:2px 4px}
    .meet{grid-template-columns:1fr!important}
    .bi{gap:8px!important}
    .bi .bigval{font-size:22px!important}
    .chart{min-height:80px}
    .docs-editor .de-toolbar{display:none}
    .docs-editor .de-page{padding:12px 14px}
    .de-h1{font-size:14px!important}
    .de-comment{position:static!important;margin-top:8px;max-width:none!important}
  }

  /* Echtes Mobile: Phone-Chrome drumherum. */
  @media(max-width:720px){
    .slide-visual{background:transparent;border:0;padding:0;height:auto;min-height:0;max-height:none}
    .slide-visual::before{
      content:"9:41   ·   fynoAI";
      display:block;
      font-family:"Geist Mono",monospace;
      font-size:11px;
      color:#fff;
      padding:12px 20px 10px;
      background:#0a0b1a;
      border-radius:32px 32px 0 0;
      text-align:center;
      letter-spacing:0.08em;
      font-weight:500;
    }
    .slide-visual::after{
      content:"";
      display:block;
      position:relative;
      height:64px;
      background:#fff url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 64'><g fill='none' stroke='%23cbd5e1' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><rect x='22' y='18' width='14' height='14' rx='2'/><path d='M22 40 h14' stroke='%23cbd5e1' stroke-width='2'/><rect x='82' y='16' width='14' height='18' rx='2'/><path d='M82 40 h14'/><circle cx='160' cy='28' r='14' fill='%234f6bff' stroke='%234f6bff'/><text x='160' y='33' text-anchor='middle' fill='white' font-family='Geist Mono, monospace' font-size='12' font-weight='700'>B</text><path d='M150 56 h20' stroke='%234f6bff' stroke-width='2'/><rect x='222' y='18' width='16' height='12' rx='2'/><path d='M220 24 l8 6 8-6'/><path d='M222 40 h14'/><circle cx='298' cy='24' r='2'/><circle cx='290' cy='24' r='2'/><circle cx='282' cy='24' r='2'/><path d='M282 40 h16'/></g></svg>") no-repeat center/contain;
      border-radius:0 0 32px 32px;
      border-top:1px solid var(--line);
      flex-shrink:0;
    }
    .slide-visual > *:not(.vis-topbar){padding:0;background:#fff;flex:1 1 auto;min-height:0;overflow:hidden}
    .vis-body{padding:0 14px 14px;gap:8px}
    .vis-topbar{margin:0!important;padding:14px 16px!important;background:#fff;border-bottom:1px solid var(--line)!important}
    .vis-topbar .vis-stat{display:none}
    .slide-visual{box-shadow:0 20px 60px -20px rgba(10,11,26,.3);width:min(var(--mobile-mockup-width),calc(100vw - 32px));max-width:min(var(--mobile-mockup-width),calc(100vw - 32px));height:auto!important;min-height:0;max-height:none;margin:0 auto;overflow:hidden;border-radius:36px;border:10px solid #0a0b1a;background:#fff;display:flex;flex-direction:column}
    .slide-visual::before{border-radius:0;margin:-10px -10px 0;padding:14px 20px 12px}
    .slide-visual::after{border-radius:0;margin:0 -10px -10px}
  }

  /* Architektur-Slider: rechte Spalte = .arch-mockup-stack.
     Desktop/Tablet: stretch → .slide-visual fuellt volle Grid-Spaltenbreite.
     Phone (≤720px): auf Mockup-Breite zentriert. */
  .slide.slide--arch{align-items:start}
  .arch-mockup-stack{display:flex;flex-direction:column;align-items:stretch;gap:14px;width:100%;max-width:100%;min-width:0;margin:0 auto}
  @media(max-width:720px){.arch-mockup-stack{align-items:center;max-width:min(var(--mobile-mockup-width),calc(100vw - 32px))}}
  .arch-mockup-stack .vis-caption--arch{width:100%;margin:0;padding:10px 8px 0;text-align:center;background:transparent!important;border:0;box-shadow:none}
  .slide-nav{display:flex;justify-content:space-between;align-items:center;margin-top:16px}
  .slide-dots{display:flex;gap:6px}
  .slide-dots button{width:8px;height:8px;border-radius:99px;background:var(--line-2);cursor:pointer;border:0}
  .slide-dots button.active{width:24px;background:var(--ink)}
  .slide-arrows{display:flex;gap:6px}
  .slide-arrows button{width:36px;height:36px;border-radius:99px;border:1px solid var(--line);display:grid;place-items:center;background:#fff}
  .slide-arrows button:hover{background:#f3f3f5}

  /* pillar tints */
  .tab[data-p="work"].active{box-shadow:inset 0 3px 0 var(--work)}
  .tab[data-p="finance"].active{box-shadow:inset 0 3px 0 var(--finance)}
  .tab[data-p="modules"].active{box-shadow:inset 0 3px 0 var(--modules)}
  .tab[data-p="basics"].active{box-shadow:inset 0 3px 0 var(--basics)}
  .tint-work li::before{background:var(--work)}.tint-work .status{background:#dbeafe;color:var(--work)}
  .tint-finance li::before{background:var(--finance)}.tint-finance .status{background:#ffedd5;color:var(--finance)}
  .tint-modules li::before{background:var(--modules)}.tint-modules .status{background:#ede9fe;color:var(--modules)}
  .tint-basics li::before{background:var(--basics)}.tint-basics .status{background:#d1faf5;color:var(--basics)}

  /* Geplant-Status: eigener Amber-Ton statt Pillar-Farbe (unterscheidet „Live" deutlich). */
  .slide-text .status.status--planned{background:#fef3c7!important;color:#b45309!important}
  .vis-topbar .vis-stat.vis-stat--planned{background:#fef3c7;color:#b45309}
  .vis-topbar .vis-stat.vis-stat--planned::before{background:#d97706;animation:none}

  @media(max-width:860px){.slide{grid-template-columns:1fr;padding:24px;gap:24px}}

  /* Mock visuals for pillar slider */
  .vis-header{font-size:12px;color:var(--muted);font-family:"Geist Mono",monospace;text-transform:uppercase;letter-spacing:0.1em;margin-bottom:12px}
  .kanban{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;flex:1 1 auto!important;min-height:0}
  .kanban .col{background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px;display:flex;flex-direction:column;gap:8px;min-height:0;overflow:hidden}
  .kanban .col :is(h6, .vis-h){font-size:11px;font-weight:600;font-family:"Geist Mono",monospace;text-transform:uppercase;letter-spacing:0.1em;margin:0;color:var(--muted)}
  .kanban .card{background:#f5f6f9;border:1px solid var(--line);border-radius:8px;padding:8px 10px;font-size:12px}
  .kanban .card .tag{font-size:9px;font-family:"Geist Mono",monospace;padding:1px 6px;border-radius:4px;margin-left:6px}
  /* slide nur bei 3-Spalten-Layout — bei 1 Spalte (Mobil) überlagert translate() die nächsten Zeilen */
  .kanban .card.moving{background:#eef1ff;border-color:#bfcaff;box-shadow:0 8px 20px rgba(79,107,255,.2)}
  @media (min-width: 861px) {
    .kanban .card.moving { animation: slide 8s ease-in-out infinite; }
  }
  @keyframes slide{0%,15%{transform:translate(0,0)}40%,55%{transform:translate(110%,0)}80%,100%{transform:translate(220%,0)}}

  /* Sprint-Stats — kompakte Pill-Reihe über dem Retro-Board (fynoSprints) */
  .sprint-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;flex:0 0 auto}
  .sprint-stat{background:#fff;border:1px solid var(--line);border-radius:10px;padding:8px 10px;display:flex;flex-direction:column;gap:2px;min-width:0}
  .sprint-stat span{font-size:10px;font-family:"Geist Mono",monospace;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
  .sprint-stat b{font-size:13px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

  .email-list{display:flex;flex-direction:column;gap:6px;flex:1;font-size:12px}
  .email-row{background:#fff;border:1px solid var(--line);border-radius:8px;padding:10px 12px;display:flex;gap:10px;align-items:center}
  .email-row .who{font-weight:500;min-width:100px}
  .email-row .subj{flex:1;color:var(--ink-2)}
  .email-row .lbl{font-size:10px;font-family:"Geist Mono",monospace;padding:2px 6px;border-radius:4px}
  .lbl-invoice{background:#ffedd5;color:#c2410c}
  .lbl-support{background:#dbeafe;color:#1d4ed8}
  .lbl-spam{background:#f1f5f9;color:#64748b}
  .lbl-lead{background:#d1fae5;color:#047857}
  .email-row.new{animation:fadein .6s}
  @keyframes fadein{from{opacity:0;transform:translateY(-8px)}to{opacity:1}}

  .chart{flex:1;display:flex;align-items:flex-end;gap:6px;padding:10px;border:1px solid var(--line);background:#fff;border-radius:10px}
  .chart .bar{flex:1;background:linear-gradient(180deg,var(--ai),#a5b4ff);border-radius:6px 6px 0 0}

  .invoice{background:#fff;border:1px solid var(--line);border-radius:10px;padding:14px;display:flex;flex-direction:column;gap:6px;font-size:12px;flex:1}
  .invoice .row{display:flex;justify-content:space-between;border-bottom:1px dashed #eef0f5;padding:6px 0}
  .invoice .row:last-child{border:0;font-weight:700;margin-top:6px}

  .cal{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;flex:1;font-size:11px;font-family:"Geist Mono",monospace}
  .cal .day{background:#fff;border:1px solid var(--line);border-radius:8px;padding:8px 6px;display:flex;flex-direction:column;gap:4px;position:relative}
  .cal .day :is(h6, .vis-h){font-size:9px;color:var(--muted);margin:0 0 4px}
  .cal .evt{background:#dbeafe;color:#1d4ed8;padding:4px 6px;border-radius:4px;font-size:10px}
  .cal .evt.conflict{background:#fee2e2;color:#b91c1c}

  .chat{display:flex;flex-direction:column;gap:8px;flex:1;font-size:13px}
  .chat .ch{background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px 14px;max-width:85%}
  .chat .ch.user{background:#eef1ff;border-color:#d7deff;align-self:flex-end}
  .chat .ch .t{font-size:10px;color:var(--muted);font-family:"Geist Mono",monospace;margin-bottom:4px}

  /* Slack-style chat workspace */
  .chat-workspace{display:grid;grid-template-columns:140px 1fr;flex:1;background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden;min-height:0}
  .chw-side{background:#fafafb;color:#32364d;padding:12px 10px;font-size:12px;display:flex;flex-direction:column;gap:2px;overflow:hidden;border-right:1px solid var(--line)}
  .chw-ws{display:flex;gap:8px;align-items:center;padding:4px 6px;margin-bottom:8px;border-bottom:1px solid var(--line);padding-bottom:10px}
  .chw-ws-logo{width:26px;height:26px;border-radius:6px;background:var(--ai);color:#fff;display:grid;place-items:center;font-weight:700;font-size:10px;font-family:"Geist Mono",monospace}
  .chw-group{font-size:9px;font-family:"Geist Mono",monospace;letter-spacing:0.14em;text-transform:uppercase;color:#9a9fb1;padding:10px 6px 4px}
  .chw-item{padding:5px 8px;border-radius:5px;font-size:12px;color:#5a5f74;display:flex;align-items:center;gap:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .chw-item.active{background:#eef1ff;color:var(--ai);font-weight:500}
  .chw-item.dm{padding-left:4px}
  .chw-item.guest{color:#047857}
  .chw-bdg{background:#ef4444;color:#fff;font-size:9px;padding:1px 5px;border-radius:99px;margin-left:auto;font-weight:600}
  .chw-guest{font-size:8px;font-family:"Geist Mono",monospace;background:#d1fae5;color:#047857;padding:1px 5px;border-radius:3px;margin-left:auto}
  .chw-av{width:20px;height:20px;border-radius:4px;background:#64748b;color:#fff;display:inline-grid;place-items:center;font-weight:700;font-size:10px;font-family:"Geist Mono",monospace;flex-shrink:0}
  .chw-av.bruno-av{background:linear-gradient(135deg,#4f6bff,#8b5cf6)}
  .chw-main{display:flex;flex-direction:column;min-width:0;background:#fff}
  .chw-head{padding:10px 14px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;background:#fff}
  .chw-pill{background:#fafafb;border:1px solid var(--line);padding:4px 8px;border-radius:6px;font-size:10px;color:var(--muted)}
  .chw-msgs{padding:14px;display:flex;flex-direction:column;gap:14px;overflow:hidden;flex:1}
  .chw-m{display:flex;gap:10px;align-items:flex-start}
  .chw-m .chw-av{width:28px;height:28px;font-size:11px;border-radius:6px}
  .chw-body{flex:1;min-width:0}
  .chw-meta{font-size:11px;color:var(--muted);margin-bottom:3px;display:flex;gap:6px;align-items:center;flex-wrap:wrap}
  .chw-meta b{color:var(--ink);font-weight:600;font-size:12px}
  .chw-ext{background:#d1fae5;color:#047857;padding:1px 5px;border-radius:4px;font-size:9px;font-family:"Geist Mono",monospace}
  .chw-ai{background:linear-gradient(135deg,#eef1ff,#f3e8ff);color:var(--ai);padding:1px 6px;border-radius:4px;font-size:9px;font-family:"Geist Mono",monospace;font-weight:600}
  .chw-text{font-size:12.5px;color:var(--ink-2);line-height:1.5}
  .chw-text code{font-family:"Geist Mono",monospace;background:#eef1ff;padding:1px 4px;border-radius:3px;font-size:11px;color:var(--ai)}
  .chw-attach{margin-top:6px;background:#fafafb;border:1px dashed var(--line-2);border-radius:6px;padding:6px 10px;font-size:11px;color:var(--muted);display:inline-flex;gap:6px;align-items:center;font-family:"Geist Mono",monospace}
  .chw-attach::before{content:"□"}
  .bruno-m .chw-body{background:linear-gradient(135deg,#eef1ff,#faf5ff);border:1px solid #d7deff;border-radius:8px;padding:10px 12px}
  .chw-actions{display:flex;gap:4px;margin-top:6px;flex-wrap:wrap}
  .chw-ac{background:#fff;border:1px solid #d7deff;color:var(--ai);padding:3px 8px;border-radius:6px;font-size:11px;font-weight:500;cursor:default}
  .chw-dots{display:inline-flex;gap:3px;padding:6px 0}
  .chw-dots span{width:6px;height:6px;border-radius:99px;background:#9a9fb1;animation:cd 1.4s infinite ease-in-out}
  .chw-dots span:nth-child(2){animation-delay:.2s}
  .chw-dots span:nth-child(3){animation-delay:.4s}
  @keyframes cd{0%,80%,100%{opacity:.3;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
  .chw-input{margin:0 14px 12px;padding:10px 12px;background:#fafafb;border:1px solid var(--line);border-radius:8px;display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted)}
  .chw-input b{color:var(--ink);font-weight:500}
  .chw-plus{font-weight:700;color:var(--muted)}
  .chw-at{margin-left:auto;background:#eef1ff;color:var(--ai);padding:2px 8px;border-radius:5px;font-family:"Geist Mono",monospace;font-size:10px;font-weight:600}

  .files{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;flex:1}
  .file{background:#fff;border:1px solid var(--line);border-radius:10px;padding:14px 10px;text-align:center;font-size:11px}
  .file .ic{font-size:22px;margin-bottom:6px}

  /* fynoDrive — folder tree with Bruno-auto folders */
  .drive{flex:1;background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden;display:flex;flex-direction:column;min-height:0}
  .drive-bread{padding:10px 14px;border-bottom:1px solid var(--line);background:#fafafb;font-size:11px;color:var(--muted);font-family:"Geist Mono",monospace}
  .drive-bread b{color:var(--ink);font-weight:600}
  .drive-bread span{margin:0 6px;opacity:.5}
  .drive-grid{flex:1;display:grid;grid-template-columns:160px 1fr;min-height:0}
  .drive-side{background:#fafafb;padding:10px 8px;border-right:1px solid var(--line);font-size:12px;overflow:hidden}
  .drive-group{font-size:9px;font-family:"Geist Mono",monospace;letter-spacing:0.14em;text-transform:uppercase;color:#9a9fb1;padding:8px 6px 4px}
  .drive-row{display:flex;align-items:center;gap:6px;padding:5px 8px;border-radius:5px;color:#32364d;font-size:12px}
  .drive-row.active{background:#eef1ff;color:var(--ai);font-weight:500}
  .drive-ic{font-size:14px;line-height:1}
  .drive-ic.folder-ai{filter:hue-rotate(180deg) saturate(1.6)}
  .drive-badge{font-size:8px;font-family:"Geist Mono",monospace;background:#eef1ff;color:var(--ai);padding:1px 5px;border-radius:3px;margin-left:auto;font-weight:600}
  .drive-main{padding:10px;display:grid;grid-template-columns:repeat(2,1fr);gap:8px;align-content:start;overflow:hidden}
  .drive-item{background:#fff;border:1px solid var(--line);border-radius:8px;padding:10px 10px;display:flex;gap:10px;align-items:center;min-width:0}
  .drive-fi{width:32px;height:32px;border-radius:7px;display:grid;place-items:center;flex-shrink:0}
  .drive-fi.green{background:#d1fae5;color:#059669}
  .drive-fi.blue{background:#dbeafe;color:#1d4ed8}
  .drive-fi.violet{background:#ede9fe;color:#6d28d9}
  .drive-fi.orange{background:#ffedd5;color:#c2410c}
  .drive-name{font-size:12px;font-weight:500;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .drive-meta{font-size:10px;color:var(--muted);font-weight:400;font-family:"Geist Mono",monospace;margin-top:2px}
  .drive-bruno-note{margin:0 10px 10px;background:linear-gradient(135deg,#eef1ff,#faf5ff);border:1px solid #d7deff;border-radius:8px;padding:8px 10px;display:flex;gap:8px;align-items:center;font-size:11px;color:var(--ink-2)}
  .drive-bruno-note b{color:var(--ai);font-family:"Geist Mono",monospace;font-weight:600;font-size:10px}

  /* Docs editor (Google-Docs-like) */
  .docs-editor{flex:1;background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden;display:flex;flex-direction:column;min-height:0}
  .de-toolbar{display:flex;gap:14px;padding:8px 12px;border-bottom:1px solid var(--line);background:#fafafb;font-size:11px;color:var(--muted);align-items:center}
  .de-av{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:99px;background:#64748b;color:#fff;font-weight:700;font-size:10px;font-family:"Geist Mono",monospace}
  .de-av.bruno-av{background:linear-gradient(135deg,#4f6bff,#8b5cf6)}
  .de-share{background:var(--ai);color:#fff;padding:3px 10px;border-radius:6px;font-size:10px;margin-left:6px;font-weight:500}
  .de-style{display:flex;gap:8px;padding:6px 12px;border-bottom:1px solid var(--line);background:#fff;font-size:11px;color:var(--muted)}
  .de-style span{cursor:default}
  .de-style span:first-child{font-weight:700;color:var(--ink)}
  .de-page{flex:1;padding:18px 22px;overflow:hidden;background:#fff;position:relative}
  .de-h1{font-size:16px;font-weight:700;margin:0 0 8px;letter-spacing:-0.01em}
  .de-h2{font-size:13px;font-weight:600;margin:10px 0 4px}
  .de-p{font-size:12px;line-height:1.55;color:var(--ink-2);margin:0 0 8px}
  .de-cursor{color:var(--ai);animation:blink 1s infinite}
  @keyframes blink{50%{opacity:0}}
  .de-suggest{background:linear-gradient(135deg,#eef1ff,#faf5ff);border:1px solid #d7deff;border-radius:8px;padding:8px 10px;margin:6px 0;font-size:11px}
  .de-sug-meta{display:flex;gap:6px;align-items:center;margin-bottom:4px;color:var(--muted);font-size:10px}
  .de-sug-meta b{color:var(--ai);font-size:10px;font-family:"Geist Mono",monospace;font-weight:600}
  .de-sug-text{color:var(--ink-2);font-size:11.5px;font-style:italic}
  .de-comment{position:absolute;right:12px;bottom:12px;background:#fffbeb;border:1px solid #fcd34d;border-radius:8px;padding:6px 10px;display:flex;gap:8px;max-width:200px}
  .de-comment .de-av{width:18px;height:18px;font-size:9px}

  .vault{display:flex;flex-direction:column;gap:6px;flex:1;font-size:12px;font-family:"Geist Mono",monospace}
  .vault .row{background:#fff;border:1px solid var(--line);border-radius:8px;padding:8px 12px;display:flex;justify-content:space-between;align-items:center}
  .vault .mask{letter-spacing:0.2em;color:var(--muted)}

  .ports{background:#fff;border:1px solid var(--line);border-radius:10px;padding:14px;flex:1;font-size:12px}
  .ports h6{font-size:11px;font-family:"Geist Mono",monospace;color:var(--muted);margin:0 0 10px}

  .meet{background:#1a1d3e;border-radius:10px;flex:1 1 auto!important;display:grid;grid-template-columns:2fr 1fr;gap:6px;padding:8px;min-height:0}
  .meet .tile{background:#2a2e55;border-radius:6px;display:grid;place-items:center;color:#fff;font-weight:700;font-family:"Geist Mono",monospace}

  .bi{background:#fff;border:1px solid var(--line);border-radius:10px;padding:14px;flex:1;display:flex;flex-direction:column;gap:10px}
  .bi :is(h6, .vis-h){font-size:11px;font-family:"Geist Mono",monospace;color:var(--muted);margin:0}
  .bi .bigval{font-size:28px;font-weight:700;letter-spacing:-0.02em}
  .bi .delta{font-size:11px;color:var(--ok);font-family:"Geist Mono",monospace}

  /* === FEATURES === */
  .feature{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;padding:60px 0;border-bottom:1px solid var(--line)}
  .feature:last-child{border-bottom:0}
  .feature.rev{direction:rtl}
  .feature.rev > *{direction:ltr}
  .feature h3{font-size:32px;letter-spacing:-0.025em;margin:14px 0 16px}
  .feature p{color:var(--muted);font-size:17px}
  .feature-vis-wrap{display:flex;flex-direction:column;align-items:stretch;width:100%}
  /* Gleiche Desktop-Hoehe wie .slide-visual → Funktionen-Visuals konsistent. */
  .feature-vis{background:#fff;border:1px solid var(--line);border-radius:14px;padding:24px;height:480px;min-height:480px;max-height:480px;display:flex;flex-direction:column;overflow:hidden}
  .vis-caption{font-size:11px;color:var(--muted);font-family:"Geist Mono",monospace;text-align:center;line-height:1.4;margin:0;padding:10px 6px 0}
  /* Tablet: 1-Col, Hoehe bleibt Desktop (konsistent mit Architektur-Slider). */
  @media(max-width:860px){.feature,.feature.rev{grid-template-columns:1fr;direction:ltr;gap:24px}}
  /* Phone: Feature-Vis auf Phone-Body-Hoehe (scrollbar) — passt zum Phone-Chrome-Mockup. */
  @media(max-width:720px){.feature-vis{height:auto;min-height:var(--mobile-mockup-body-height,400px);max-height:var(--mobile-mockup-body-height,400px);overflow-y:auto;-webkit-overflow-scrolling:touch}}

  /* === COMPARE (unified table) === */
  .cmp{margin-top:48px;border-radius:18px;overflow:hidden;border:1px solid var(--line);background:#fff}
  .cmp-head,.cmp-row{display:grid;grid-template-columns:220px 1fr 1fr;gap:0}
  .cmp-head{background:#fafafb;border-bottom:1px solid var(--line)}
  .cmp-h{padding:16px 24px;font-family:"Geist Mono",monospace;font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:var(--muted);font-weight:500}
  .cmp-h-new{background:linear-gradient(155deg,#0a0b1a 0%,#1a1d3e 100%);color:#fff;font-weight:600}
  .cmp-row{border-bottom:1px solid var(--line);align-items:stretch}
  .cmp-row:last-child{border-bottom:0}
  .cmp-cat,.cmp-old,.cmp-new{padding:14px 24px;font-size:14px;display:flex;align-items:center;gap:10px}
  .cmp-cat{font-weight:500;color:var(--ink)}
  .cmp-old{color:var(--muted);text-decoration:line-through;text-decoration-color:rgba(0,0,0,.25)}
  .cmp-new{background:linear-gradient(155deg,#0a0b1a 0%,#1a1d3e 100%);color:#fff;font-weight:500}
  .cmp-chk{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:99px;background:var(--ai);color:#fff;font-size:10px;font-weight:700;flex-shrink:0}
  .cmp-total .cmp-cat{background:#fafafb;font-family:"Geist Mono",monospace;letter-spacing:0.04em;font-size:13px}
  .cmp-total .cmp-old{background:#fafafb;color:var(--err);text-decoration:none;font-family:"Geist Mono",monospace;font-size:13px}
  .cmp-total .cmp-new{font-family:"Geist Mono",monospace;font-size:13px;background:linear-gradient(155deg,#4f6bff,#8b5cf6)}
  @media(max-width:860px){
    .cmp{background:transparent;border:0;border-radius:0}
    .cmp-head{display:none}
    .cmp-row{display:block;background:#fff;border:1px solid var(--line);border-radius:12px;margin-bottom:12px;overflow:hidden;padding:0}
    .cmp-cat{background:#fafafb;font-size:13px;font-family:"Geist Mono",monospace;letter-spacing:0.08em;text-transform:uppercase;color:var(--muted);padding:10px 16px;border-bottom:1px solid var(--line)}
    .cmp-old,.cmp-new{padding:12px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px}
    .cmp-old{border-bottom:1px solid var(--line)}
    .cmp-old::before{content:"Alter Weg";font-family:"Geist Mono",monospace;font-size:9px;letter-spacing:0.14em;text-transform:uppercase;color:#9ca3af;font-weight:500;flex-shrink:0}
    .cmp-new{background:linear-gradient(155deg,#0a0b1a 0%,#1a1d3e 100%)}
    .cmp-new::before{content:"Mit fynoAI";font-family:"Geist Mono",monospace;font-size:9px;letter-spacing:0.14em;text-transform:uppercase;color:#8b93c2;font-weight:500;flex-shrink:0}
    .cmp-total .cmp-cat,.cmp-total .cmp-old,.cmp-total .cmp-new{text-transform:none;letter-spacing:0}
  }

  /* === TEAM === */
  .team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:48px}
  .person{background:#fff;border:1px solid var(--line);border-radius:16px;padding:28px;display:flex;flex-direction:column;gap:14px}
  .ph{width:100%;aspect-ratio:4/5;border-radius:12px;background:linear-gradient(135deg,#eef1ff,#f5f6f9);display:grid;place-items:center;color:var(--muted);font-family:"Geist Mono",monospace;font-size:12px;border:1px dashed var(--line-2);position:relative;overflow:hidden}
  .ph::before{content:"";position:absolute;inset:0;background-image:repeating-linear-gradient(45deg,transparent 0 10px,rgba(79,107,255,.04) 10px 11px)}
  .ph .initials{font-size:48px;font-weight:700;color:#bcc2d8;letter-spacing:-0.02em}
  .person .role{font-family:"Geist Mono",monospace;font-size:11px;color:var(--ai);letter-spacing:0.1em;text-transform:uppercase}
  .person h4{font-size:22px;letter-spacing:-0.02em;font-weight:600}
  .person .tag-row{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
  .person .tag-row span{font-size:11px;border:1px solid var(--line);padding:3px 8px;border-radius:99px;color:var(--muted);font-family:"Geist Mono",monospace}
  .mission{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:60px;padding:40px;background:#0a0b1a;color:#fff;border-radius:16px}
  .mission .k{font-family:"Geist Mono",monospace;font-size:11px;letter-spacing:0.14em;color:#8b93c2;text-transform:uppercase;margin-bottom:8px}
  .mission p{color:#d1d5ea;font-size:17px;line-height:1.5}
  @media(max-width:860px){.team-grid,.mission{grid-template-columns:1fr}}

  /* === LOGOS === */
  .logos{margin-top:60px;display:grid;gap:20px}
  .logos.big3{grid-template-columns:repeat(3,1fr)}
  .logos.grid8{grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--line);border-radius:16px;background:#fff}
  .lg-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:40px;display:grid;place-items:center;min-height:120px}
  .logos.grid8 .lg-card{border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:0;padding:28px}
  .logos.grid8 .lg-card:nth-child(4n){border-right:0}
  .logos.grid8 .lg-card:nth-last-child(-n+4){border-bottom:0}
  .lg-card .lg{font-weight:800;font-size:20px;letter-spacing:-0.03em;color:var(--ink);font-family:"Geist",sans-serif}
  .logo-layout-toggle{display:inline-flex;border:1px solid var(--line);border-radius:10px;padding:3px;background:#fff;gap:2px}
  .logo-layout-toggle button{padding:8px 14px;font-size:12px;border-radius:7px;font-family:"Geist Mono",monospace}
  .logo-layout-toggle button.active{background:var(--ink);color:#fff}
  @media(max-width:860px){.logos.big3,.logos.grid8{grid-template-columns:repeat(2,1fr)}.logos.grid8 .lg-card{border-right:1px solid var(--line)!important;border-bottom:1px solid var(--line)!important}}

  /* === FAQ === */
  .faq{margin-top:40px}
  .faq-item{border-bottom:1px solid var(--line)}
  .faq-item summary{list-style:none;cursor:pointer;padding:22px 0;display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:17px;font-weight:500;letter-spacing:-0.01em}
  .faq-item summary::-webkit-details-marker{display:none}
  .faq-item summary::after{content:"+";font-size:24px;color:var(--muted);font-weight:300;transition:transform .2s}
  .faq-item[open] summary::after{content:"×"}
  .faq-item .answer{padding:0 0 26px;color:var(--muted);font-size:15px;line-height:1.65;max-width:none}
  /* Strukturierter Inhalt (HTML-Antworten) */
  .faq-item .answer > p{margin:0 0 12px}
  .faq-item .answer > p:last-child{margin-bottom:0}
  .faq-item .answer ul,
  .faq-item .answer ol{margin:4px 0 14px;padding-left:22px}
  .faq-item .answer ul li,
  .faq-item .answer ol li{margin-bottom:6px;line-height:1.6}
  .faq-item .answer ul li::marker{color:var(--ai, #4f6bff)}
  .faq-item .answer strong{color:var(--ink);font-weight:600}
  .faq-item .answer code{font-family:'Geist Mono',monospace;font-size:13px;padding:2px 6px;background:var(--app-gray-100, #f3f4f6);border-radius:4px;color:var(--ink)}

  /* === BETA FORM === */
  .beta-section{background:var(--navy);color:#fff;padding:140px 0}
  .beta-section h2{color:#fff}
  .beta-section .eyebrow{color:#8b93c2}
  .beta-sub{color:#b8bcd9;font-size:19px;margin-top:22px;max-width:640px}
  .beta-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:48px}
  .field{display:flex;flex-direction:column;gap:6px}
  .field label{font-size:13px;color:#c8cde5;font-family:"Geist Mono",monospace;letter-spacing:0.04em}
  .field label .req{color:#ff9d5c}
  .field input,.field select,.field textarea{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);color:#fff;padding:12px 14px;border-radius:10px;font-family:inherit;font-size:15px;outline:none;transition:.15s}
  .field input:focus,.field select:focus,.field textarea:focus{border-color:var(--ai);background:rgba(79,107,255,.08)}
  .field input::placeholder,.field textarea::placeholder{color:#5a5f8a}
  .field.full{grid-column:span 2}
  .field .err{color:#ff9d5c;font-size:12px;font-family:"Geist Mono",monospace}
  .modules-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
  .modules-grid label{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.1);padding:10px 12px;border-radius:8px;cursor:pointer;font-size:13px;font-family:inherit;color:#d1d5ea}
  .modules-grid label:hover{background:rgba(255,255,255,.06)}
  .modules-grid label.active{background:rgba(79,107,255,.15);border-color:var(--ai);color:#fff}
  .modules-grid input{display:none}
  .size-row{display:flex;gap:8px;flex-wrap:wrap}
  .size-row label{padding:10px 16px;border:1px solid rgba(255,255,255,.12);border-radius:8px;cursor:pointer;font-size:13px;background:rgba(255,255,255,.03)}
  .size-row input{display:none}
  .size-row label.active{background:var(--ai);border-color:var(--ai);color:#fff}
  .check-row{display:flex;gap:10px;align-items:flex-start;color:#b8bcd9;font-size:13px;line-height:1.5}
  .check-row input{margin-top:3px}
  @media(max-width:860px){.beta-grid{grid-template-columns:1fr}.field.full{grid-column:1}.modules-grid{grid-template-columns:repeat(2,1fr)}}

  /* === FOOTER === */
  footer{background:#050610;color:#8b93c2;padding:80px 0 30px}
  .f-grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:40px}
  footer h6{color:#fff;font-size:13px;margin-bottom:16px;font-family:"Geist Mono",monospace;letter-spacing:0.08em;text-transform:uppercase;font-weight:500}
  footer ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
  footer a{color:#8b93c2;font-size:14px}
  footer a:hover{color:#fff}
  .f-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:60px;padding-top:24px;border-top:1px solid rgba(255,255,255,.08);flex-wrap:wrap;gap:10px;font-size:12px;font-family:"Geist Mono",monospace}
  @media(max-width:860px){.f-grid{grid-template-columns:1fr 1fr}}

  /* === FLOATING BUTTON === */
  .float-btn{position:fixed;bottom:24px;right:24px;background:var(--ink);color:#fff;padding:14px 20px;border-radius:99px;font-size:14px;font-weight:500;display:flex;gap:8px;align-items:center;box-shadow:0 10px 30px rgba(10,11,26,.3);z-index:40;cursor:pointer;opacity:0;transform:translateY(20px);transition:opacity .3s, transform .3s}
  .float-btn.show{opacity:1;transform:none}

  /* === MODAL === */
  .modal-bg{position:fixed;inset:0;background:rgba(10,11,26,.7);backdrop-filter:blur(6px);z-index:100;display:grid;place-items:center;padding:20px;opacity:0;pointer-events:none;transition:.2s}
  .modal-bg.open{opacity:1;pointer-events:auto}
  .modal{background:#fff;border-radius:18px;max-width:640px;width:100%;max-height:90vh;overflow:auto;padding:32px;transform:translateY(10px);transition:.2s}
  .modal-bg.open .modal{transform:none}
  .modal h3{font-size:26px;letter-spacing:-0.02em}
  .modal .close{position:absolute;top:16px;right:16px;width:32px;height:32px;border-radius:99px;background:#f3f3f5;display:grid;place-items:center}
  .calc-field{margin-top:18px}
  .calc-field .row{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
  .calc-field label{font-size:13px;font-weight:500}
  .calc-field .v{font-family:"Geist Mono",monospace;font-weight:600}
  .calc-field input[type=range]{width:100%;-webkit-appearance:none;height:6px;background:var(--line);border-radius:99px;outline:none}
  .calc-field input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:99px;background:var(--ai);cursor:pointer;border:3px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.15)}
  .calc-output{margin-top:28px;background:linear-gradient(135deg,#eef1ff,#fff);border:1px solid #d7deff;border-radius:14px;padding:24px}
  .calc-output :is(h3, h4){font-size:12px;font-family:"Geist Mono",monospace;color:var(--ai);letter-spacing:0.14em;text-transform:uppercase;margin-bottom:16px}
  .calc-output .big-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
  .calc-output .big{font-size:36px;font-weight:700;letter-spacing:-0.025em}
  .calc-output .big-label{font-size:12px;color:var(--muted);margin-top:2px}
  .calc-output .team{margin-top:20px;padding-top:20px;border-top:1px dashed #d7deff;font-size:14px;color:var(--muted)}

  /* === GLOBAL MOBILE OPTIMIZATIONS === */
  @media(max-width:720px){
    .section{padding:72px 0}
    .container,.container-sm{padding:0 18px}
    h1{font-size:40px!important;line-height:1.05}
    h2{font-size:28px!important}
    h3{font-size:20px}
    .hero{padding:48px 0 32px}
    .hero-pre{font-size:10px;padding:6px 11px;margin-bottom:20px}
    .hero-sub{font-size:16px}
    .hero-ctas{flex-direction:column;align-items:stretch}
    .hero-ctas .btn{justify-content:center}
    .bruno-spot{padding:80px 0}
    .bruno-spot-sub{font-size:16px}
    .beta-section{padding:72px 0}
    .beta-sub{font-size:16px}
    .orbit-wrap{height:320px;margin-top:32px}
    .agent{font-size:10px;padding:5px 9px}
    .agent svg{width:11px;height:11px;flex-shrink:0}
    .orbit-center{width:72px;height:72px;border-radius:18px;font-size:13px}
    .ring1{width:180px;height:180px}
    .ring2{width:280px;height:280px}
    /* Show only 6 agents on mobile, reposition for clarity */
    .agent:nth-child(10),.agent:nth-child(11){display:none}
    /* Reposition the 6 visible pills in a cleaner clock around the center */
    .agent:nth-child(4){left:50%!important;top:2%!important;transform:translateX(-50%)!important;right:auto!important}
    .agent:nth-child(5){right:2%!important;top:34%!important;left:auto!important;transform:none!important}
    .agent:nth-child(6){right:2%!important;bottom:34%!important;left:auto!important;top:auto!important;transform:none!important}
    .agent:nth-child(7){left:50%!important;bottom:2%!important;transform:translateX(-50%)!important;right:auto!important;top:auto!important}
    .agent:nth-child(8){left:2%!important;bottom:34%!important;top:auto!important;right:auto!important;transform:none!important}
    .agent:nth-child(9){left:2%!important;top:34%!important;right:auto!important;transform:none!important}
    .data-flow{display:flex;flex-direction:column;gap:6px;font-size:12px;margin-top:32px}
    .df{padding:12px 14px;min-width:0;display:flex;align-items:center;justify-content:space-between;gap:10px;text-align:left}
    .df .k{font-size:9px;letter-spacing:0.12em}
    .df .v{font-size:13px;margin-top:0;flex:1;text-align:right}
    .df-arrow{display:none}
    .basics-bar{padding:14px;gap:4px}
    .basic-card{padding:10px 4px}
    .basic-card .t{font-size:12px}
    .basic-card .u{font-size:10px}
    .problem-grid{margin-top:32px;gap:10px}
    .pain{padding:20px}
    .pain .t{font-size:16px}
    .mission{padding:24px;gap:18px}
    .mission p{font-size:15px}
    .team-grid{margin-top:32px;gap:14px}
    .person{padding:20px}
    .slide{padding:20px;gap:20px}
    .slide-text h3{font-size:24px}
    .slide-text .usp{font-size:15px}
    .tabs{gap:4px}
    .tab{padding:10px 12px;font-size:12px}
    .tab .dot{margin-right:4px;width:6px;height:6px}
    .tab .count{display:none}
    .feature{padding:36px 0;gap:18px}
    .feature h3{font-size:24px}
    .feature p{font-size:15px}
    .feature-vis{padding:16px;min-height:var(--mobile-mockup-body-height,400px);max-height:var(--mobile-mockup-body-height,400px)}
    .compare{font-size:12px}
    .compare th,.compare td{padding:10px 12px}
    .bruno-stats{grid-template-columns:1fr;gap:10px}
    .bs{padding:20px}
    .bs .n{font-size:36px}
    .beta-grid{grid-template-columns:1fr;gap:14px}
    .modules-grid{grid-template-columns:1fr 1fr}
    .size-row{gap:6px}
    .size-row label{padding:8px 12px;font-size:12px;flex:1;text-align:center}
    footer{padding:56px 0 24px}
    .f-grid{grid-template-columns:1fr 1fr;gap:28px}
    .f-bottom{flex-direction:column;align-items:flex-start;font-size:11px}
    .float-btn{bottom:16px;right:16px;padding:11px 16px;font-size:13px}
    .tweaks{right:10px;left:10px;width:auto;bottom:10px}
    .modal{padding:22px}
    .calc-output .big-grid{grid-template-columns:1fr;gap:10px}
    .calc-output .big{font-size:28px}
    .logos.big3,.logos.grid8{grid-template-columns:1fr 1fr}
    .logos.grid8 .lg-card:nth-child(2n){border-right:0!important}
    .nav-right .flag{display:none}
    .nav-right .btn{padding:10px 14px;font-size:13px}
    .hero-mockup{margin-top:36px}
    .mock{grid-template-columns:1fr!important;min-height:auto}
    .mock-side{border-right:0;border-bottom:1px solid var(--line);padding:12px;display:flex;flex-wrap:wrap;gap:4px}
    .mock-side h6,.mock-side .logo-mini{display:none}
    .mock-side .item{padding:5px 8px;font-size:11px}
    .mock-side .item:nth-child(n+8){display:none}
    .mock-body{padding:14px}
    .mock-h1{font-size:16px}
    .mock-top{flex-direction:column;align-items:flex-start;gap:10px}
    .mock-top .search{max-width:none;width:100%}
    .kpi-row{grid-template-columns:1fr 1fr;gap:8px}
    .kpi{padding:10px}
    .kpi .value{font-size:18px}
    .mock-grid{grid-template-columns:1fr}
    body[data-hero="split"] .hero-inner,body[data-hero="compact"] .hero-inner{grid-template-columns:1fr;gap:28px}
    body[data-hero="split"] .hero-mockup::after{display:none}
    body[data-hero="compact"] .hero-visual{max-width:280px;margin:0 auto}
    .feature.rev,.feature{grid-template-columns:1fr;direction:ltr}
    .bento{gap:10px}
    .b{padding:22px}
    .b h3{font-size:20px}
    .b-bruno{padding:24px}
    .b-bruno h3{font-size:24px}
    .b-bruno .b-bruno-visual{max-height:160px}
    .usp-strip{grid-template-columns:1fr!important}
    .usp{border-right:0!important;border-bottom:1px solid var(--line);padding:20px 22px}
    .usp:last-child{border-bottom:0}
  }

  /* === TWEAKS PANEL === */
  .tweaks{position:fixed;bottom:24px;right:24px;width:320px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px;box-shadow:0 20px 60px rgba(10,11,26,.25);z-index:90;display:none}
  .tweaks.show{display:block}
  .tweaks h5{font-size:13px;font-family:"Geist Mono",monospace;letter-spacing:0.1em;text-transform:uppercase;margin-bottom:14px;display:flex;justify-content:space-between;align-items:center}
  .tweaks .t-field{margin-bottom:14px}
  .tweaks label{font-size:12px;color:var(--muted);display:block;margin-bottom:6px}
  .tweaks .t-options{display:flex;gap:6px;flex-wrap:wrap}
  .tweaks .t-options button{padding:6px 10px;border:1px solid var(--line);border-radius:8px;font-size:12px;background:#fff}
  .tweaks .t-options button.active{background:var(--ink);color:#fff;border-color:var(--ink)}
  .tweaks .t-close{background:none;font-size:18px;color:var(--muted)}

  /* === SUCCESS STATE === */
  .success{background:linear-gradient(135deg,rgba(16,185,129,.12),rgba(79,107,255,.12));border:1px solid rgba(16,185,129,.3);border-radius:16px;padding:40px;text-align:center;color:#fff}
  .success .ic{width:56px;height:56px;border-radius:99px;background:var(--ok);display:grid;place-items:center;margin:0 auto 18px;font-size:28px}

  /* === CITATION === */
  .citation{background:#fff;border:1px dashed var(--line-2);border-radius:12px;padding:18px 22px;font-size:13px;color:var(--muted);max-width:900px;margin:0 auto;font-family:"Geist Mono",monospace;line-height:1.6}
  .citation b{color:var(--ink);font-weight:600}

  /* === CONTACT MODAL (Footer-Popup, DB-only) === */
  [x-cloak]{display:none!important}
  html.contact-modal-open{overflow:hidden}
  .contact-modal{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;padding:24px}
  .contact-modal__backdrop{position:absolute;inset:0;background:rgba(10,11,20,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
  .contact-modal__card{position:relative;background:#fff;border-radius:18px;box-shadow:0 24px 60px rgba(10,11,20,.28);width:100%;max-width:560px;max-height:calc(100vh - 48px);overflow-y:auto;padding:32px 32px 28px;color:var(--ink)}
  .contact-modal__close{position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:10px;border:1px solid var(--line);background:#fff;color:var(--muted);display:grid;place-items:center;cursor:pointer;transition:all .15s ease}
  .contact-modal__close:hover{color:var(--ink);border-color:var(--ink);background:#fafafa}
  .contact-modal__title{font-size:22px;font-weight:700;margin:0 0 6px;color:var(--ink);letter-spacing:-0.01em}
  .contact-modal__sub{color:var(--muted);font-size:14px;line-height:1.5;margin:0 0 22px}

  .contact-form__row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  .contact-form__field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
  .contact-form__field label{font-size:13px;font-weight:600;color:var(--ink)}
  .contact-form__field .req{color:#ea580c;font-weight:600}
  .contact-form__field input,.contact-form__field textarea{font-family:inherit;font-size:14px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:#fafbfc;color:var(--ink);transition:border-color .15s ease, background .15s ease;width:100%;box-sizing:border-box;resize:vertical}
  .contact-form__field input:focus,.contact-form__field textarea:focus{outline:none;border-color:var(--ink);background:#fff}
  .contact-form__field textarea{min-height:120px;line-height:1.5}
  .contact-form__err{font-size:12px;color:#ea580c;margin-top:2px}
  .contact-form__err--global{margin:8px 0 0}
  .contact-form__footer{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-top:6px;flex-wrap:wrap}
  .contact-form__hint{font-size:11px;color:var(--muted);line-height:1.4;max-width:300px;margin:0}
  .contact-form__hint a{color:var(--muted);text-decoration:underline}
  .contact-form__hint a:hover{color:var(--ink)}
  .contact-form__footer .btn{margin-left:auto;flex-shrink:0}

  .contact-success{text-align:center;padding:10px 0 6px}
  .contact-success__icon{width:56px;height:56px;border-radius:99px;background:rgba(16,185,129,.15);color:#10b981;display:grid;place-items:center;margin:0 auto 16px}
  .contact-success .btn-ghost{margin-top:18px}

  .footer-contact-link{cursor:pointer}

  @media (max-width: 540px){
    .contact-modal{padding:12px}
    .contact-modal__card{padding:28px 20px 22px;border-radius:14px}
    .contact-form__row{grid-template-columns:1fr}
    .contact-form__footer{flex-direction:column-reverse;align-items:stretch}
    .contact-form__footer .btn{width:100%;margin-left:0}
    .contact-form__hint{max-width:none}
  }