.hero::before{content:none}
  .hero>*{position:relative;z-index:1}
  .eyebrow{display:inline-block;font-size:13px;font-weight:800;letter-spacing:.02em;text-transform:none;color:#fff;background:var(--grad);padding:7px 16px;border-radius:6px;margin-bottom:30px}
  .hero h1{font-size:min(clamp(46px,10.4vw,150px),calc((100vw - 56px)/9.6));line-height:.9;font-weight:900;letter-spacing:-.025em;color:var(--ink);margin:0 auto 26px}
  .hero h1 .accent{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
  .hero h1 .ol{color:transparent;-webkit-text-fill-color:transparent;-webkit-text-stroke:1.5px var(--ink);text-stroke:1.5px var(--ink)}
  .hero h1.tw{min-height:3.92em}
  .hero h1 .tw-caret::after{content:"";display:inline-block;width:.06em;height:.9em;background:var(--ink);margin-left:.05em;vertical-align:-.02em;border-radius:1px;animation:cblink 1.05s steps(1) infinite}
  .hero h1 .tw-caret.tw-done::after{animation:none;opacity:0;transition:opacity .45s ease}
  @keyframes cblink{50%{opacity:0}}
  .hero p.lede{font-size:clamp(18px,2.3vw,23px);color:var(--muted);max-width:56ch;margin:0 auto 18px;line-height:1.5;font-weight:400}
  .hero p.lede.small{font-size:clamp(16px,2vw,19px);color:var(--muted-dim);margin-bottom:42px}
  .btn-row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:32px}
  .btn{font-size:16px;font-weight:600;padding:15px 30px;border-radius:6px;transition:all .2s;display:inline-block}
  .btn-primary{background:var(--grad);color:#fff}
  .btn-primary:hover{filter:brightness(1.12);transform:translateY(-1px)}
  .btn-ghost{color:var(--ink);border:1px solid var(--line)}
  .btn-ghost:hover{border-color:var(--purple);color:#fff}

  /* arrow pills */
  .arrows{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:52px}
  .arrows .pill{font-size:14px;font-weight:600;color:var(--ink);border:1px solid var(--line);border-radius:6px;padding:10px 20px;background:var(--chip-bg)}
  .arrows .pill span{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;margin-right:7px;font-weight:800}

  /* SECTION */
  section.block{padding:104px 0}
  .section-head{text-align:center;max-width:62ch;margin:0 auto 56px}
  .section-head .kicker{font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:16px}
  .section-head h2{font-size:clamp(30px,4.6vw,50px);font-weight:800;letter-spacing:-.028em;color:var(--ink);line-height:1.06}
  .section-head p{font-size:19px;color:var(--muted);margin-top:20px;line-height:1.55;font-weight:400}
  .section-head p strong{color:var(--ink);font-weight:700}

  /* feature pills row */
  .featpills{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:40px}
  .featpills .fp{font-size:15px;font-weight:600;padding:13px 24px;border-radius:6px;background:var(--bg-card);border:1px solid var(--line)}
  /* Was ist Frystyle, Aufklapp-Liste */
  .wflist{max-width:640px;margin:44px auto 0;text-align:left}
  .wfi{border-top:1px solid var(--line)}
  .wfi:last-child{border-bottom:1px solid var(--line)}
  .wfq{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px 6px;cursor:pointer;font-size:20px;font-weight:700;letter-spacing:-.01em;color:var(--ink);transition:color .2s}
  .wfq:hover{color:var(--magenta)}
  .wfic{width:22px;height:22px;position:relative;flex:0 0 auto}
  .wfic::before,.wfic::after{content:"";position:absolute;left:50%;top:50%;background:currentColor;border-radius:2px}
  .wfic::before{width:14px;height:2px;transform:translate(-50%,-50%)}
  .wfic{color:var(--ink)}
  .wfic::after{width:14px;height:2px;transform:translate(-50%,-50%) rotate(90deg);transition:transform .3s ease,opacity .3s ease}
  .wfi.open > .wfq{color:var(--ink)}
  .wfi.open > .wfq > .wfic{color:var(--magenta)}
  .wfi.open > .wfq > .wfic::after{opacity:0;transform:translate(-50%,-50%) rotate(0deg)}
  .wfa{max-height:0;overflow:hidden;transition:max-height .35s ease}
  .wfa p{padding:0 6px 24px;color:var(--muted);font-size:16px;line-height:1.65;margin:0}

  /* PROCESS flow */
  .band{background:var(--bg-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
  .flow{max-width:520px;margin:0 auto;display:flex;flex-direction:column;align-items:stretch;gap:0}
  .flow .step{background:var(--bg-card);border:1px solid var(--line);border-radius:6px;padding:20px 26px;text-align:center;font-size:18px;font-weight:700;letter-spacing:-.01em;transition:border-color .25s,transform .25s}
  .flow .step:hover{border-color:rgba(75,46,158,.6);transform:translateY(-2px)}
  .flow .step.last{background:var(--grad);border:none;color:#fff}
  .flow .down{height:26px;width:2px;margin:6px auto;background:linear-gradient(var(--purple),var(--magenta))}
  .flow-note{text-align:center;max-width:52ch;margin:48px auto 0;color:var(--muted);font-size:18px}
  .flow-note strong{color:var(--ink);font-weight:700}

  /* CASES */
  .grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:24px}
  @media(max-width:540px){.grid3{grid-template-columns:1fr}}
  .card a.vlink{display:inline-block;margin-top:14px;font-size:14px;font-weight:600;color:var(--magenta)}
  .pgrid{display:flex;flex-wrap:wrap;justify-content:center;gap:24px}
  .pgrid>.card{flex:0 1 360px;max-width:400px}
  @media(max-width:760px){.pgrid>.card{flex:1 1 100%;max-width:none}}
  .card .cardlogo{height:40px;width:auto;max-width:100%;display:block;margin:2px 0 6px}
  [data-theme="light"] .card .cardlogo{filter:invert(1) grayscale(1)}
  .card{background:var(--bg-card);border:1px solid var(--line);border-radius:var(--radius);padding:38px 34px;transition:transform .25s ease,border-color .25s ease;display:flex;flex-direction:column}
  .card:hover{transform:translateY(-4px);border-color:rgba(75,46,158,.6)}
  .card h3{font-size:26px;font-weight:800;letter-spacing:-.02em;margin-bottom:6px;color:var(--ink)}
  .card .role{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:16px}
  .card p{font-size:15.5px;color:var(--muted);line-height:1.55;margin-bottom:22px;font-weight:400}
  .card ul{list-style:none;margin-top:auto;display:flex;flex-wrap:wrap;gap:8px}
  .card ul li{font-size:13px;font-weight:600;color:var(--ink);background:var(--chip-bg);border:1px solid var(--line);border-radius:6px;padding:6px 14px}

  /* two-up cards (Ansatz / Fokus) */
  .grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
  @media(max-width:760px){.grid2{grid-template-columns:1fr}}
  .panel{background:var(--bg-card);border:1px solid var(--line);border-radius:var(--radius);padding:44px 40px}
  .panel h3{font-size:24px;font-weight:800;letter-spacing:-.02em;margin-bottom:16px}
  .panel p{color:var(--muted);font-size:16px;line-height:1.6;margin-bottom:14px}
  .panel .lead{color:var(--ink);font-weight:600}
  .panel ul{list-style:none;margin:14px 0 0}
  .panel ul li{position:relative;padding-left:24px;color:var(--ink);font-size:16px;font-weight:500;margin-bottom:11px}
  .panel ul li::before{content:"›";position:absolute;left:4px;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:800}
  .panel .fine{color:var(--muted-dim);font-size:15px;margin-top:6px}
  /* Panel Stagger-Animation */
  .panel h3,.panel .lead,.panel ul li,.panel .fine{opacity:0;transform:translateY(16px);transition:opacity .6s cubic-bezier(.16,1,.3,1),transform .6s cubic-bezier(.16,1,.3,1)}
  .panel.inview h3,.panel.inview .lead,.panel.inview ul li,.panel.inview .fine{opacity:1;transform:none}
  .panel.inview h3{transition-delay:.05s}
  .panel.inview .lead{transition-delay:.15s}
  .panel.inview ul li:nth-child(1){transition-delay:.28s}
  .panel.inview ul li:nth-child(2){transition-delay:.4s}
  .panel.inview ul li:nth-child(3){transition-delay:.52s}
  .panel.inview .fine{transition-delay:.66s}
  @media(prefers-reduced-motion:reduce){.panel h3,.panel .lead,.panel ul li,.panel .fine{opacity:1;transform:none;transition:none}}

  /* Werte / Prinzipien */
  .values{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
  @media(max-width:900px){.values{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:520px){.values{grid-template-columns:1fr}}
  .vcard{position:relative;overflow:hidden;background:var(--bg-card);border:1px solid var(--line);border-radius:6px;padding:34px 30px;transition:transform .4s cubic-bezier(.22,1,.36,1),border-color .3s ease,box-shadow .4s ease}
  .vcard::before{content:"";position:absolute;left:0;right:0;bottom:0;height:0;background:linear-gradient(to top,rgba(75,46,158,.5),rgba(75,46,158,.08));z-index:0;transition:height 1.2s cubic-bezier(.22,1,.36,1)}
  .vcard>*{position:relative;z-index:1}
  .values .vcard.reveal:hover{transform:translateY(-6px) scale(1.06);border-color:transparent;box-shadow:0 30px 60px rgba(75,46,158,.36);z-index:2}
  .vcard:hover::before{height:100%}
  .vcard .vic{display:inline-block;color:var(--purple);margin-bottom:20px;transform-origin:center;transition:transform .9s ease,color .35s ease}
  .vcard .vic svg{width:32px;height:32px;display:block}
  .vcard:hover .vic{color:#fff;transform:rotate(360deg)}
  .vcard h3{font-size:19px;font-weight:800;letter-spacing:-.02em;margin-bottom:10px;color:var(--ink);transition:color .3s ease}
  .vcard p{font-size:15px;color:var(--muted);line-height:1.6;transition:color .3s ease}
  .vcard:hover h3{color:#fff}
  .vcard:hover p{color:rgba(255,255,255,.92)}

  /* Flow-Animation (Sequenz) */
  .flowsec{max-width:940px;margin:0 auto 60px;text-align:center}
  .flowsec .fk{font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:8px}
  .flowsec h2{font-size:clamp(24px,3.4vw,38px);font-weight:800;letter-spacing:-.025em;color:var(--ink);margin-bottom:34px}
  .flowsec h2 .fg{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
  .flowanim svg{width:100%;height:auto;display:block;overflow:visible}
  .fa-track{stroke:var(--line);stroke-width:2;fill:none}
  .fa-fill{fill:none;stroke:var(--purple);stroke-width:3;stroke-linecap:round;stroke-dasharray:650;stroke-dashoffset:650;animation:fafill 5.5s ease-in-out infinite}
  @keyframes fafill{0%{stroke-dashoffset:650}82%{stroke-dashoffset:0}100%{stroke-dashoffset:0}}
  .fa-ring{fill:var(--bg-card);stroke:var(--line);stroke-width:2}
  .fa-dot{fill:var(--muted-dim)}
  .fa-label{fill:var(--muted);font-family:'Montserrat',sans-serif;font-size:16px;font-weight:600;text-anchor:middle}
  .fa-on{opacity:0}
  .fa-on circle{fill:var(--purple)}
  .fa-on .fa-innr{fill:#fff}
  .fa-pulse{fill:#fff;filter:drop-shadow(0 0 8px rgba(162,79,176,.95));animation:fapulse 5.5s ease-in-out infinite}
  @keyframes fapulse{0%{cx:130px;opacity:0}6%{opacity:1}82%{opacity:1;cx:780px}100%{opacity:0;cx:780px}}
  .fa-o1{animation:fao1 5.5s ease-in-out infinite}
  .fa-o2{animation:fao2 5.5s ease-in-out infinite}
  .fa-o3{animation:fao3 5.5s ease-in-out infinite}
  .fa-o4{animation:fao4 5.5s ease-in-out infinite}
  @keyframes fao1{0%,5%{opacity:0}9%{opacity:1}24%{opacity:0}100%{opacity:0}}
  @keyframes fao2{0%,40%{opacity:0}45%{opacity:1}60%{opacity:0}100%{opacity:0}}
  @keyframes fao3{0%,77%{opacity:0}84%{opacity:1}100%{opacity:1}}
  @media(prefers-reduced-motion:reduce){.fa-fill,.fa-pulse,.fa-o1,.fa-o2,.fa-o3,.fa-o4{animation:none}.fa-fill{stroke-dashoffset:0}.fa-o4{opacity:1}}

  /* FÜR WEN */
  .audience{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;max-width:960px;margin:0 auto;background:var(--bg-card);border:1px solid var(--line);border-radius:6px;padding:46px 52px}
  @media(max-width:760px){.audience{grid-template-columns:1fr;gap:36px;padding:34px 28px}}
  .audience .col h4{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted-dim);margin-bottom:20px}
  .chips{display:flex;flex-wrap:wrap;gap:10px}
  .chips .chip{font-size:16px;font-weight:700;padding:13px 22px;border-radius:6px;border:1px solid var(--line);background:var(--chip-bg)}
  .audience ul{list-style:none}
  .audience ul li{position:relative;padding-left:26px;font-size:17px;color:var(--ink);margin-bottom:14px;font-weight:500}
  .audience ul li::before{content:"→";position:absolute;left:0;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:800}

  /* VISION */
  .vision{text-align:center;max-width:56ch;margin:0 auto}
  .vision h2{font-size:clamp(28px,4.4vw,46px);font-weight:800;letter-spacing:-.025em;line-height:1.12}
  .vision h2 em{font-style:normal;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
  .vision .vlist{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin:34px 0 28px}
  .vision .vlist span{font-size:15px;font-weight:600;padding:11px 20px;border-radius:6px;border:1px solid var(--line);background:var(--bg-card)}
  .vision p{color:var(--muted);font-size:19px}

  /* CTA */
  .cta{text-align:center;padding:124px 24px;position:relative;overflow:hidden}
  .cta::before{content:"";position:absolute;bottom:-40%;left:50%;transform:translateX(-50%);width:900px;height:600px;background:radial-gradient(ellipse at center,rgba(75,46,158,.30),transparent 62%);filter:blur(30px);z-index:0}
  .cta>*{position:relative;z-index:1}
  .cta h2{font-size:clamp(30px,4.8vw,52px);font-weight:800;letter-spacing:-.028em;color:var(--ink);max-width:24ch;margin:0 auto 34px;line-height:1.12}
  .cta .arrows{margin:0 0 40px}

  /* CONTACT (BLNK-Style) */
  .contact{padding:120px 24px 130px;text-align:center;position:relative;overflow:hidden}
  .contact::before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:900px;height:520px;background:radial-gradient(ellipse at center,rgba(75,46,158,.22),transparent 62%);filter:blur(30px);z-index:0}
  .contact>*{position:relative;z-index:1}
  .hello{display:inline-flex;align-items:center;gap:12px;font-size:13px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:14px}
  .hello img{width:34px;height:34px;border-radius:50%;object-fit:cover;object-position:center 24%}
  .contact .sub{font-size:18px;color:var(--muted);margin-bottom:44px}
  .bigmail-wrap{overflow:hidden;width:100vw;margin-left:calc(50% - 50vw);
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);
    mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
  .bigmail-track{display:flex;width:max-content;animation:mailmarq 26s linear infinite}
  .bigmail-track:hover{animation-play-state:paused}
  @keyframes mailmarq{from{transform:translateX(-50%)}to{transform:translateX(0)}}
  .bigmail{display:inline-flex;flex-wrap:nowrap;align-items:center;gap:.05em .12em;white-space:nowrap;line-height:1;font-weight:900;letter-spacing:-.03em;font-size:clamp(56px,12vw,148px);padding:0 .35em}
  .bigmail .fill{color:var(--ink)}
  .bigmail .ol{color:transparent;-webkit-text-stroke:1.5px var(--muted);text-stroke:1.5px var(--muted)}
  .bigmail .tile{display:inline-flex;align-items:center;justify-content:center;width:.9em;height:.9em;border-radius:.16em;overflow:hidden;vertical-align:middle}
  .bigmail .tile img{width:100%;height:100%;object-fit:cover;object-position:center 22%}
  .bigmail .tile.grad{background:var(--grad);color:#fff}
  .bigmail .tile.grad svg{width:.46em;height:.46em}
  .talkbtn{display:inline-flex;align-items:center;gap:16px;margin-top:52px;padding:6px 6px 6px 32px;border:1px solid var(--nav-border);border-radius:6px;font-size:17px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ink);transition:border-color .2s}
  .talkbtn:hover{border-color:var(--purple)}
  .talkbtn .arrow{width:52px;height:52px;border-radius:50%;background:var(--ink);color:var(--bg);display:flex;align-items:center;justify-content:center;transition:background .2s,color .2s,transform .2s}
  .talkbtn .arrow svg{width:20px;height:20px}
  .talkbtn:hover .arrow{background:var(--grad);color:#fff;transform:translate(2px,-2px)}

  /* FOOTER */
  footer{background:var(--bg-2);color:var(--ink);padding:74px 24px 40px;border-top:1px solid var(--line)}
  .foot-grid{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px}
  @media(max-width:760px){.foot-grid{grid-template-columns:1fr;gap:34px}}
  footer .brand-logo{height:24px;margin-bottom:18px}
  footer .foot-logo{display:block;height:58px;width:auto;margin-bottom:22px}
  footer .foot-logo-light{display:none}
  [data-theme="light"] footer .foot-logo-dark{display:none}
  [data-theme="light"] footer .foot-logo-light{display:block}
  footer p.desc{color:var(--muted-dim);font-size:15px;max-width:40ch;line-height:1.6}
  footer h4{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted-dim);margin-bottom:16px}
  footer ul{list-style:none}
  footer ul li{margin-bottom:11px;color:var(--muted)}
  footer ul li a{color:var(--muted);font-size:15px;transition:color .2s}
  footer ul li a:hover{color:var(--magenta)}
  .foot-bottom{max-width:var(--maxw);margin:48px auto 0;padding-top:24px;border-top:1px solid var(--line);display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:13px;color:var(--muted-dim)}
  .foot-bottom a{color:var(--muted)}

  /* 3 STEPS */
  .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
  @media(max-width:820px){.steps{grid-template-columns:1fr}}
  .steps .st{background:var(--bg-card);border:1px solid var(--line);border-radius:var(--radius);padding:40px 34px;position:relative;transition:transform .25s,border-color .25s}
  .steps .st:hover{transform:translateY(-4px);border-color:rgba(75,46,158,.6)}
  .steps .st .no{font-size:13px;font-weight:800;letter-spacing:.1em;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:18px}
  .steps .st h3{font-size:25px;font-weight:800;letter-spacing:-.02em;margin-bottom:12px}
  .steps .st p{color:var(--muted);font-size:16px;line-height:1.6}

  /* Prozess-Tabs (Pills + Panel unten) */
  .proc{max-width:1000px;margin:0 auto}
  .proc-tabs{position:relative;display:flex;justify-content:center;flex-wrap:wrap;gap:14px;margin-bottom:44px}
  .proc-track,.proc-prog{position:absolute;top:50%;height:2px;transform:translateY(-50%);z-index:0;pointer-events:none;border-radius:2px}
  .proc-track{left:10%;right:10%;background:var(--line)}
  .proc-prog{left:10%;width:0;background:var(--grad);transition:width .6s cubic-bezier(.16,1,.3,1)}
  .proc-tabs[data-active="1"] .proc-prog{width:40%}
  .proc-tabs[data-active="2"] .proc-prog{width:80%}
  @media(max-width:640px){.proc-track,.proc-prog{display:none}}
  .ptab{position:relative;z-index:1;display:inline-flex;align-items:center;gap:12px;padding:9px 24px 9px 10px;border-radius:6px;border:1px solid var(--line);background:var(--bg-card);color:var(--ink);font-size:16px;font-weight:600;cursor:default;font-family:inherit;transition:background .25s,border-color .25s,color .25s}
  .ptab .pdot{width:32px;height:32px;border-radius:50%;background:var(--chip-bg);display:flex;align-items:center;justify-content:center;color:var(--ink);transition:background .25s,color .25s}
  .ptab .pdot svg{width:16px;height:16px}
  .ptab:hover{border-color:rgba(75,46,158,.5)}
  .ptab.active{background:var(--grad);border-color:transparent;color:#fff}
  .ptab.active .pdot{background:#fff;color:var(--purple)}
  .ppanel{display:none}
  .ppanel.active{display:block;animation:pfade .4s ease}
  @keyframes pfade{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
  .ppanel-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:36px;align-items:center;background:var(--bg-card);border:1px solid var(--line);border-radius:6px;padding:44px}
  @media(max-width:820px){.ppanel-grid{grid-template-columns:1fr;gap:24px;padding:28px}}
  .pnum{font-size:13px;font-weight:800;letter-spacing:.1em;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:14px}
  .ppanel-text h3{font-size:30px;font-weight:800;letter-spacing:-.02em;margin-bottom:14px;color:var(--ink)}
  .ppanel-text p{font-size:17px;color:var(--muted);line-height:1.6;margin-bottom:20px}
  .ppanel-text ul{list-style:none}
  .ppanel-text ul li{position:relative;padding-left:26px;color:var(--ink);font-size:16px;margin-bottom:11px;font-weight:500}
  .ppanel-text ul li::before{content:"✓";position:absolute;left:0;color:var(--purple);font-weight:800}
  .pv-card{aspect-ratio:1.15;border-radius:6px;background:linear-gradient(160deg,#2a1257,#4C1D95 55%,#6C2BD9);display:flex;flex-direction:column;justify-content:flex-end;padding:30px;color:#fff;position:relative;overflow:hidden}
  .pv-card::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 28% 22%,rgba(255,255,255,.20),transparent 55%)}
  .pv-ic{position:absolute;top:26px;left:26px;width:48px;height:48px;border-radius:6px;background:rgba(255,255,255,.16);display:flex;align-items:center;justify-content:center}
  .pv-ic svg{width:24px;height:24px}
  .pv-card h4{font-size:24px;font-weight:800;position:relative;letter-spacing:-.02em}
  .pv-card .pv-sub{font-size:14px;color:rgba(255,255,255,.85);position:relative;margin-top:6px}

  /* ABOUT / WER WIR SIND */
  .about{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px;align-items:center;max-width:1000px;margin:0 auto}
  @media(max-width:820px){.about{grid-template-columns:1fr;gap:36px}}
  .avatar{position:relative;overflow:hidden;aspect-ratio:1;max-width:340px;width:100%;margin:0 auto;border-radius:6px;background:var(--grad);display:flex;align-items:center;justify-content:center;font-size:104px;font-weight:900;color:#fff;letter-spacing:-.04em;box-shadow:0 30px 70px rgba(75,46,158,.35)}
  .avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 28%}
  .about h2{font-size:clamp(28px,4vw,44px);font-weight:800;letter-spacing:-.025em;line-height:1.1;margin-bottom:8px}
  .about .sub{font-size:15px;font-weight:700;letter-spacing:.02em;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:22px}
  .about p{color:var(--muted);font-size:17px;line-height:1.65;margin-bottom:16px}
  .about p strong{color:var(--ink);font-weight:700}
  .about-stats{display:flex;gap:34px;margin-top:28px;flex-wrap:wrap}
  .about-stats .s .n{font-size:34px;font-weight:800;letter-spacing:-.03em}
  .about-stats .s .n span{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
  .about-stats .s .l{font-size:14px;color:var(--muted);margin-top:2px}

  /* ABOUT: Foto in den Hintergrund verblendet (dynamisch) */
  #wer{position:relative;overflow:hidden}
  #wer::before{content:"";position:absolute;left:-4%;top:50%;transform:translateY(-50%);width:52%;height:130%;background:radial-gradient(ellipse at 42% 50%,rgba(75,46,158,.30),transparent 62%);z-index:0;pointer-events:none}
  .about-bg{position:absolute;left:0;top:0;bottom:0;width:48%;z-index:0;pointer-events:none;overflow:hidden}
  .about-bg img{width:100%;height:100%;object-fit:cover;object-position:center 20%;filter:grayscale(1) contrast(1.04);
    -webkit-mask-image:linear-gradient(90deg,#000 38%,transparent 80%);mask-image:linear-gradient(90deg,#000 38%,transparent 80%);
    animation:kenburns 22s ease-in-out infinite alternate}
  @keyframes kenburns{from{transform:scale(1.03)}to{transform:scale(1.11) translate(1.5%,-2.5%)}}
  .about-panel{position:relative;z-index:1;width:50%;margin-left:auto;max-width:620px}
  .about-panel .sub{display:inline-block;font-size:15px;font-weight:700;letter-spacing:.02em;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:22px}
  .about-panel h2{font-size:clamp(28px,4vw,46px);font-weight:800;letter-spacing:-.025em;line-height:1.1;margin-bottom:20px;color:var(--ink)}
  .about-panel p{color:var(--muted);font-size:17px;line-height:1.7;margin-bottom:18px}
  .about-panel p strong{color:var(--ink);font-weight:700}
  @media(max-width:860px){
    #wer{padding-top:300px}
    .about-bg{width:100%;height:272px;bottom:auto}
    .about-bg img{object-position:center 20%;-webkit-mask-image:linear-gradient(180deg,#000 25%,transparent 100%);mask-image:linear-gradient(180deg,#000 25%,transparent 100%)}
    #wer::before{width:100%;height:360px;top:0;left:0;transform:none}
    .about-panel{width:100%;margin-left:0;max-width:none}
  }
  @media(prefers-reduced-motion:reduce){.about-bg img{animation:none}}

  /* TESTIMONIALS */
  .quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
  @media(max-width:880px){.quotes{grid-template-columns:1fr}}
  .qcard{background:var(--bg-card);border:1px solid var(--line);border-radius:var(--radius);padding:34px 32px;display:flex;flex-direction:column}
  .qcard .mark{font-size:52px;line-height:.5;font-weight:900;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:16px}
  .qcard p{color:var(--ink);font-size:15px;line-height:1.6;font-weight:400;margin-bottom:24px}
  .qcard .who{margin-top:auto;font-size:14px;color:var(--muted)}
  .qcard .who b{display:block;color:var(--ink);font-weight:700;font-size:15px;margin-bottom:2px}

  /* VENTURES · Glow-Zahl */
  .vh{padding:110px 0}
  .vh-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;max-width:1000px;margin:0 auto}
  @media(max-width:820px){.vh-grid{grid-template-columns:1fr;gap:20px;text-align:center}}
  .vh-numwrap{display:flex;justify-content:center}
  .vh-num{position:relative;display:inline-block;padding-bottom:24px}
  .vh-num .bignum{font-size:clamp(180px,26vw,360px);font-weight:900;line-height:.8;letter-spacing:-.05em;color:var(--ink);position:relative;z-index:1;display:block}
  .vh-num::before{content:"";position:absolute;left:50%;bottom:18%;transform:translateX(-50%);width:62%;height:58%;
    background:radial-gradient(ellipse at 50% 100%,rgba(var(--glow-c),.6),transparent 66%);filter:blur(32px);z-index:0;pointer-events:none}
  .vh-num::after{content:"";position:absolute;left:50%;bottom:6px;transform:translateX(-50%);width:82%;height:34px;
    background:radial-gradient(ellipse at center,rgba(var(--glow-c),.55),transparent 72%);filter:blur(16px);z-index:2;pointer-events:none}
  .vh-text .kicker{font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:16px}
  .vh-text h2{font-size:clamp(28px,4vw,44px);font-weight:800;letter-spacing:-.025em;line-height:1.1;margin-bottom:18px;color:var(--ink)}
  .vh-text p{font-size:18px;color:var(--muted);line-height:1.6}

  /* CHAT-STIMMEN */
  .chat{max-width:760px;margin:0 auto;display:flex;flex-direction:column;gap:28px}
  .msg{display:flex;align-items:flex-end;gap:14px;max-width:84%}
  .msg .av{width:50px;height:50px;border-radius:50%;object-fit:cover;flex:0 0 50px;border:1px solid var(--line)}
  .msg .avf{display:flex;align-items:center;justify-content:center;background:var(--grad);color:#fff;font-weight:800;font-size:16px;letter-spacing:.02em}
  .msg .body{min-width:0}
  .msg .bubble{background:var(--bg-card);border:1px solid var(--line);border-radius:6px;padding:18px 22px}
  .msg .bubble p{font-size:16px;color:var(--ink);line-height:1.5;margin:0;font-weight:500}
  .msg .who{font-size:13px;color:var(--muted-dim);margin-top:9px;padding:0 4px}
  .msg .who b{color:var(--ink);font-weight:700}
  .msg.left{align-self:flex-start}
  .msg.left .bubble{border-bottom-left-radius:6px}
  .msg.right{align-self:flex-end;flex-direction:row-reverse}
  .msg.right .bubble{border-bottom-right-radius:6px;background:var(--grad);border:none}
  .msg.right .bubble p{color:#fff}
  .msg.right .who{text-align:right}
  @media(max-width:560px){.msg{max-width:100%}.msg .av{width:42px;height:42px;flex-basis:42px}}

  /* LOGO STRIP */
  .logos{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:30px 48px;max-width:900px;margin:0 auto}
  .logos img{height:30px;width:auto;opacity:.55;filter:grayscale(1) brightness(1.6);transition:opacity .25s}
  .logos img:hover{opacity:.9}

  /* ===== EFFECTS ===== */
  @keyframes floaty{0%{transform:translate(0,0) scale(1)}50%{transform:translate(44px,-32px) scale(1.1)}100%{transform:translate(0,0) scale(1)}}
  @keyframes floaty2{0%{transform:translate(0,0) scale(1)}50%{transform:translate(-52px,34px) scale(1.14)}100%{transform:translate(0,0) scale(1)}}
  @keyframes shimmer{to{background-position:200% center}}
  @keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

  /* animated gradient shimmer on violet text */
  .hero h1 .accent,.section-head .kicker,.card .role,.about .sub,.stat .num span,
  .about-stats .s .n span,.vision h2 em,.arrows .pill span{
    background-size:200% auto;animation:shimmer 6s linear infinite}
  .hero h1 .accent{animation-play-state:paused;animation-duration:5.5s}
  .hero h1 .accent.tw-go{animation-play-state:running}

  /* aurora blobs */
  .aurora{display:none}
  .aurora .blob{position:absolute;border-radius:50%;filter:blur(72px);opacity:.5;mix-blend-mode:screen;will-change:transform}
  .aurora .b1{width:540px;height:540px;top:-140px;left:50%;background:radial-gradient(circle,#a24fb0,transparent 68%);animation:floaty 15s ease-in-out infinite}
  .aurora .b2{width:480px;height:480px;top:20px;left:6%;background:radial-gradient(circle,#6f2d84,transparent 68%);animation:floaty2 19s ease-in-out infinite}
  .aurora .b3{width:400px;height:400px;top:170px;left:34%;background:radial-gradient(circle,#803686,transparent 70%);animation:floaty 22s ease-in-out infinite}

  /* fine noise overlay */
  body::after{content:"";position:fixed;inset:0;z-index:2;pointer-events:none;opacity:.04;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

  /* card cursor spotlight */
  .card{position:relative;isolation:isolate}
  .card::before{content:"";position:absolute;inset:0;border-radius:inherit;z-index:-1;opacity:0;transition:opacity .35s;
    background:radial-gradient(340px circle at var(--mx,50%) var(--my,50%),rgba(162,79,176,.22),transparent 60%)}
  .card:hover::before{opacity:1}
  .card:hover{box-shadow:0 24px 60px rgba(75,46,158,.22)}
  .steps .st:hover{box-shadow:0 24px 60px rgba(75,46,158,.20)}

  /* button sheen */
  .btn-primary{position:relative;overflow:hidden}
  .btn-primary::after{content:"";position:absolute;top:0;left:-130%;width:55%;height:100%;transform:skewX(-20deg);
    background:linear-gradient(100deg,transparent,rgba(255,255,255,.38),transparent);transition:left .6s ease}
  .btn-primary:hover::after{left:150%}

  /* ERKUNDE SLIDER */
  .eslider{position:relative}
  .eslider-track{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 4px 8px;scrollbar-width:none;-ms-overflow-style:none}
  .eslider-track::-webkit-scrollbar{display:none}
  .eslider-track>.card{flex:0 0 calc((100% - 48px)/3);scroll-snap-align:start}
  @media(max-width:900px){.eslider-track>.card{flex:0 0 calc((100% - 24px)/2)}}
  @media(max-width:600px){.eslider-track>.card{flex:0 0 82vw}}
  .eslider-nav{display:flex;justify-content:center;gap:12px;margin-top:24px}
  .eslider-btn{width:46px;height:46px;border-radius:50%;border:1px solid var(--line);background:var(--bg-card);color:var(--ink);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:border-color .25s ease,transform .25s ease}
  .eslider-btn svg{width:20px;height:20px}
  .eslider-btn:hover{border-color:rgba(75,46,158,.6);transform:translateY(-2px)}

  /* VIDEO PLATZHALTER */
  .hero-video{position:absolute;inset:0;margin:auto;width:min(1200px,92vw);height:fit-content;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);z-index:0;opacity:.5;pointer-events:none;
    -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 55%,transparent 100%),linear-gradient(to right,transparent 0%,#000 12%,#000 88%,transparent 100%);
    -webkit-mask-composite:source-in;
    mask-image:linear-gradient(to bottom,#000 0%,#000 55%,transparent 100%),linear-gradient(to right,transparent 0%,#000 12%,#000 88%,transparent 100%);
    mask-composite:intersect}
  .video-placeholder{aspect-ratio:16/9;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:linear-gradient(135deg,rgba(75,46,158,.12),rgba(162,79,176,.08))}
  .video-play{width:64px;height:64px;border-radius:50%;background:var(--grad);color:#fff;display:flex;align-items:center;justify-content:center;flex:none}
  .video-play svg{width:26px;height:26px}
  .video-placeholder p{color:var(--muted);font-size:15px;font-weight:600;margin:0}
  .video-embed{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;background:#000}
  .video-embed video{position:absolute;top:50%;left:50%;width:100%;height:100%;min-width:100%;min-height:100%;object-fit:cover;transform:translate(-50%,-50%)}

  /* logo marquee */
  .marquee{overflow:hidden;max-width:960px;margin:64px auto 0;
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);
    mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
  .mtrack{display:flex;align-items:center;gap:56px;width:max-content;animation:marquee 30s linear infinite}
  .marquee:hover .mtrack{animation-play-state:paused}
  .mtrack img{height:auto;width:auto;max-height:30px;max-width:168px;object-fit:contain;opacity:.6;filter:grayscale(1) brightness(1.5);mix-blend-mode:screen;transition:opacity .25s}
  .mtrack img[alt="VELOR"]{max-height:34px;max-width:186px}
  .mtrack img[alt="Klebe-Technik AG"]{max-height:32px}
  .mtrack img[alt="okapa"]{max-height:28px}
  .mtrack img:hover{opacity:1}
  [data-theme="light"] .mtrack img{mix-blend-mode:multiply;filter:invert(1) grayscale(1);opacity:.7}
  .logos-sec .marquee{max-width:1120px;margin:40px auto 0}
  .logos-label{text-align:center;font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-dim)}
  .mtrack .word{font-size:22px;line-height:30px;font-weight:800;letter-spacing:-.01em;color:var(--muted);opacity:.6;white-space:nowrap;transition:opacity .25s;text-transform:lowercase}
  .mtrack .word:hover{opacity:.9}
  .mtrack .word .thin{font-weight:400}

  /* STATEMENT · Framion-Style Scroll-Fill */
  @keyframes spin{to{transform:rotate(360deg)}}
  .statement{position:relative;overflow:hidden;padding:150px 0}
  .statement .streaks{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
  .statement .streaks i{position:absolute;width:1px;height:240px;background:linear-gradient(var(--purple),transparent);transform:rotate(26deg);opacity:.22}
  .statement .inner{position:relative;z-index:1;max-width:1180px;margin:0 auto;padding:0 24px;text-align:center}
  .spark{width:36px;height:36px;margin:0 auto 44px;display:block;color:var(--purple);animation:spin 10s linear infinite}
  .spark-mark{width:auto;height:41px}
  .statement h2{font-size:clamp(38px,7.6vw,118px);font-weight:900;letter-spacing:-.035em;line-height:.92;text-transform:uppercase}.statement .w{line-height:.92;vertical-align:top}.statement .icochip{vertical-align:top;margin-top:.03em}
  .statement .w{display:inline-block;color:var(--ink)}
  .statement .w.accent .g{background:none;color:#8A4FC0;-webkit-text-fill-color:#8A4FC0}
  .statement .ltr{display:inline-block;overflow:hidden;height:1.15em;line-height:1.15em;vertical-align:top;text-align:center;
    box-sizing:content-box;padding:0 .05em;margin:0 -.05em}
  .statement .reel{display:block;transform:translateY(0);will-change:transform}
  .statement .reel .g{height:1.15em;line-height:1.15em;display:block}
  .slot.spin .reel{animation:slotroll 1.05s cubic-bezier(.15,.9,.25,1) both;animation-delay:var(--dl,0ms)}
  @keyframes slotroll{from{transform:translateY(0)}to{transform:translateY(var(--d,0))}}
  .icochip{display:inline-flex;align-items:center;justify-content:center;width:.92em;height:.92em;vertical-align:-.06em;margin:0 .1em;border-radius:.2em;background:var(--grad);color:#fff}
  .icochip svg{width:.5em;height:.5em}

  @media(prefers-reduced-motion:reduce){
    .aurora .blob,.mtrack,.hero h1 .accent,.section-head .kicker,.card .role,.about .sub,
    .stat .num span,.about-stats .s .n span,.vision h2 em,.arrows .pill span,.spark{animation:none}
  }

  /* FAQ (Vantis-Style) */
  .faq-title{font-size:clamp(48px,9vw,118px);font-weight:900;letter-spacing:-.04em;line-height:.95;color:var(--ink);margin-bottom:52px}
  .faq-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:26px;align-items:start}
  @media(max-width:860px){.faq-grid{grid-template-columns:1fr;gap:20px}}
  .faq-media{position:relative;border-radius:6px;overflow:hidden;min-height:100%;align-self:stretch;background:#141418;display:flex;flex-direction:column;justify-content:flex-end;padding:34px;min-height:460px}
  .faq-media .faq-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 45%;z-index:0}
  .faq-media .faq-cap{position:relative;z-index:2}
  /* Cursor-Spotlight auf dem Startfoto */
  .faq-media{isolation:isolate;
      transition:transform .5s cubic-bezier(.2,.7,.2,1),box-shadow .35s ease;will-change:transform}
  .faq-media.reveal:hover,.faq-media:hover{transform:translateY(-4px);
      box-shadow:0 26px 60px rgba(75,46,158,.30)}
  @media(prefers-reduced-motion:reduce){.faq-media{transition:none}.faq-media.reveal:hover,.faq-media:hover{transform:none}}
  .faq-media::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0;transition:opacity .35s;
      background:radial-gradient(340px circle at var(--mx,50%) var(--my,50%),rgba(162,79,176,.30),transparent 62%)}
  .faq-media:hover::after{opacity:1}
  @media(prefers-reduced-motion:reduce){.faq-media::after{transition:none}}
  .faq-media::before{content:"";position:absolute;inset:0;z-index:1;border-radius:inherit;pointer-events:none;
      background:linear-gradient(180deg,rgba(10,10,12,0) 0%,rgba(10,10,12,.10) 50%,rgba(10,10,12,.78) 100%);
      box-shadow:inset 0 0 0 1px rgba(255,255,255,.26);transition:box-shadow .35s ease}
  .faq-media:hover::before{box-shadow:inset 0 0 0 1px rgba(91,60,246,.65)}
  .faq-media .fmark{position:absolute;top:32px;left:34px;height:28px;opacity:.95}
  .faq-cap{position:relative;color:#fff;font-size:18px;line-height:1.5;font-weight:500;max-width:32ch}
  @media(max-width:860px){.faq-media{min-height:280px}}
  .faq{display:flex;flex-direction:column;gap:16px}
  .faq-item{background:var(--bg-card);border:1px solid var(--line);border-radius:6px;overflow:hidden;transition:border-color .25s}
  .faq-item:hover{border-color:rgba(75,46,158,.5)}
  .faq-q{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px 26px;cursor:pointer;font-size:18px;font-weight:700;color:var(--ink);letter-spacing:-.01em}
  .faq-ic{width:44px;height:44px;border-radius:50%;background:var(--ink);position:relative;flex:0 0 auto;transition:background .3s}
  .faq-ic::before,.faq-ic::after{content:"";position:absolute;left:50%;top:50%;background:var(--bg);border-radius:2px}
  .faq-ic::before{width:16px;height:2px;transform:translate(-50%,-50%)}
  .faq-ic::after{width:2px;height:16px;transform:translate(-50%,-50%);transition:opacity .3s}
  .faq-item.open .faq-ic{background:var(--purple)}
  .faq-item.open .faq-ic::before,.faq-item.open .faq-ic::after{background:#fff}
  .faq-item.open .faq-ic::after{opacity:0}
  .faq-a{max-height:0;overflow:hidden;transition:max-height .38s ease}
  .faq-a p{padding:0 26px 26px;color:var(--muted);font-size:16px;line-height:1.65;margin:0}
  .faq-a p a{color:var(--magenta);font-weight:600}

  /* Mobile-Menü (Hamburger) */
  .hamb{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5px;width:40px;height:40px;border-radius:6px;border:1px solid var(--nav-border);background:none;cursor:pointer;position:relative;z-index:210}
  .hamb span{width:18px;height:2px;background:var(--ink);border-radius:2px;transition:transform .3s,opacity .3s}
  .hamb.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .hamb.open span:nth-child(2){opacity:0}
  .hamb.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  /* Vollbild-Menue-Fenster, ruhig (Lando-Vorbild): volle Flaeche, grosse Links, kein Overlay-Laerm */
  .mmenu{position:fixed;inset:0;z-index:195;background:var(--bg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;opacity:0;visibility:hidden;transition:opacity .4s ease,visibility 0s linear .4s}
  .mmenu.open{opacity:1;visibility:visible;transition:opacity .4s ease,visibility 0s}
  .mmenu a{font-size:clamp(30px,6vw,54px);font-weight:800;letter-spacing:-.03em;line-height:1.3;color:var(--muted);padding:4px 14px;border-radius:0;background:none;transition:color .25s,transform .3s,opacity .3s;transform:translateY(14px);opacity:0}
  .mmenu.open a{transform:translateY(0);opacity:1}
  .mmenu a:hover,.mmenu a:focus-visible{color:var(--ink);background:none}

  /* Mobile-Feinschliff */
  @media(max-width:600px){
    section.block{padding:72px 0}
    .wrap{padding:0 20px}
    .hero{padding:120px 20px 68px}
    .section-head{margin-bottom:38px}
    .contact{padding:80px 20px 90px}
    .cta{padding:88px 20px}
    .faq-title{margin-bottom:34px}
    .ppanel-grid{padding:24px}
    .card,.panel{padding:30px 26px}
    .bottom-blur{height:150px}
    nav .nav-cta{padding:10px 14px}
  }

  /* Progressive Blur am unteren Fensterrand */
  .bottom-blur{position:fixed;left:0;right:0;bottom:0;height:210px;z-index:150;pointer-events:none;transition:opacity .45s ease}
  .bottom-blur.hide{opacity:0}
  .bottom-blur.on-stage{opacity:0}
  .bottom-blur>div{position:absolute;inset:0}
  .bottom-blur .b1{backdrop-filter:blur(0.7px);-webkit-backdrop-filter:blur(0.7px);-webkit-mask:linear-gradient(to top,#000 0%,#000 30%,transparent 65%);mask:linear-gradient(to top,#000 0%,#000 30%,transparent 65%)}
  .bottom-blur .b2{backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);-webkit-mask:linear-gradient(to top,#000 0%,#000 15%,transparent 45%);mask:linear-gradient(to top,#000 0%,#000 15%,transparent 45%)}
  .bottom-blur .b3{backdrop-filter:blur(4.5px);-webkit-backdrop-filter:blur(4.5px);-webkit-mask:linear-gradient(to top,#000 0%,transparent 28%);mask:linear-gradient(to top,#000 0%,transparent 28%)}
  .bottom-blur .tint{background:linear-gradient(to top,var(--bg) 0%,transparent 100%);opacity:.35}

  /* Cookie-Banner */
  .cookie{position:fixed;left:16px;bottom:16px;z-index:300;width:min(400px,calc(100% - 32px));
    background:var(--nav-bg);backdrop-filter:saturate(180%) blur(22px);-webkit-backdrop-filter:saturate(180%) blur(22px);
    border:1px solid var(--nav-border);border-radius:6px;box-shadow:var(--nav-shadow);padding:22px 24px;
    transform:translateY(160%);transition:transform .5s cubic-bezier(.16,1,.3,1)}
  .cookie.show{transform:none}
  .cookie p{font-size:14px;color:var(--muted);line-height:1.55;margin:0 0 16px}
  .cookie p a{color:var(--magenta);font-weight:600}
  .cookie-btns{display:flex;gap:10px}
  .cookie-btns button,.cookie-btns a{flex:1;display:inline-flex;align-items:center;justify-content:center;text-align:center;font-family:inherit;font-size:14px;font-weight:600;padding:11px 16px;border-radius:6px;cursor:pointer;transition:filter .2s,border-color .2s,background .2s}
  .ck-accept{background:var(--grad);color:#fff;border:none}
  .ck-accept:hover{filter:brightness(1.12)}
  .ck-decline{background:none;color:var(--ink);border:1px solid var(--nav-border)}
  .ck-decline:hover{border-color:var(--purple)}

  /* Custom Cursor (runder Punkt) */
  @media(pointer:fine){
    body{cursor:none}
    a,button,.ptab,.faq-q,.wfq,.dd>button,input,textarea,label{cursor:none}
  }
  .cursor-dot{position:fixed;top:0;left:0;width:10px;height:10px;border-radius:50%;background:#fff;pointer-events:none;z-index:9998;transform:translate(var(--cx,-100px),var(--cy,-100px)) translate(-50%,-50%);transition:width .2s ease,height .2s ease,background .2s ease;will-change:transform}
  [data-theme="light"] .cursor-dot{background:var(--ink)}
  .cursor-dot.hover{width:30px;height:30px;background:rgba(91,60,246,.85);box-shadow:0 0 18px rgba(91,60,246,.55)}
  @media(pointer:coarse){.cursor-dot{display:none}}


  /* ERGEBNIS: belegte Zahlen + die vier Dimensionen */
  .erg{position:relative}
  .erg-dims{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 14px;margin:0 auto 46px;max-width:860px}
  .erg-dims span{font-size:clamp(20px,2.4vw,32px);font-weight:900;letter-spacing:-.02em;color:var(--ink)}
  .erg-dims i{font-style:normal;font-size:clamp(18px,2vw,26px);font-weight:700;color:#7D64F8;align-self:center}
  /* Ergebnis: keine Kaesten, der Text steht direkt auf dem Grund. */
  .erg-grid{display:grid;grid-template-columns:repeat(12,1fr);
        gap:clamp(34px,4vw,58px) clamp(24px,2.6vw,40px);max-width:1120px;margin:0 auto}
  .erg-c{grid-column:span 3}
  .erg-c.erg-b{grid-column:span 4}
  .erg-c{position:relative;display:flex;flex-direction:column;justify-content:flex-start;color:var(--ink);
        padding-top:18px;border-top:1px solid var(--line);
        transition:transform .35s cubic-bezier(.2,.8,.2,1)}
  /* Kurzer violetter Anschnitt auf der Linie, waechst beim Ueberfahren */
  .erg-c::before{content:"";position:absolute;left:0;top:-1px;height:2px;width:26px;
        background:var(--grad);border-radius:2px;
        transition:width .45s cubic-bezier(.2,.8,.2,1)}
  .erg-c:hover{transform:translateY(-3px)}
  .erg-c:hover::before{width:100%}
  .erg-n{display:block;font-size:11px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:#7D64F8;margin-bottom:14px}

  /* Erste Reihe: die vier harten Zahlen. Die Zahl traegt, das Wort erklaert. */
  .erg-v{margin:0}
  .erg-v b{display:block;font-size:clamp(40px,4.4vw,64px);font-weight:900;
        letter-spacing:-.05em;line-height:.92;color:var(--ink);
        font-variant-numeric:tabular-nums}
  .erg-v b .erg-pf{font-size:.52em;letter-spacing:-.02em;vertical-align:.14em;margin-left:.06em}
  .erg-v span{display:block;margin-top:12px;font-size:clamp(14.5px,1.12vw,16.5px);
        font-weight:600;line-height:1.4;color:var(--muted)}

  /* Zweite Reihe: die drei Verschiebungen. Ruhiger, damit die Zahlen oben tragen. */
  .erg-zwei{margin-top:clamp(30px,3.4vw,52px)}
  .erg-q{margin:0;font-size:clamp(18px,1.55vw,22px);font-weight:800;
        letter-spacing:-.022em;line-height:1.28;color:var(--ink)}
  @media(max-width:1020px){.erg-grid{grid-template-columns:1fr 1fr}.erg-c,.erg-c.erg-b{grid-column:auto}}
  @media(max-width:620px){.erg-grid{grid-template-columns:1fr}}

  /* PRELOADER */
  #preloader{position:fixed;inset:0;z-index:9999;background:var(--bg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;transition:opacity .6s ease,visibility .6s}
  #preloader.hide{opacity:0;visibility:hidden}
  .pl-mark{height:64px;width:auto;animation:plpulse 1.6s ease-in-out infinite}
  .pl-light{display:none}
  [data-theme="light"] #preloader .pl-light{display:block}
  [data-theme="light"] #preloader .pl-word{display:none}
  .pl-word{font-size:36px;font-weight:900;letter-spacing:-.02em;color:var(--ink);animation:plpulse 1.6s ease-in-out infinite}
  .pl-word .dot{color:var(--purple)}
  @keyframes plpulse{0%,100%{opacity:.5;transform:scale(.97)}50%{opacity:1;transform:scale(1)}}
  .pl-bar{width:190px;height:3px;border-radius:3px;background:var(--chip-bg);overflow:hidden;position:relative}
  .pl-bar i{position:absolute;top:0;left:-45%;height:100%;width:45%;border-radius:3px;background:var(--grad);animation:plload 1.15s ease-in-out infinite}
  @keyframes plload{0%{left:-45%}100%{left:100%}}
  body.loading{overflow:hidden}

  /* v2: Portfolio-Status & Traction */
  .vstatus{display:inline-flex;align-items:center;gap:7px;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:5px 11px;border-radius:6px;border:1px solid var(--line);color:var(--muted);margin:0 0 14px}
  .vstatus::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
  .vstatus.s-live{color:#3ecf8e;border-color:rgba(62,207,142,.4)}
  .vstatus.s-build{color:#b163c6;border-color:rgba(162,79,176,.55)}
  .vstatus.s-valid{color:#e0a53a;border-color:rgba(224,165,58,.45)}
  .vtraction{font-size:13px;color:var(--muted-dim);margin:0 0 18px;padding-top:14px;border-top:1px solid var(--line);line-height:1.5}
  .crit{display:grid;grid-template-columns:1fr 1fr;gap:26px;max-width:900px;margin:0 auto}
  @media(max-width:760px){.crit{grid-template-columns:1fr}}
  .crit h3{font-size:20px;font-weight:800;margin-bottom:16px}
  .crit .yes{color:#3ecf8e}.crit .no{color:var(--muted-dim)}
  .crit .panel{position:relative;overflow:hidden;transition:transform .35s cubic-bezier(.22,1,.36,1),border-color .3s ease,box-shadow .35s ease}
  .crit .panel::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 65% 80% at 28% 0%,rgba(75,46,158,.16),transparent 70%);opacity:0;transition:opacity .35s ease;pointer-events:none}
  .crit .panel>*{position:relative;z-index:1}
  .crit .panel:hover{transform:translateY(-5px);border-color:rgba(75,46,158,.55);box-shadow:0 24px 52px rgba(75,46,158,.2)}
  .crit .panel:hover::before{opacity:1}

  /* Ideenverständnis */
  .igrid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
  @media(max-width:820px){.igrid{grid-template-columns:1fr}}
  .ideacard{background:var(--bg-card);border:1px solid var(--line);border-radius:6px;padding:34px 30px;transition:transform .3s ease,border-color .3s ease}
  .ideacard:hover{transform:translateY(-4px);border-color:rgba(75,46,158,.5)}
  .ideacard .ikick{font-size:13px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:12px}
  .ideacard h3{font-size:24px;font-weight:800;letter-spacing:-.02em;margin-bottom:12px;color:var(--ink)}
  .ideacard p{font-size:15.5px;color:var(--muted);line-height:1.6}

  .reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
  .reveal.in{opacity:1;transform:none}

  /* Fokus: kein weisser System-Ring, sondern dezenter Marken-Fokus */
  a:focus,button:focus,input:focus,.ptab:focus{outline:none}
  a:focus-visible,button:focus-visible,input:focus-visible,.ptab:focus-visible{
    outline:2px solid var(--magenta);outline-offset:3px;border-radius:6px}

  /* ROTATING RIBBON */
  .ribbon{padding:clamp(58px,9vw,112px) 20px;text-align:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--bg-2)}
  .ribbon h2{font-weight:800;font-size:clamp(26px,5.2vw,54px);line-height:1.14;letter-spacing:-.03em;color:var(--ink);margin:0}
  .ribbon .rot{display:inline-block}
  .ribbon .rot-word{background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
  .ribbon .rot-cur{display:inline-block;width:.055em;height:.9em;margin-left:.05em;vertical-align:-.06em;background:var(--magenta);animation:ribbonBlink 1.05s steps(1) infinite}
  @keyframes ribbonBlink{50%{opacity:0}}
  @media (prefers-reduced-motion: reduce){.ribbon .rot-cur{animation:none}}

  /* INSIGHTS */
  .ins-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
  .ins-card{display:flex;flex-direction:column;align-items:flex-start;gap:12px;background:var(--bg-card);border:1px solid var(--line);border-radius:6px;padding:28px 26px;text-decoration:none;color:var(--ink);transition:transform .35s ease,border-color .35s ease}
  .ins-card:hover{transform:translateY(-4px);border-color:rgba(75,46,158,.5)}
  .ins-tag{font-size:12px;font-weight:700;letter-spacing:.02em;color:#fff;background:var(--grad);padding:4px 12px;border-radius:6px}
  .ins-card h3{font-size:20px;font-weight:800;letter-spacing:-.02em;line-height:1.28;margin:2px 0 0;color:var(--ink)}
  .ins-card p{font-size:15px;color:var(--muted);line-height:1.55;flex:1;margin:0}
  .ins-more{font-size:14px;font-weight:700;color:var(--magenta)}
  @media (max-width:900px){.ins-grid{grid-template-columns:1fr}}

  /* ELEVATE LETTER */
  .letter-wrap{display:flex;align-items:center;justify-content:space-between;gap:44px;flex-wrap:wrap}
  .letter-copy{flex:1 1 320px;max-width:560px}
  .letter-cta{flex:1 1 320px;max-width:480px}
  .letter-form{display:flex;gap:12px;flex-wrap:wrap}
  .letter-form input{flex:1 1 200px;min-width:0;padding:15px 18px;border-radius:6px;border:1px solid var(--line);background:var(--bg-card);color:var(--ink);font-family:inherit;font-size:15px;outline:none;transition:border-color .25s ease}
  .letter-form input:focus{border-color:var(--purple)}
  .letter-form .btn{white-space:nowrap}
  .letter-note{font-size:12.5px;color:var(--muted-dim);margin:12px 0 0}

  /* BOOKING */
  .book-row{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
  .book-row .talkbtn{margin-top:52px}
  .book-note{margin:22px auto 0;font-size:14px;color:var(--muted-dim);text-align:center}
  @media(max-width:640px){.book-row .talkbtn{margin-top:24px}.book-row{gap:12px}}
  /* FACE STAGE: Portrait Tom -> Humanoid per Pinsel (Maus + automatisch), weicht beim Scrollen nach hinten */
  .face-stage{position:relative;height:175vh;margin-top:-78px}

  /* Hero: Hoehenlinien als ruhiger Hintergrund statt Nebel */
  .he-topo{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;color:rgba(125,100,248,.13);transform:scale(1.1);transition:color .8s ease;will-change:transform;-webkit-mask-image:radial-gradient(120% 90% at 50% 45%,#000 45%,transparent 92%);mask-image:radial-gradient(120% 90% at 50% 45%,#000 45%,transparent 92%)}
  .he-topo path{fill:none;stroke:currentColor;stroke-width:1.2}
  [data-theme="light"] .he-topo{color:rgba(75,46,158,.12)}
  @media(prefers-reduced-motion:reduce){.he-topo{transform:scale(1.1)!important}}
  .face-sticky{position:sticky;top:0;height:100vh;height:100svh;display:flex;align-items:center;justify-content:center;overflow:hidden}
  .face-wrap{position:absolute;left:50%;top:calc(78px - 9vh);height:min(135vh,200vw);aspect-ratio:2/3;transform:translateX(-50%);transform-origin:50% 40%;will-change:transform,opacity,filter;touch-action:pan-y;
    -webkit-mask-image:linear-gradient(to bottom,#000 var(--fa,62%),transparent var(--fb,84%)),linear-gradient(to right,transparent 0,#000 16%,#000 84%,transparent 100%);-webkit-mask-composite:source-in;mask-image:linear-gradient(to bottom,#000 var(--fa,62%),transparent var(--fb,84%)),linear-gradient(to right,transparent 0,#000 16%,#000 84%,transparent 100%);mask-composite:intersect}
  .face-wrap img,.face-wrap canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;user-select:none;-webkit-user-drag:none}
  .face-wrap canvas{pointer-events:none}
  .face-wrap img,.face-wrap canvas{transform:translate3d(var(--px,0px),var(--py,0px),0) scale(1.03);will-change:transform}
  .face-hint{position:absolute;left:50%;bottom:30px;transform:translateX(-50%);font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted-dim);white-space:nowrap;transition:opacity .5s;pointer-events:none}
  @media(hover:none){.face-hint{display:none}}
  .face-brush{position:absolute;left:0;top:0;width:10px;height:10px;border-radius:50%;pointer-events:none;opacity:0;z-index:3;transition:opacity .45s;will-change:transform;
    border:1px solid rgba(123,96,255,.75);background:radial-gradient(circle,rgba(91,60,246,.26),rgba(91,60,246,0) 70%);box-shadow:0 0 44px rgba(91,60,246,.55),inset 0 0 26px rgba(91,60,246,.38)}
  [data-theme="light"] .face-brush{border-color:rgba(91,60,246,.75)}
  .face-stage ~ .hero h1{transform:translateY(90px);opacity:0;transition:transform 1.1s cubic-bezier(.2,.7,.2,1),opacity .9s ease}
  .face-stage ~ .hero h1.rise-in{transform:none;opacity:1}
  .face-cta{position:absolute;z-index:4;bottom:64px;left:max(24px,calc((100vw - var(--maxw))/2 + 24px));display:flex;gap:10px;flex-wrap:wrap;transition:opacity .4s}
  .face-cta a{font-size:13px;font-weight:600;padding:9px 16px;border-radius:6px;color:var(--ink);border:1px solid var(--nav-border);
    background:rgba(255,255,255,.04);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transition:background .25s,border-color .25s,transform .25s}
  .face-cta a:hover{background:rgba(75,46,158,.28);border-color:rgba(138,79,192,.7);transform:translateY(-1px)}
  [data-theme="light"] .face-cta a{background:rgba(255,255,255,.35)}
  [data-theme="light"] .face-cta a:hover{background:rgba(75,46,158,.12)}
  @media(max-width:640px){.face-cta{bottom:28px;left:16px}.face-cta a{font-size:12px;padding:8px 13px}}
  .face-stage ~ .hero{margin-top:calc(78px - 49vh);z-index:2;-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 150px);mask-image:linear-gradient(to bottom,transparent 0,#000 150px)}
  /* ERKUNDE: Bild-Kacheln im Zickzack, gleiten beim Scrollen von links herein */
  #erkunden{overflow:hidden}
  .etiles{display:flex;flex-direction:column;max-width:1120px;margin:0 auto}
  .etile{width:44%;will-change:transform,opacity}
  .etile:nth-child(even){margin-left:auto;margin-top:-30%}
  .etile:nth-child(odd):not(:first-child){margin-top:-6%}
  .etile-cap{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:0 0 12px}
  .etile-img{position:relative;display:flex;align-items:flex-end;aspect-ratio:4/5;border-radius:6px;overflow:hidden;padding:clamp(22px,3vw,40px);text-decoration:none}
  .etile-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1);transition:transform .8s cubic-bezier(.2,.7,.2,1)}
  .etile-img:hover img{transform:scale(1.04)}
  .etile-big{position:relative;font-size:clamp(28px,3.6vw,52px);font-weight:900;letter-spacing:-.035em;line-height:1.0;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
  .t-indigo .etile-img{background:#4B2E9E}.t-indigo .etile-big{color:#fff}
  .t-offwhite .etile-img{background:#F2EFEA}.t-offwhite .etile-big{color:#111}
  .t-black .etile-img{background:#111;border:1px solid var(--line)}.t-black .etile-big{color:#7D64F8}
  .etile-in{position:relative;z-index:1;display:block;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
  .etile-img:hover .etile-in{transform:translateY(-6px)}
  .etile-big{display:block}
  .etile-desc{display:block;font-size:15.5px;line-height:1.55;margin:16px 0 0;max-width:42ch;color:rgba(255,255,255,.78);font-weight:500}
  .t-offwhite .etile-desc{color:rgba(17,17,17,.68)}
  .t-black .etile-desc{color:rgba(240,240,240,.66)}
  .etile-img img.etile-mark{position:absolute;inset:auto;top:clamp(22px,3vw,40px);left:clamp(22px,3vw,40px);
      width:min(62%,280px);height:auto;object-fit:contain;filter:drop-shadow(0 16px 34px rgba(0,0,0,.45));
      transform:translate3d(46vw,0,0) rotate(-2deg);will-change:transform,opacity;z-index:1}
  /* Foto-Kacheln: die Schrift steht auf dem Bild, nicht auf der Seite.
     Sie bleibt deshalb in beiden Modi hell, dazu ein weicher Verlauf fuer Kontrast.
     Vorher war der Titel im hellen Modus dunkel auf dunklem Foto. */
  .etile-foto::after{content:"";position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(to top,rgba(0,0,0,.74) 0,rgba(0,0,0,.30) 46%,rgba(0,0,0,0) 78%)}
  .etile-foto .etile-big{color:#fff}
  .etile-foto .etile-desc{color:rgba(255,255,255,.84)}
  .t-violet .etile-img{background:#5B3CF6}   /* Ice */
  .t-violet .etile-big{color:#fff}
  @media(max-width:760px){.etiles .etile:nth-child(n){width:100%;margin:0 0 56px}.etile-img{aspect-ratio:4/4.4}}
  /* === MENUE im Lando-Stil === */
  .mm-lando{display:block;padding:0;background:#141119;color:#f0f0f0;overflow:hidden}
  [data-theme="light"] .mm-lando{background:#f2efea;color:#111}
  .mm-topo{position:absolute;inset:0;width:100%;height:100%;color:rgba(125,100,248,.16);pointer-events:none;transform:scale(1.08);transition:transform 1.4s cubic-bezier(.2,.7,.2,1)}
  .mmenu.open .mm-topo{transform:none}
  .mm-grid{position:relative;height:100%;display:grid;grid-template-columns:minmax(0,56%) 1fr;gap:4vw;padding:clamp(90px,11vh,130px) clamp(20px,3vw,48px) 40px}
  .mm-photos{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,2.2vw,40px);align-content:center}
  .mm-ph{margin:0;position:relative;aspect-ratio:1/1;overflow:hidden;background:#0d0b12;opacity:0;transform:translate3d(0,50px,0);transition:opacity .7s ease,transform 1s cubic-bezier(.2,.7,.2,1);transition-delay:calc(.08s * var(--k))}
  .mm-ph:nth-child(2){margin-top:-6%} .mm-ph:nth-child(3){margin-top:6%}
  .mmenu.open .mm-ph{opacity:1;transform:none}
  .mm-ph img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05) brightness(.8);transition:filter .6s ease,transform 1.2s cubic-bezier(.2,.7,.2,1)}
  .mm-ph-cut img{object-fit:contain;object-position:50% 18%;transform:scale(1.25)}
  .mm-ph::after{content:"";position:absolute;inset:0;background:#4B2E9E;mix-blend-mode:color;opacity:.45;transition:opacity .6s}
  .mm-photos.hot .mm-ph{opacity:.35}
  .mm-photos.hot .mm-ph.on{opacity:1}
  .mm-ph.on img{filter:grayscale(0) brightness(1);transform:scale(1.05)}
  .mm-ph-cut.on img{transform:scale(1.32)}
  .mm-ph.on::after{opacity:0}
  .mm-side{display:flex;flex-direction:column;justify-content:center;align-items:flex-end;gap:clamp(28px,5vh,56px)}
  .mm-links{display:flex;flex-direction:column;align-items:flex-end}
  .mm-lando .mm-links a{position:relative;display:block;padding:0;font-size:clamp(40px,6.4vw,104px);font-weight:900;letter-spacing:-.035em;line-height:.98;text-transform:uppercase;color:inherit;opacity:0;transform:translate3d(70px,0,0);transition:opacity .6s ease,transform .9s cubic-bezier(.2,.7,.2,1),color .3s;transition-delay:calc(.15s + .06s * var(--k))}
  .mmenu.mm-lando.open .mm-links a{opacity:1;transform:none}
  .mm-lando .mm-links a span{position:relative;display:inline-block;transition:transform .45s cubic-bezier(.2,.7,.2,1)}
  .mm-lando .mm-links a span::after{content:"";position:absolute;left:-3%;right:-3%;top:50%;height:.3em;transform:translateY(-50%);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 20' preserveAspectRatio='none'%3E%3Cpath d='M0 10 C20 10 25 3 45 3 S70 17 90 17 S110 10 120 10' fill='none' stroke='%237D64F8' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E") center/100% 100% no-repeat;clip-path:inset(0 100% 0 0);transition:clip-path .55s cubic-bezier(.7,0,.2,1)}
  .mm-lando .mm-links a:hover span,.mm-lando .mm-links a:focus-visible span{transform:translateX(-14px)}
  .mm-lando .mm-links a:hover span::after,.mm-lando .mm-links a:focus-visible span::after,.mm-lando .mm-links a.is-current span::after{clip-path:inset(0 0 0 0)}
  .mm-lando .mm-links a.is-current{color:#8a8a93}
  .mm-lando .mm-links:hover a:not(:hover){color:rgba(240,240,240,.45)}
  [data-theme="light"] .mm-lando .mm-links:hover a:not(:hover){color:rgba(17,17,17,.4)}
  .mm-emblem{display:flex;flex-direction:column;align-items:center;gap:12px;margin-right:clamp(0px,6vw,120px);opacity:0;transition:opacity .8s ease .6s}
  .mmenu.open .mm-emblem{opacity:1}
  .mm-emblem img{height:54px;width:auto;filter:drop-shadow(0 0 10px rgba(125,100,248,.7))}
  .mm-emblem .mm-em-l{display:none}
  [data-theme="light"] .mm-emblem .mm-em-d{display:none} [data-theme="light"] .mm-emblem .mm-em-l{display:block}
  .mm-emblem span{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;opacity:.75}
  @media(max-width:860px){.mm-grid{grid-template-columns:1fr;padding-top:110px}.mm-photos{display:none}.mm-side{align-items:flex-start;justify-content:flex-start}.mm-links{align-items:flex-start}.mm-emblem{align-items:flex-start;margin:0}.mm-lando .mm-links a{font-size:clamp(38px,12vw,64px);transform:translate3d(-50px,0,0)}.mm-lando .mm-links a:hover span{transform:translateX(10px)}}
  @media(prefers-reduced-motion:reduce){.mm-ph,.mm-lando .mm-links a,.mm-topo{transition:none!important;transform:none!important}}
  /* === SEITENUEBERGANG: Schluesselloch durch das Signet === */
  .page-fx{position:fixed;inset:0;z-index:10000;pointer-events:none;overflow:hidden;visibility:hidden}
  .page-fx .fx-wall{position:absolute;inset:0;background:#4B2E9E;
    -webkit-mask-image:linear-gradient(#000,#000),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2250.000mm%22 height=%2250.000mm%22 viewBox=%220 0 512 512%22 role=%22img%22 aria-label=%22FRYSTYLE icon%22%3E%0A  %3Cpath d=%22M 143.6471 105.8246 C 143.6424 98.1497 151.9884 93.3832 158.5963 97.2869 L 364.4254 218.8832 C 371.9878 223.3509 368.8288 234.9424 360.0453 234.9553 L 152.0980 235.2604 C 147.4761 235.2672 143.7250 231.5239 143.7221 226.9020 L 143.6471 105.8246 Z M 150.1160 266.3031 C 144.0583 262.5356 146.7297 253.1882 153.8634 253.1908 L 358.3745 253.2646 C 365.3644 253.2671 368.2320 262.2397 362.5391 266.2956 L 265.0071 335.7820 C 264.1109 336.4206 262.9188 336.4579 261.9843 335.8768 L 150.1160 266.3031 Z M 143.6722 294.4811 C 143.6567 288.3713 150.4032 284.6611 155.5545 287.9464 L 240.4663 342.0996 C 245.6652 345.4153 245.8145 352.9543 240.7509 356.4732 L 157.0960 414.6082 C 151.5582 418.4566 143.9767 414.5050 143.9595 407.7613 L 143.6722 294.4811 Z%22 fill=%22%234B2E9E%22 fill-rule=%22nonzero%22/%3E%0A%3C/svg%3E");mask-image:linear-gradient(#000,#000),url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2250.000mm%22 height=%2250.000mm%22 viewBox=%220 0 512 512%22 role=%22img%22 aria-label=%22FRYSTYLE icon%22%3E%0A  %3Cpath d=%22M 143.6471 105.8246 C 143.6424 98.1497 151.9884 93.3832 158.5963 97.2869 L 364.4254 218.8832 C 371.9878 223.3509 368.8288 234.9424 360.0453 234.9553 L 152.0980 235.2604 C 147.4761 235.2672 143.7250 231.5239 143.7221 226.9020 L 143.6471 105.8246 Z M 150.1160 266.3031 C 144.0583 262.5356 146.7297 253.1882 153.8634 253.1908 L 358.3745 253.2646 C 365.3644 253.2671 368.2320 262.2397 362.5391 266.2956 L 265.0071 335.7820 C 264.1109 336.4206 262.9188 336.4579 261.9843 335.8768 L 150.1160 266.3031 Z M 143.6722 294.4811 C 143.6567 288.3713 150.4032 284.6611 155.5545 287.9464 L 240.4663 342.0996 C 245.6652 345.4153 245.8145 352.9543 240.7509 356.4732 L 157.0960 414.6082 C 151.5582 418.4566 143.9767 414.5050 143.9595 407.7613 L 143.6722 294.4811 Z%22 fill=%22%234B2E9E%22 fill-rule=%22nonzero%22/%3E%0A%3C/svg%3E");
    -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-composite:xor;mask-composite:exclude;
    -webkit-mask-size:100% 100%,50vmin 50vmin;mask-size:100% 100%,50vmin 50vmin;-webkit-mask-position:0 0,center;mask-position:0 0,center}
  .page-fx .fx-pic{position:absolute;left:calc(50% - 25vmin);top:calc(50% - 25vmin);width:50vmin;height:50vmin;background:#111 url("../../design/img/tom-fry.jpg") center 42%/cover no-repeat;
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2250.000mm%22 height=%2250.000mm%22 viewBox=%220 0 512 512%22 role=%22img%22 aria-label=%22FRYSTYLE icon%22%3E%0A  %3Cpath d=%22M 143.6471 105.8246 C 143.6424 98.1497 151.9884 93.3832 158.5963 97.2869 L 364.4254 218.8832 C 371.9878 223.3509 368.8288 234.9424 360.0453 234.9553 L 152.0980 235.2604 C 147.4761 235.2672 143.7250 231.5239 143.7221 226.9020 L 143.6471 105.8246 Z M 150.1160 266.3031 C 144.0583 262.5356 146.7297 253.1882 153.8634 253.1908 L 358.3745 253.2646 C 365.3644 253.2671 368.2320 262.2397 362.5391 266.2956 L 265.0071 335.7820 C 264.1109 336.4206 262.9188 336.4579 261.9843 335.8768 L 150.1160 266.3031 Z M 143.6722 294.4811 C 143.6567 288.3713 150.4032 284.6611 155.5545 287.9464 L 240.4663 342.0996 C 245.6652 345.4153 245.8145 352.9543 240.7509 356.4732 L 157.0960 414.6082 C 151.5582 418.4566 143.9767 414.5050 143.9595 407.7613 L 143.6722 294.4811 Z%22 fill=%22%234B2E9E%22 fill-rule=%22nonzero%22/%3E%0A%3C/svg%3E") 0 0/100% 100% no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2250.000mm%22 height=%2250.000mm%22 viewBox=%220 0 512 512%22 role=%22img%22 aria-label=%22FRYSTYLE icon%22%3E%0A  %3Cpath d=%22M 143.6471 105.8246 C 143.6424 98.1497 151.9884 93.3832 158.5963 97.2869 L 364.4254 218.8832 C 371.9878 223.3509 368.8288 234.9424 360.0453 234.9553 L 152.0980 235.2604 C 147.4761 235.2672 143.7250 231.5239 143.7221 226.9020 L 143.6471 105.8246 Z M 150.1160 266.3031 C 144.0583 262.5356 146.7297 253.1882 153.8634 253.1908 L 358.3745 253.2646 C 365.3644 253.2671 368.2320 262.2397 362.5391 266.2956 L 265.0071 335.7820 C 264.1109 336.4206 262.9188 336.4579 261.9843 335.8768 L 150.1160 266.3031 Z M 143.6722 294.4811 C 143.6567 288.3713 150.4032 284.6611 155.5545 287.9464 L 240.4663 342.0996 C 245.6652 345.4153 245.8145 352.9543 240.7509 356.4732 L 157.0960 414.6082 C 151.5582 418.4566 143.9767 414.5050 143.9595 407.7613 L 143.6722 294.4811 Z%22 fill=%22%234B2E9E%22 fill-rule=%22nonzero%22/%3E%0A%3C/svg%3E") 0 0/100% 100% no-repeat}
  .page-fx .fx-pic::before{content:"";position:absolute;inset:0;background:inherit;filter:invert(1);clip-path:inset(calc((1 - var(--neg,1)) * 100%) 0 0 0)}
  .page-fx .fx-pic::after{content:"";position:absolute;inset:0;background:#5B3CF6;opacity:var(--solid,0)}
  .page-fx.go,html.fx-in .page-fx{visibility:visible;pointer-events:auto}
  html.fx-in #preloader{display:none}
  /* WAS ICH MACHE UND WARUM: weisses Panel von rechts, Signet-Perspektiven */
  .warum{position:relative;overflow:hidden;padding:clamp(110px,13vw,220px) 0 clamp(40px,6vw,90px)}
  .wy-panel{position:relative;margin:0 0 0 clamp(16px,6vw,120px);background:#F2EFEA;color:#111;border-radius:6px 0 0 6px;overflow:hidden;will-change:transform}
  .wy-topo path:nth-child(2n){display:none}.wy-topo2 path:nth-child(2n){display:none}
  .wy-topo{position:absolute;inset:0;width:100%;height:100%;color:rgba(17,17,17,.07);pointer-events:none}
  .wy-grid{position:relative;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(28px,4vw,72px);padding:clamp(48px,7vw,120px) clamp(24px,5vw,90px) clamp(48px,7vw,110px);max-width:1320px;margin:0 auto}.wy-grid{padding:clamp(38px,4.4vw,72px) clamp(26px,3.6vw,62px) clamp(38px,4.4vw,72px)!important}.wy-grid{grid-template-columns:1fr;grid-template-areas:"h" "t";row-gap:clamp(16px,1.8vw,28px)}.wy-head{grid-area:h}.wy-text{grid-area:t}.wy-text{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"w w" "p1 p2";gap:clamp(20px,2.4vw,34px) clamp(28px,4vw,72px);align-items:start}.wy-text>.wy-why{grid-area:w;margin-bottom:0;align-self:start}.wy-text>.wy-p:nth-of-type(1){grid-area:p1}.wy-text>.wy-p:nth-of-type(2){grid-area:p2}.wy-text>.wy-p{text-align:left}@media(max-width:900px){.wy-text>.wy-p{text-align:left}}.wy-p{max-width:none}@media(max-width:900px){.wy-text{grid-template-columns:1fr;grid-template-areas:"w" "p1" "p2";gap:22px}}
  .wy-kick{font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#4B2E9E;margin:0 0 22px}
  .wy-h{margin:0;line-height:.9;letter-spacing:-.045em}
  .wy-l{display:block;padding-bottom:.06em;white-space:nowrap;clip-path:inset(-45% -4% -34% -4%)}
  .wy-l>span{display:inline-block;transform:translateY(105%);opacity:0;transition:transform 1s cubic-bezier(.2,.8,.2,1),opacity .6s ease}
  .wy-l1>span,.wy-l2>span{font-size:clamp(36px,5.6vw,104px);font-weight:900;text-transform:uppercase;color:#111}
  .wy-l3>span{font-size:clamp(34px,5.2vw,90px);font-weight:400;color:#4B2E9E;letter-spacing:-.035em;transition-delay:.24s}
  .wy-l2>span{transition-delay:.12s}
  .warum.in .wy-l>span{transform:none;opacity:1}
  .wy-why{border-left:4px solid #4B2E9E;padding:4px 0 4px 20px;margin:0 0 28px;opacity:0;transform:translateY(16px);transition:opacity .8s ease .45s,transform .8s cubic-bezier(.2,.8,.2,1) .45s}
  .warum.in .wy-why{opacity:1;transform:none}
  .wy-why-k{display:block;font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#6b6b6b;margin-bottom:6px}
  .wy-why-t{margin:0;font-size:clamp(26px,2.9vw,44px);font-weight:800;letter-spacing:-.03em;line-height:1.08;color:#111}
  .wy-p{font-size:clamp(16px,1.25vw,19px);line-height:1.65;color:#3a3a3a;margin:0 0 14px;max-width:60ch;opacity:0;transition:opacity .9s ease .6s}
  .wy-p strong{color:#4B2E9E;font-weight:400}
  /* Link im Warum-Absatz: muss sich von der violetten Auszeichnung
     unterscheiden lassen, sonst weiss niemand, was klickbar ist. */
  .wy-p a{color:#4B2E9E;border-bottom:1px solid rgba(75,46,158,.38);
        transition:border-color .2s ease,color .2s ease}
  .wy-p a:hover{border-bottom-color:#4B2E9E}
  [data-theme="light"] .wy-p a{color:#7D64F8;border-bottom-color:rgba(125,100,248,.45)}
  [data-theme="light"] .wy-p a:hover{border-bottom-color:#7D64F8}
  .warum.in .wy-p{opacity:1}
  .wy-side{display:flex;flex-direction:column;justify-content:center}.wy-text .wy-p:last-of-type{margin-bottom:0}
  .wy-kick2{color:#6b6b6b;margin-bottom:8px}
  .wy-sig{width:100%;max-width:460px;height:auto;overflow:visible}
  .wy-piece{cursor:pointer;outline:none}
  .wy-piece path{fill:#111;transform-box:fill-box;transform-origin:center;transform:translateY(220px);opacity:0;transition:fill .45s ease,transform 1s cubic-bezier(.2,.8,.2,1) var(--d),opacity .8s ease var(--d),filter .45s ease}
  .warum.in .wy-piece path{transform:none;opacity:1}
  .wy-piece text{font-family:inherit;opacity:0;transition:opacity .6s ease calc(var(--d) + .5s),transform .45s cubic-bezier(.2,.8,.2,1);transform-box:fill-box}
  .warum.in .wy-piece text{opacity:1}
  .wy-no{font-size:13px;font-weight:700;fill:#4B2E9E}
  .wy-lab{font-size:17px;font-weight:800;letter-spacing:.08em;fill:#8a8a8a;transition:fill .45s ease}
  .wy-piece:hover path{fill:#2a2a2a}
  .wy-piece.on path,.warum.in .wy-piece.on path{fill:#4B2E9E;transform:translateX(10px);filter:drop-shadow(0 10px 22px rgba(75,46,158,.35))}
  .wy-piece.on .wy-lab{fill:#111}
  .wy-piece.on text{transform:translateX(10px)}
  .wy-piece:focus-visible path{stroke:#5B3CF6;stroke-width:3}
  .wy-card{margin-top:18px;padding:22px 24px;border-radius:6px;background:#fff;border:1px solid rgba(17,17,17,.08);box-shadow:0 14px 40px rgba(17,17,17,.06);transition:opacity .22s ease,transform .22s ease;min-height:170px}
  .wy-card.swap{opacity:0;transform:translateY(8px)}
  .wy-card-top{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:10px}
  .wy-card-n{font-size:13px;font-weight:700;color:#4B2E9E}
  .wy-card-k{font-size:24px;font-weight:900;letter-spacing:-.02em;text-transform:uppercase;color:#111}
  .wy-card-s{font-size:13px;font-weight:600;color:#6b6b6b}
  .wy-card-t{margin:0;font-size:16px;line-height:1.62;color:#3a3a3a}
  .wy-hint{margin-top:14px;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#8a8a8a}
  .cursor-dot.on-light{background:#111}
  header.on-light{--ink:#111;--muted:#444;--line:rgba(17,17,17,.18)}
  header.on-light .logo-img{display:none!important} header.on-light .nav-logo-light{display:block}
  header.on-light .nav-icon-dark{display:none} header.on-light .nav-icon-light{display:block}
  .cursor-dot.on-light.hover{background:rgba(75,46,158,.85)}
  /* Helles Theme: schwarzer Einschub */
  [data-theme="light"] .wy-panel{background:#111;color:#f0f0f0;box-shadow:0 30px 80px rgba(17,17,17,.18)}
  [data-theme="light"] .wy-topo{color:rgba(255,255,255,.07)}
  [data-theme="light"] .wy-kick{color:#7D64F8}
  [data-theme="light"] .wy-kick2,[data-theme="light"] .wy-why-k,[data-theme="light"] .wy-hint{color:#9a9a9a}
  [data-theme="light"] .wy-l1>span,[data-theme="light"] .wy-l2>span,[data-theme="light"] .wy-why-t{color:#f0f0f0}
  [data-theme="light"] .wy-l3>span{color:#7D64F8}
  [data-theme="light"] .wy-why{border-left-color:#5B3CF6}
  [data-theme="light"] .wy-p{color:#bdbdbd} [data-theme="light"] .wy-p strong{color:#7D64F8;font-weight:400}
  [data-theme="light"] .wy-piece path{fill:#e9e9e9}
  [data-theme="light"] .wy-piece:hover path{fill:#fff}
  [data-theme="light"] .wy-piece.on path,[data-theme="light"] .warum.in .wy-piece.on path{fill:#5B3CF6;filter:drop-shadow(0 0 26px rgba(91,60,246,.55))}
  [data-theme="light"] .wy-no{fill:#7D64F8} [data-theme="light"] .wy-lab{fill:#777} [data-theme="light"] .wy-piece.on .wy-lab{fill:#fff}
  [data-theme="light"] .wy-card{background:#1b1b1b;border-color:rgba(255,255,255,.08);box-shadow:none}
  [data-theme="light"] .wy-card-n{color:#7D64F8} [data-theme="light"] .wy-card-k{color:#fff} [data-theme="light"] .wy-card-s{color:#9a9a9a} [data-theme="light"] .wy-card-t{color:#bdbdbd}
  .cursor-dot.on-dark{background:#fff}
  .cursor-dot.on-dark.hover{background:rgba(91,60,246,.85)}
  header.on-dark{--ink:#f0f0f0;--muted:#bbb;--line:rgba(255,255,255,.18)}
  header.on-dark .logo-img{display:block!important} header.on-dark .nav-logo-light{display:none!important}
  header.on-dark .nav-icon-dark{display:block!important} header.on-dark .nav-icon-light{display:none!important}
  @media(pointer:fine){.wy-piece{cursor:none}}
  @media(max-width:900px){.wy-grid{grid-template-columns:1fr;grid-template-areas:"h" "t"}.wy-panel{margin:0 10px}.wy-sig{max-width:380px}}
  @media(prefers-reduced-motion:reduce){.wy-l>span,.wy-why,.wy-p,.wy-piece path,.wy-piece text{transition:none!important;transform:none!important;opacity:1!important}}
  /* PARTNER im Lando-Stil: Handschrift "Collabs" im Hintergrund */
  .collab{position:relative;overflow:hidden;padding:clamp(90px,11vw,170px) 0 clamp(70px,8vw,120px)}
  .cl-hand{position:absolute;left:clamp(10px,2.5vw,44px);top:50%;width:min(735px,58vw);height:auto;transform:translate(0,-52%) rotate(-11deg);pointer-events:none;z-index:0;overflow:visible;opacity:1;transition:opacity 1.6s ease 2.9s}
  .collab.in .cl-hand{opacity:.32}
  [data-theme="light"] .collab.in .cl-hand{opacity:.28}
  .cl-hand path{fill:#5B3CF6;fill-opacity:0;stroke:#5B3CF6;stroke-width:34;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;opacity:.9}
  .collab.in .cl-hand path{stroke-dashoffset:0;fill-opacity:1;transition:stroke-dashoffset .9s cubic-bezier(.5,0,.3,1) calc(var(--i)*.22s),fill-opacity .5s ease calc(var(--i)*.22s + .6s)}
  [data-theme="light"] .cl-hand path{opacity:.95}
  .cl-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:40px;align-items:start}
  .cl-h{margin:0;line-height:.9;letter-spacing:-.04em}
  .cl-h .cl-a{display:block;font-size:clamp(52px,8vw,132px);font-weight:900;text-transform:uppercase;color:var(--ink)}
  .cl-h .cl-b{display:block;font-size:clamp(34px,5.2vw,86px);font-weight:400;letter-spacing:-.035em;color:var(--ink);margin-top:.06em}
  .cl-p{margin:14px 0 0;font-size:clamp(17px,1.4vw,21px);line-height:1.55;color:var(--ink);max-width:34ch}
  .collab .marquee{position:relative;z-index:1;max-width:none;margin:clamp(70px,9vw,140px) 0 0}
  .collab .mtrack{gap:clamp(70px,8vw,130px)}
  .collab .mtrack img{height:40px}
  .collab .mtrack .word{font-size:23px;line-height:30px}
  @media(max-width:860px){.cl-grid{grid-template-columns:1fr;gap:18px}.cl-hand{width:62vw;top:58%;left:10px;transform:translate(0,-50%) rotate(-11deg)}}
  @media(prefers-reduced-motion:reduce){.cl-hand path{stroke-dashoffset:0;fill-opacity:1}}
  /* SOCIAL-KARUSSELL: Faecher aus Bildkarten */
  .social{overflow:hidden;padding-bottom:clamp(60px,7vw,110px)}
  .sc-h{text-align:center;margin:0;line-height:.92;letter-spacing:-.04em}
  .sc-a{display:block;font-size:clamp(46px,7vw,112px);font-weight:900;text-transform:uppercase;color:var(--ink)}
  .sc-b{display:block;font-size:clamp(32px,4.8vw,78px);font-weight:400;letter-spacing:-.035em;color:var(--ink)}
  .sc-stage{position:relative;height:clamp(357px,44vw,612px);margin-top:clamp(20px,3vw,40px);outline:none}
  .sc-card{position:absolute;left:50%;top:50%;margin:0;width:clamp(170px,20.4vw,323px);aspect-ratio:4/6.2;border-radius:clamp(22px,2.8vw,44px);overflow:hidden;background:#111;cursor:pointer;
    box-shadow:0 24px 60px rgba(0,0,0,.35);transition:transform 1s cubic-bezier(.2,.8,.2,1) var(--dl,0s),opacity .6s ease,box-shadow .4s ease}
  .sc-card:not(.is-on):hover{box-shadow:0 34px 80px rgba(0,0,0,.45)}
  .sc-card img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease}
  .sc-card:hover img{transform:scale(1.04)}
  [data-theme="light"] .sc-card{box-shadow:0 24px 60px rgba(17,17,17,.18)}
  .sc-foot{text-align:center;margin-top:clamp(24px,3vw,40px)}
  .sc-follow{margin:0 0 18px;font-size:clamp(22px,2.4vw,34px);font-weight:400;letter-spacing:-.02em;color:var(--ink)}
  .sc-links{display:flex;justify-content:center;flex-wrap:wrap;gap:12px 34px}
  .sc-links a{font-size:15px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);text-decoration:none;position:relative}
  .sc-links a::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:#5B3CF6;transform:scaleX(0);transform-origin:left;transition:transform .35s ease}
  .sc-links a:hover::after{transform:scaleX(1)}
  @media(pointer:fine){.sc-card{cursor:none}}
  @media(max-width:700px){.sc-card{width:48vw}.sc-stage{height:95vw}}
  @media(prefers-reduced-motion:reduce){.sc-card{transition:none}}
  /* === TITEL-SYSTEM (ueberall gleich): H1 Seitentitel, H2 Abschnitt, H3 Karte/Schritt === */
  :root{--h1:clamp(40px,5.8vw,84px);--h2:clamp(30px,3.8vw,54px);--h3:clamp(20px,1.6vw,24px)}
  main h1:not(.tw){font-size:var(--h1)!important;font-weight:900;letter-spacing:-.035em;line-height:1.02;color:var(--ink)}
  .section-head h1{margin:0 auto}
  .section-head:has(h1){max-width:1080px}
  main h2:not(.slot,.h-lbl):not(.wy-h):not(.cl-h):not(.sc-h){font-size:var(--h2)!important;line-height:1.06}
  .wy-l1>span,.wy-l2>span,.cl-h .cl-a,.sc-a{font-size:var(--h2)!important}
  .wy-l3>span,.cl-h .cl-b,.sc-b{font-size:calc(var(--h2)*.8)!important}
  main h3{font-size:var(--h3)!important;line-height:1.25}
  h1.hello{display:flex;justify-content:center;align-items:center;gap:.28em;text-transform:none;letter-spacing:-.035em;margin-bottom:18px}
  h1.hello img{width:.9em;height:.9em}
  /* === FOOTER im Lando-Stil === */
  footer.lf{--lf-bg:#141414;background:#4B2E9E;padding:clamp(40px,5vw,70px) clamp(8px,1.2vw,18px) 0;border:0;color:#f0f0f0;position:relative;overflow:hidden}
  .lf-panel{position:relative;background:var(--lf-bg);border-radius:6px;min-height:min(620px,78vh);padding:clamp(60px,6vw,90px) clamp(20px,4vw,70px) clamp(100px,8vw,120px);overflow:visible;isolation:isolate}
  .lf-panel{--lf-tabh:clamp(34px,3.6vw,56px);--lf-tabw:min(640px,60vw)}.lf-tab{position:absolute;left:50%;top:1px;width:var(--lf-tabw);height:var(--lf-tabh);transform:translate(-50%,-100%);fill:var(--lf-bg);z-index:-2}
  .lf-topow{position:absolute;left:-2.5%;right:-2.5%;top:calc(-1*var(--lf-tabh) - 4%);bottom:-4%;overflow:hidden;pointer-events:none;z-index:-1}.lf-topo{position:absolute;inset:0;width:100%;height:100%;color:rgba(125,100,248,.10);pointer-events:none;border-radius:inherit}
  .lf-head{position:relative;text-align:center;z-index:2}
  .lf-claim{margin:0;font-size:clamp(34px,4.8vw,76px)!important;line-height:.98;letter-spacing:-.04em;font-weight:900;color:#f0f0f0}
  .lf-claim span{display:block}
  .lf-claim .lf-acc{color:#7D64F8;font-weight:400;letter-spacing:-.035em}
  .lf-col{position:absolute;top:42%;display:flex;flex-direction:column;align-items:center;gap:4px;z-index:2;opacity:0;transition:opacity .9s ease .5s,transform .9s cubic-bezier(.2,.8,.2,1) .5s}
  .lf-left{left:clamp(20px,11vw,220px);transform:translateX(-20px)} .lf-right{right:clamp(20px,11vw,220px);transform:translateX(20px)}
  footer.lf.in .lf-col{opacity:1;transform:none}
  .lf-lab{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#9a9a9a;margin-bottom:10px}
  .lf-col>a{font-size:clamp(18px,1.9vw,30px);font-weight:900;text-transform:uppercase;letter-spacing:-.01em;line-height:1.12;color:#f0f0f0;transition:color .25s}
  .lf-col>a:hover{color:#7D64F8}
  .lf-col>a.lf-hi{color:#7D64F8;margin-top:22px}
  .lf-adr{font-style:normal;display:flex;flex-direction:column;align-items:center;gap:3px;margin-top:22px;font-size:13px;color:#9a9a9a}
  .lf-adr a{color:#bdbdbd}.lf-adr a:hover{color:#7D64F8}
  .lf-cta{position:absolute;left:50%;bottom:clamp(30px,3.4vw,48px);transform:translateX(-50%);z-index:3;display:inline-flex;align-items:center;gap:10px;background:#5B3CF6;color:#fff;font-weight:800;font-size:15px;letter-spacing:.06em;text-transform:uppercase;padding:16px 26px;border-radius:6px;box-shadow:0 12px 40px rgba(91,60,246,.45);transition:transform .25s,box-shadow .25s}
  .lf-cta:hover{transform:translateX(-50%) translateY(-2px);box-shadow:0 18px 50px rgba(91,60,246,.6)}
  .lf-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding:18px clamp(12px,1.6vw,24px) 20px;font-size:13px;font-weight:600;color:#fff}
  .lf-copy{display:flex;align-items:center;gap:16px}.lf-copy img{height:26px;width:auto}
  .lf-legal{display:flex;gap:22px}.lf-legal a,.lf-legal button{color:#fff;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.lf-legal a:hover,.lf-legal button:hover{text-decoration:underline}
  header.on-dark{--ink:#f0f0f0;--muted:#bbb;--line:rgba(255,255,255,.18)}
  header.on-dark .logo-img{display:block!important} header.on-dark .nav-logo-light{display:none!important}
  header.on-dark .nav-icon-dark{display:block!important} header.on-dark .nav-icon-light{display:none!important}
  @media(max-width:900px){
    .lf-panel{min-height:0;padding:70px 20px 30px;display:flex;flex-direction:column;align-items:center}
    .lf-col{position:static;transform:none;margin-top:30px}
        .lf-cta{position:static;transform:none;margin-top:30px}.lf-cta:hover{transform:translateY(-2px)}
    .lf-bottom{justify-content:center;text-align:center}.lf-copy{flex-direction:column;gap:8px}
  }
  @media(prefers-reduced-motion:reduce){.lf-col{transition:none!important;clip-path:none!important;opacity:1!important}}
  .lf-mid{position:absolute;left:50%;top:61%;transform:translate(-50%,-50%);perspective:900px;z-index:1;pointer-events:none}
  .lf-float{transition:transform .2s linear;transform-style:preserve-3d}
  .lf-icon{display:block;height:clamp(140px,16vw,220px);width:auto;opacity:0;transform:scale(.7) rotate(-10deg);animation:lfBob 6s ease-in-out infinite;
    filter:drop-shadow(0 0 10px rgba(125,100,248,.95)) drop-shadow(0 0 34px rgba(91,60,246,.8)) drop-shadow(0 0 80px rgba(91,60,246,.45));transition:opacity 1s ease .2s,transform 1.2s cubic-bezier(.2,.8,.2,1) .2s}
  footer.lf.in .lf-icon{opacity:1;transform:none}
  @keyframes lfBob{0%,100%{translate:0 -8px;filter:drop-shadow(0 0 10px rgba(125,100,248,.95)) drop-shadow(0 0 34px rgba(91,60,246,.8)) drop-shadow(0 0 80px rgba(91,60,246,.45))}50%{translate:0 10px;filter:drop-shadow(0 0 14px rgba(125,100,248,1)) drop-shadow(0 0 48px rgba(91,60,246,.95)) drop-shadow(0 0 110px rgba(91,60,246,.6))}}
  @media(max-width:900px){.lf-mid{position:relative;left:auto;top:auto;transform:none;margin:34px 0 0}.lf-icon{height:150px}}
  @media(prefers-reduced-motion:reduce){.lf-icon{animation:none;opacity:1;transform:none}}
  /* Footer schlank: ohne Claim und Signet, Seiten links, Button Mitte, Social rechts */
  .lf-panel{min-height:0!important;display:grid;grid-template-columns:1fr auto 1fr;grid-template-areas:"l c r";align-items:start;gap:30px;padding:clamp(56px,6vw,80px) clamp(20px,4vw,70px)!important}
  .lf-panel>.lf-left{grid-area:l}.lf-panel>.lf-right{grid-area:r}.lf-panel>.lf-cta{grid-area:c;align-self:center}
  .lf-col{position:static!important;transform:none}
  .lf-cta{position:static!important;transform:none!important}.lf-cta:hover{transform:translateY(-2px)!important}
  @media(max-width:900px){.lf-panel{grid-template-columns:1fr;grid-template-areas:"l" "r" "c";justify-items:center}}
  /* Footer-Rahmen weiss statt violett */
  footer.lf{background:#fff!important}
  .lf-bottom{color:#111}.lf-legal a,.lf-legal button{color:#111}.lf-legal a:hover,.lf-legal button:hover{color:#4B2E9E}
  .lf-copy .lf-lock-d{display:none}.lf-copy .lf-lock-l{display:block}
  /* Warum rechts: Teile kommen einzeln von unten */
  .wy-kick2,.wy-card,.wy-hint{opacity:0;transform:translateY(60px);transition:opacity .8s ease,transform 1s cubic-bezier(.2,.8,.2,1)}
  .wy-kick2{transition-delay:.05s}.wy-card{transition-delay:.75s}.wy-hint{transition-delay:.95s}
  .warum.in .wy-kick2,.warum.in .wy-card,.warum.in .wy-hint{opacity:1;transform:none}
  .warum.in .wy-card.swap{opacity:0;transform:translateY(8px);transition-delay:0s}
  .wy-piece text{transform:translateY(30px)}.warum.in .wy-piece text{transform:none}
  .warum.in .wy-piece.on text{transform:translateX(10px)}
  @media(prefers-reduced-motion:reduce){.wy-kick2,.wy-card,.wy-hint{opacity:1;transform:none;transition:none}}
  /* Dunkles Theme: Footer invertiert (Rahmen schwarz wie Seite, Flaeche hell) */
  html:not([data-theme="light"]) footer.lf{background:var(--bg)!important;--lf-bg:#F2EFEA}
  html:not([data-theme="light"]) .lf-topo{color:rgba(75,46,158,.12)}
  html:not([data-theme="light"]) .lf-lab{color:#6b6b6b}
  html:not([data-theme="light"]) .lf-col>a{color:#111}
  html:not([data-theme="light"]) .lf-col>a:hover,html:not([data-theme="light"]) .lf-col>a.lf-hi{color:#4B2E9E}
  html:not([data-theme="light"]) .lf-adr{color:#6b6b6b} html:not([data-theme="light"]) .lf-adr a{color:#3a3a3a} html:not([data-theme="light"]) .lf-adr a:hover{color:#4B2E9E}html:not([data-theme="light"]) .lf-bottom,html:not([data-theme="light"]) .lf-legal a,html:not([data-theme="light"]) .lf-legal button{color:#f0f0f0}
  html:not([data-theme="light"]) .lf-copy .lf-lock-l{filter:invert(1) hue-rotate(180deg)}
  /* Footer: Hoehenlinien bewegen sich mit der Maus */
  .lf-topo{transition:color .6s ease;will-change:transform}
  .lf-topo path{transition:stroke-width .6s ease}
  footer.lf.hov .lf-topo{color:rgba(125,100,248,.28)}
  html:not([data-theme="light"]) footer.lf.hov .lf-topo{color:rgba(75,46,158,.30)}
  /* Warum rechts: Dreiecke und Texte fliegen zusammengewuerfelt von unten herein und setzen sich zusammen */
  .warum .wy-dice,.warum.in .wy-dice{opacity:0;transform:translate(var(--sx,0px),var(--sy,260px)) rotate(var(--sr,0deg)) scale(var(--ss,1));transition:opacity .5s ease var(--dl,0s),transform 1.25s cubic-bezier(.22,1.25,.36,1) var(--dl,0s)!important}
  .wy-side.up .wy-dice{opacity:1;transform:none}
  .wy-side.up .wy-piece.on path.wy-dice{transform:translateX(10px)}
  .wy-side.up .wy-piece.on text.wy-dice{transform:translateX(10px)}
  .wy-side.up .wy-card.swap{opacity:0;transform:translateY(8px);transition-delay:0s!important}
  .wy-piece path.wy-dice{transform-box:fill-box;transform-origin:center}
  .wy-piece text.wy-dice{transform-box:fill-box;transform-origin:center}
  @media(prefers-reduced-motion:reduce){.warum .wy-dice{opacity:1!important;transform:none!important;transition:none!important}}

  /* PERSPEKTIVEN als eigene Sektion auf dunklem Grund */
  .persp{padding:clamp(56px,7vw,110px) 0 clamp(90px,10vw,150px);overflow:visible}
  .ps-wrap{max-width:1320px;margin:0 auto;padding:0 clamp(24px,5vw,90px)}
  .persp .wy-side{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);grid-template-areas:"k k" "sig card" "hint card";gap:10px clamp(30px,4.5vw,80px);align-items:start}
  .persp .wy-kick2{grid-area:k;margin-bottom:10px}
  .persp .wy-sig{grid-area:sig;align-self:center;justify-self:center;max-width:520px}
  .persp .wy-card{grid-area:card;align-self:center;margin-top:0}
  .persp .wy-hint{grid-area:hint;justify-self:center;text-align:center;margin-top:10px}
  @media(max-width:900px){.persp .wy-side{grid-template-columns:1fr;grid-template-areas:"k" "sig" "card" "hint"}.persp .wy-sig{max-width:380px}}
  /* dunkler Grund: Signet hell, Karte dunkel */
  .persp .wy-kick2,.persp .wy-hint{color:#9a9a9a}
  .persp .wy-piece path{fill:#e9e9e9}
  .persp .wy-piece:hover path{fill:#fff}
  .persp .wy-piece.on path,.persp.in .wy-piece.on path{fill:#5B3CF6;filter:drop-shadow(0 0 26px rgba(91,60,246,.55))}
  .persp .wy-no{fill:#7D64F8} .persp .wy-lab{fill:#777} .persp .wy-piece.on .wy-lab{fill:#fff}
  .persp .wy-card{background:#141414;border-color:rgba(255,255,255,.08);box-shadow:none}
  .persp .wy-card-n{color:#7D64F8} .persp .wy-card-k{color:#fff} .persp .wy-card-s{color:#9a9a9a} .persp .wy-card-t{color:#bdbdbd}
  /* heller Modus: umgekehrt */
  [data-theme="light"] .persp .wy-kick2,[data-theme="light"] .persp .wy-hint{color:#6b6b6b}
  [data-theme="light"] .persp .wy-piece path{fill:#111}
  [data-theme="light"] .persp .wy-piece:hover path{fill:#2a2a2a}
  [data-theme="light"] .persp .wy-piece.on path,[data-theme="light"] .persp.in .wy-piece.on path{fill:#4B2E9E;filter:drop-shadow(0 10px 22px rgba(75,46,158,.35))}
  [data-theme="light"] .persp .wy-no{fill:#4B2E9E} [data-theme="light"] .persp .wy-lab{fill:#8a8a8a} [data-theme="light"] .persp .wy-piece.on .wy-lab{fill:#111}
  [data-theme="light"] .persp .wy-card{background:#fff;border-color:rgba(17,17,17,.08);box-shadow:0 14px 40px rgba(17,17,17,.06)}
  [data-theme="light"] .persp .wy-card-n{color:#4B2E9E} [data-theme="light"] .persp .wy-card-k{color:#111} [data-theme="light"] .persp .wy-card-s{color:#6b6b6b} [data-theme="light"] .persp .wy-card-t{color:#3a3a3a}
  .wy-card{position:relative;overflow:hidden}
  .wy-prog{display:none}
  /* Footer Mitte: Abschluss-Frage der Seite + Button */
  .lf-midcta{grid-area:c;align-self:center;text-align:center;max-width:460px;margin:0 auto}
  .lf-midcta h2{font-size:clamp(24px,2.4vw,36px)!important;font-weight:900;letter-spacing:-.03em;line-height:1.08;margin:0 0 22px;color:#f0f0f0}
  html:not([data-theme="light"]) .lf-midcta h2{color:#111}
  .lf-midcta .lf-cta{position:static!important;transform:none!important;display:inline-flex}
  .lf-midcta .lf-cta:hover{transform:translateY(-2px)!important}
  /* Warum-Panel: Hoehenlinien bewegen sich mit der Maus (wie Footer) */
  .wy-topo{transition:color .6s ease;will-change:transform;transform:scale(1.08)}
  .wy-panel.hov .wy-topo{color:rgba(91,60,246,.22)}
  [data-theme="light"] .wy-panel.hov .wy-topo{color:rgba(125,100,248,.28)}
  /* feine Linien laufen leicht ueber das Panel hinaus (wie Footer) */
  .wy-topo2{position:absolute;top:calc(clamp(110px,13vw,220px) - 26px);bottom:calc(clamp(40px,6vw,90px) - 20px);left:0;right:0;width:100%;height:auto;color:rgba(125,100,248,.12);pointer-events:none;z-index:3;transform:scale(1.08);will-change:transform;transition:color .6s ease;
    -webkit-mask-image:radial-gradient(ellipse 71% 66% at 50% 50%,transparent 84%,#000 100%);mask-image:radial-gradient(ellipse 71% 66% at 50% 50%,transparent 84%,#000 100%)}
  .wy-topo2 path{stroke-width:1}
  .warum.hov .wy-topo2{color:rgba(125,100,248,.22)}
  [data-theme="light"] .wy-topo2{color:rgba(75,46,158,.16)}
  @media(max-width:700px){.wy-topo2{display:none}}

  /* Einheitlicher Abstand zwischen allen Sektionen */
  :root{--sec:clamp(74px,8.4vw,124px)}
  main>section:not(.hero):not(.cz-hero):not(.face-stage):not(.cz-open):not(.tcases):not(.cz-cover):not(.hd-sec):not(.rpsec){padding-top:var(--sec)!important;padding-bottom:var(--sec)!important}
  main>section.cz-cover{padding-bottom:var(--sec)!important}

  /* Street Smarts als Partner-Schriftzug */
  .mtrack .ss-word{text-transform:uppercase;letter-spacing:.01em;font-weight:700}

  /* Warum-Panel: ruhige, ausgewogene Komposition */
  .wy-grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)!important;grid-template-areas:"k k" "h h" "rule rule" "why p1" "why p2"!important;column-gap:clamp(30px,4.4vw,80px)!important;row-gap:0!important;align-items:start}
  .wy-head{display:contents!important}
  .wy-text{display:contents!important}
  .wy-kick{grid-area:k;margin:0 0 clamp(18px,2.2vw,30px)!important}
  .wy-h{grid-area:h;margin:0!important}
  .wy-text>.wy-why{grid-area:why;align-self:start;margin:0!important;border-left-width:3px;padding:2px 0 2px clamp(16px,1.4vw,22px)}
  .wy-why-t{font-size:clamp(22px,2.3vw,36px)!important;line-height:1.14}
  .wy-grid::after{content:"";grid-area:rule;height:1px;background:rgba(17,17,17,.12);margin:clamp(28px,3.4vw,52px) 0 clamp(26px,3vw,42px)}
  [data-theme="light"] .wy-grid::after{background:rgba(255,255,255,.12)}
  .wy-text>.wy-p:nth-of-type(1){grid-area:p1;margin:0 0 clamp(14px,1.4vw,20px)!important}
  .wy-text>.wy-p:nth-of-type(2){grid-area:p2;margin:0!important}
  .wy-p{text-align:left!important;font-size:clamp(15px,1.15vw,18px)!important;line-height:1.72;max-width:62ch}
  @media(max-width:900px){.wy-grid{grid-template-columns:1fr!important;grid-template-areas:"k" "h" "rule" "why" "p1" "p2"!important}
    .wy-text>.wy-why{margin-bottom:24px!important}}

  /* Hero: Schrift gross und in Versalien */
  .hero h1.tw{font-size:clamp(34px,6.4vw,94px)!important;line-height:.94!important;letter-spacing:-.04em!important;text-transform:uppercase!important}
  /* Hero: Buchstaben-Schweif beim Scrollen */
  .hero h1.wp .accent .wp-w{background-image:linear-gradient(90deg,#5B3CF6 0%,#8a4fc0 0%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
  .hero h1.wp [data-tw]{display:inline-block;overflow:visible;clip-path:inset(-.22em -.4em 0 -.4em);white-space:nowrap;padding:0;margin:0;vertical-align:top;will-change:transform}
  .hero h1.wp .wp-w{display:inline-block;will-change:transform,opacity;opacity:0;transform:translateY(125%);transition:transform .18s linear,opacity .18s linear}
  .hero h1.wp .ol .wp-p{-webkit-text-fill-color:transparent;-webkit-text-stroke:1.5px var(--ink)}
  @media(prefers-reduced-motion:reduce){.hero h1.wp .wp-w{opacity:1!important;transform:none!important;transition:none}}
  .hero h1.wp{overflow:visible}
  .hero{overflow:visible!important}
  @media(prefers-reduced-motion:reduce){.hero h1.wp .wp-c{transform:none!important;opacity:1!important}}

  /* Partner-Sektion klar abgegrenzt */
  main>section.collab{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}


  /* === MODUS-FAHNE am rechten Rand === */
  .modeflag{position:fixed;right:0;top:30%;transform:translateY(-50%);z-index:150;
            display:block;padding:20px 10px 20px 11px;cursor:pointer;
            background:var(--bg);color:var(--ink);font-family:inherit;
            border:1px solid var(--nav-border);border-right:none;border-radius:6px 0 0 6px;
            writing-mode:vertical-rl;text-orientation:mixed;
            font-size:11px;font-weight:800;letter-spacing:.3em;text-transform:uppercase;
            transition:padding-left .3s ease,background .3s ease,color .3s ease;
            -webkit-appearance:none;appearance:none}
  .modeflag::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--grad);opacity:.85}
  .modeflag:hover{padding-left:18px}
  .mf-w{display:block}
  .mf-tech{display:none}
  [data-theme="light"] .modeflag .mf-people{display:none}
  [data-theme="light"] .modeflag .mf-tech{display:block}
  @media(max-width:760px){.modeflag{font-size:10px;padding:14px 7px 14px 8px;letter-spacing:.22em}}
  @media(prefers-reduced-motion:reduce){.modeflag{transition:none}}

/* Heller Modus: die Fuellung beim Rueberfahren war zu blass fuer weisse Schrift. */
[data-theme="light"] .vcard::before{background:linear-gradient(to top,rgba(75,46,158,.98),rgba(75,46,158,.88))}

/* ElevateLab-Kachel: das Signet wird vom Skript bewegt, darum hier kein
   transform, sondern Schein und Flaeche. */
.etile-img img.etile-mark{transition:filter .45s ease}
.etile-img:hover img.etile-mark{filter:drop-shadow(0 22px 46px rgba(0,0,0,.55)) brightness(1.08)}
/* Die violette Kachel behaelt ihre Farbe, kein Wechsel beim Rueberfahren. */

/* MARKTBILD: steht jetzt in shared/css/markt.css, weil Startseite und
   ElevateLab dieselben Kacheln zeigen. */

/* Jede Social-Karte fuehrt auf ihren Beitrag. */
.sc-link{display:block;width:100%;height:100%;border-radius:inherit;overflow:hidden;
  -webkit-tap-highlight-color:transparent}
.sc-card:not(.is-on) .sc-link{cursor:pointer}
.sc-link:focus-visible{outline:3px solid #7D64F8;outline-offset:3px}

  /* Eine Kundenstimme direkt unter dem Hero. */
  /* Kundenstimmen: helle Flaeche auf dunkler Seite, damit die Aussage traegt.
     Links die Aussage, rechts die anderen Stimmen zum Durchklicken. */
  .stimme .wrap{max-width:1180px;margin:0 auto;text-align:center}
  .st-rahmen{display:grid;grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;gap:clamp(12px,1.6vw,26px)}
  .st-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(200px,270px);
    gap:clamp(26px,3vw,48px);text-align:left;align-items:stretch;
    background:#F2EFEA;border-radius:8px;
    padding:clamp(30px,3.4vw,52px) clamp(26px,3vw,48px);
    transition:opacity .2s ease}
  .st-panel.swap{opacity:0}
  .st-haupt{position:relative;display:flex;flex-direction:column;min-width:0}
  .st-anf{position:absolute;left:-6px;top:-30px;font-size:clamp(64px,7vw,110px);
    font-weight:900;line-height:1;color:rgba(91,60,246,.18);pointer-events:none}
  .st-q p{margin:0;font-size:clamp(20px,2.05vw,30px);font-weight:800;letter-spacing:-.026em;
    line-height:1.28;color:#111}
  .st-fuss{margin-top:auto;padding-top:clamp(22px,2.4vw,34px)}
  .st-who{display:flex;flex-direction:column;gap:2px}
  .st-who b{font-size:15px;font-weight:800;letter-spacing:.01em;color:#111}
  .st-who span{font-size:14px;font-weight:600;color:rgba(17,17,17,.62)}
  /* Die Pfeile stehen neben der Flaeche, nicht darin. */
  .st-b{appearance:none;-webkit-appearance:none;cursor:pointer;
    border:1px solid var(--nav-border,rgba(255,255,255,.18));background:none;
    width:clamp(42px,3.4vw,52px);height:clamp(42px,3.4vw,52px);border-radius:6px;
    display:flex;align-items:center;justify-content:center;
    font-family:inherit;font-size:24px;line-height:1;color:var(--ink);
    transition:border-color .2s ease,background .2s ease,transform .2s ease}
  .st-b:hover{border-color:#7D64F8;background:rgba(125,100,248,.12);transform:translateY(-1px)}
  .st-b:focus-visible{outline:3px solid #7D64F8;outline-offset:3px}
  /* Rechts das Bild zur Stimme. Fehlt ein Portraet, steht dort die
     Markenflaeche mit den Hoehenlinien, die sich beim Ueberfahren bewegen. */
  .st-bild{position:relative;margin:0;border-radius:6px;overflow:hidden;background:#141414;
    aspect-ratio:9/11;width:100%;max-width:100%;align-self:center}
  .st-bild img{width:100%;height:100%;object-fit:cover;display:block;
    transition:transform .8s cubic-bezier(.2,.7,.2,1)}
  /* display:block wuerde sonst das hidden-Attribut aushebeln, und die
     Markenflaeche laege ueber dem Portraet. */
  .st-bild [hidden]{display:none}
  .st-bild:hover img{transform:scale(1.04)}
  .st-platz{position:absolute;inset:0;display:block;overflow:hidden;
    background:radial-gradient(120% 90% at 62% 26%,rgba(91,60,246,.42) 0,rgba(20,20,20,0) 62%),#141414}
  .st-topo{position:absolute;inset:-14%;width:128%;height:128%;
    color:rgba(255,255,255,.16);pointer-events:none;
    transform:scale(1) translate3d(0,0,0);
    transition:transform 1.4s cubic-bezier(.2,.7,.2,1),color .6s ease}
  .st-topo path:nth-child(3n){display:none}
  .st-bild:hover .st-topo{transform:scale(1.14) translate3d(-3%,-2%,0);color:rgba(255,255,255,.26)}
  .st-sig{position:absolute;left:50%;top:50%;width:34%;max-width:120px;
    transform:translate(-50%,-50%);
    transition:transform .9s cubic-bezier(.2,.7,.2,1)}
  .st-sig svg{display:block;width:100%;height:auto;
    filter:drop-shadow(0 18px 38px rgba(0,0,0,.5))}
  .st-bild:hover .st-sig{transform:translate(-50%,-50%) scale(1.06)}
  @media(prefers-reduced-motion:reduce){
    .st-topo,.st-sig,.st-bild img{transition:none!important;transform:none!important}}
  @media(max-width:860px){
    .st-rahmen{grid-template-columns:1fr;gap:18px}
    .st-b-l{grid-row:2;justify-self:end;margin-right:52px}
    .st-b-r{grid-row:2;justify-self:end}
    .st-panel{grid-template-columns:1fr}
    .st-bild{aspect-ratio:16/9;order:-1}
    .st-anf{display:none}
  }
  .st-mehr{display:inline-block;margin-top:clamp(16px,1.8vw,22px);font-size:13px;font-weight:700;
    color:#7D64F8;text-decoration:none;border-bottom:1px solid transparent;transition:border-color .25s ease}
  .st-mehr:hover{border-color:rgba(125,100,248,.5)}
  [data-theme="light"] .st-mehr{color:#4B2E9E}

  /* Kundenstimme: dieselbe Bewegung wie die helle Flaeche auf Methode und
     Referenzen. Die Flaeche faehrt beim Hineinscrollen von rechts ein, die
     Hoehenlinien dahinter folgen der Maus. Gesteuert in
     pages/js/index-stimme-flaeche.js. */
  .st-panel{position:relative;overflow:hidden;isolation:isolate;will-change:transform}
  .st-topo{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;
    color:rgba(17,17,17,.07);transform:scale(1.08);transition:color .6s ease;will-change:transform}
  .st-topo path{fill:none;stroke:currentColor;stroke-width:1.2}
  .st-panel>.st-haupt,.st-panel>.st-bild{position:relative;z-index:1}
  .st-panel.hov .st-topo{color:rgba(75,46,158,.22)}
  @media(prefers-reduced-motion:reduce){.st-panel{transform:none!important}}

  /* «Was ich mache»: Hoehenlinien folgen der Maus wie auf den anderen
     Flaechen. Bewegung in shared/js/topo-maus.js. */
  .wy-panel .wy-topo{transform:scale(1.08);transition:color .6s ease;will-change:transform}
  .wy-panel.hov .wy-topo{color:rgba(75,46,158,.22)}
  [data-theme="light"] .wy-panel.hov .wy-topo{color:rgba(125,100,248,.26)}


  /* Menue-Bilder: schwarzweiss ohne Violett, beim Ueberfahren farbig */
  .mm-ph::after{opacity:0!important}

/* FAQ: Sprinter als Hintergrundbild wie das Portrait auf About.
   Kein Kasten mehr, das Bild laeuft links aus der Seite und blendet weich aus. */
#faq{position:relative;isolation:isolate}
#faq .wrap{position:relative;z-index:1}
.faq-back{position:absolute;left:0;top:0;height:100%;width:58%;z-index:0;pointer-events:none;overflow:hidden;
  -webkit-mask-image:linear-gradient(180deg,transparent 0,transparent 12%,#000 34%,#000 70%,transparent 100%);
  mask-image:linear-gradient(180deg,transparent 0,transparent 12%,#000 34%,#000 70%,transparent 100%)}
.faq-back img{width:100%;height:100%;object-fit:cover;object-position:42% 62%;filter:grayscale(1) contrast(1.04);
  -webkit-mask-image:linear-gradient(90deg,#000 0,#000 58%,transparent 100%);
  mask-image:linear-gradient(90deg,#000 0,#000 58%,transparent 100%);
  animation:faqKen 22s ease-in-out infinite alternate}
@keyframes faqKen{from{transform:scale(1.02)}to{transform:scale(1.06) translate(.6%,-1%)}}
#faq .faq-media{background:none;border-radius:0;overflow:visible;padding:0 0 8px;min-height:520px;box-shadow:none;transform:none!important}
#faq .faq-media::before,#faq .faq-media::after{display:none}
#faq .faq-media .faq-cap{color:var(--ink);text-shadow:0 2px 18px rgba(0,0,0,.35)}
[data-theme="light"] #faq .faq-media .faq-cap{text-shadow:0 1px 14px rgba(255,255,255,.9)}
@media(max-width:860px){
  .faq-back{width:100%;height:340px;
    -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 16%,#000 55%,transparent 100%);
    mask-image:linear-gradient(180deg,transparent 0,#000 16%,#000 55%,transparent 100%)}
  .faq-back img{-webkit-mask-image:none;mask-image:none;animation:none}
  #faq .faq-media{min-height:200px}
}
@media(prefers-reduced-motion:reduce){.faq-back img{animation:none}}

/* Kundenstimmen: Lesebalken unten in der Flaeche */
.st-panel .st-prog{position:absolute;left:0;right:0;bottom:0;height:3px;background:#5B3CF6;transform:scaleX(0);transform-origin:left;z-index:3;pointer-events:none;opacity:.8}

/* Kundenstimmen: Zitat und Name zusammen in der Mitte der Flaeche, kein Loch dazwischen */
.st-haupt{justify-content:center}
.st-fuss{margin-top:0}
.st-anf{position:relative;left:-6px;top:auto;display:block;height:.42em;margin:0 0 .02em;overflow:visible}
.st-panel{align-items:center}

/* FAQ-Sprinter: etwas kleiner, leicht nach vorne (links), blendet vor den Fragen aus */
@media(min-width:861px){
  .faq-back{width:48%;left:-3%}
  .faq-back img{object-position:40% 64%;
    -webkit-mask-image:linear-gradient(90deg,#000 0,#000 55%,transparent 96%);
    mask-image:linear-gradient(90deg,#000 0,#000 55%,transparent 96%)}
}
@media(min-width:861px){
  .faq-back{left:1.5%}
  .faq-back img{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 24%,#000 52%,transparent 88%);mask-image:linear-gradient(90deg,transparent 0,#000 24%,#000 52%,transparent 88%)}
}
@media(min-width:861px){
  .faq-back{
    -webkit-mask-image:linear-gradient(180deg,transparent 0,transparent 12%,#000 34%,#000 70%,transparent 100%),linear-gradient(90deg,transparent 0,#000 16%,#000 100%);
    -webkit-mask-composite:source-in;
    mask-image:linear-gradient(180deg,transparent 0,transparent 12%,#000 34%,#000 70%,transparent 100%),linear-gradient(90deg,transparent 0,#000 16%,#000 100%);
    mask-composite:intersect}
  .faq-back img{-webkit-mask-image:linear-gradient(90deg,#000 0,#000 52%,transparent 88%);mask-image:linear-gradient(90deg,#000 0,#000 52%,transparent 88%)}
}
/* FAQ-Sprinter: wieder bis an den linken Rand, ohne Kante */
@media(min-width:861px){
  .faq-back{left:0;width:50%;
    -webkit-mask-image:linear-gradient(180deg,transparent 0,transparent 12%,#000 34%,#000 70%,transparent 100%);
    mask-image:linear-gradient(180deg,transparent 0,transparent 12%,#000 34%,#000 70%,transparent 100%)}
  .faq-back img{-webkit-mask-image:linear-gradient(90deg,#000 0,#000 50%,transparent 86%);mask-image:linear-gradient(90deg,#000 0,#000 50%,transparent 86%)}
}

/* Handy: Kundenstimmen volle Breite und mittig (die Pfeile legten sonst eine zweite Spalte an), Portraets nicht am Kopf abschneiden */
@media(max-width:860px){
  .st-rahmen>.st-panel,.st-rahmen>.st-b{grid-column:1}
  .st-bild{aspect-ratio:9/11;width:min(240px,72%);justify-self:center}
}
/* Handy: Foto-Kachel About im Seitenverhaeltnis des Fotos, damit der ganze Kopf sichtbar ist und der Text auf der Brust liegt */
@media(max-width:760px){.etiles .etile-img.etile-foto{aspect-ratio:2/3}}

/* Startseite: Outline-Schrift im Titel ohne innere Kreuzungslinien. Gleiche Schrift (Montserrat 900), nur mit zusammengefuehrten Umrissen, dadurch gleiche Groesse und Laufweite. */
@font-face{font-family:'Montserrat Outline';font-style:normal;font-weight:900;font-display:swap;src:url('../../design/fonts/montserrat-outline-latin-ext-900-normal.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}
@font-face{font-family:'Montserrat Outline';font-style:normal;font-weight:900;font-display:swap;src:url('../../design/fonts/montserrat-outline-latin-900-normal.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}
.hero h1 .ol{font-family:'Montserrat Outline','Montserrat',sans-serif}

/* Feine Hoehenlinien wie im Header hinter dem Signet */
.sg-sec{position:relative;overflow:hidden}
.sg-sec>*:not(.sg-topo){position:relative;z-index:1}
.sg-topo{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;color:rgba(125,100,248,.13);transform:scale(1.1);-webkit-mask-image:radial-gradient(120% 90% at 50% 50%,#000 45%,transparent 92%),linear-gradient(to bottom,transparent 0,#000 14%,#000 86%,transparent 100%);-webkit-mask-composite:source-in;mask-image:radial-gradient(120% 90% at 50% 50%,#000 45%,transparent 92%),linear-gradient(to bottom,transparent 0,#000 14%,#000 86%,transparent 100%);mask-composite:intersect}
.sg-topo path{fill:none;stroke:currentColor;stroke-width:1.2}
[data-theme="light"] .sg-topo{color:rgba(75,46,158,.12)}