@import url('/assets/app-entwicklung-fonts.css');
.app-page{--app-border:#333336;--app-muted:#bbb6af;padding-top:64px;font-family:Geist,Arial,sans-serif}
.app-page a:focus-visible,.app-page button:focus-visible,.app-page summary:focus-visible{outline:3px solid #dda15f;outline-offset:5px}
.app-page .site-header{background:#0c0c0df7;backdrop-filter:none}
.app-page .desktop-nav{gap:24px}.app-page .brand img{width:164px;height:auto}
.app-page .menu-toggle{width:44px;height:44px;padding:0;border:0;background:transparent;color:var(--paper);cursor:pointer}
.app-page .menu-toggle span{display:block;width:21px;height:1px;background:currentColor;transition:transform .3s ease}
.app-page .menu-toggle[aria-expanded="true"] span:first-child{transform:translateY(3.5px) rotate(45deg)}
.app-page .menu-toggle[aria-expanded="true"] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}
.app-page .mobile-nav[hidden]{display:none!important}
.app-page .mobile-nav:not([hidden]){position:fixed;z-index:101;top:var(--header-h);left:0;right:0;height:calc(100dvh - var(--header-h));overflow-y:auto;display:flex;flex-direction:column;gap:0;padding:12px 24px 22px;background:#111113;border-bottom:1px solid #333}
.app-page .mobile-nav a{padding:13px 0;font-size:16px}
.app-shell{width:min(1152px,calc(100% - 64px));margin-inline:auto}
.app-kicker{font:500 11px/1.5 'Geist Mono',monospace;letter-spacing:.12em;text-transform:uppercase;color:#dda15f;margin:0 0 25px}
.app-hero{display:grid;grid-template-columns:1.15fr .85fr;gap:72px;align-items:center;padding:76px 0 70px;min-height:680px}
.app-hero h1{font-size:clamp(48px,5.6vw,80px);line-height:1.02;letter-spacing:-.055em;font-weight:600;max-width:690px}
.app-hero h1 em{font-style:normal;color:#dda15f}
.app-hero .intro{margin:28px 0 30px;max-width:560px;font-size:19px;line-height:1.65;color:#bdb8b1}
.app-page .app-cta{display:inline-flex;align-items:center;justify-content:space-between;gap:30px;background:#dda15f;color:#17130f;border:1px solid #dda15f;padding:15px 20px;font-size:15px;font-weight:650;border-radius:4px;min-height:52px}
.app-page .app-cta:hover{background:#edb777}.app-page .text-link{display:inline-flex;gap:10px;align-items:center;min-height:44px;color:#dda15f;text-decoration:underline;text-underline-offset:5px}
.app-platforms{display:flex;flex-wrap:wrap;gap:12px 22px;margin-top:28px;color:#aaa59e;font-size:12px}
.app-proof{position:relative;width:100%;margin:0;padding:24px 28px 0;background:#1c1d20;border:1px solid #38383a;border-radius:16px;max-width:410px;justify-self:end;overflow:hidden}
.app-proof-label{display:flex;justify-content:space-between;gap:20px;margin-bottom:22px;font:500 11px/1.5 'Geist Mono',monospace;color:#d2ccc4}
.app-proof-label span:last-child{color:#dda15f}
.app-phone{width:260px;max-width:100%;height:465px;margin:auto;padding:6px 6px 0;background:#0c0c0d;border:1px solid #55555b;border-radius:31px 31px 0 0;overflow:hidden}
.app-phone img{display:block;width:100%;height:auto;border-radius:25px 25px 0 0}
.app-panel{border-top:1px solid #303033;padding:76px 0}
.app-section-intro{display:grid;grid-template-columns:.8fr 1.2fr;gap:64px;align-items:start;margin-bottom:40px}
.app-section-intro h2,.app-case h2{font-size:clamp(32px,3.5vw,48px);line-height:1.1;letter-spacing:-.035em;font-weight:550}
.app-section-intro p{font-size:18px;line-height:1.7;color:#bdb8b1;max-width:650px;margin:5px 0 0}
.app-use-row{display:grid;grid-template-columns:45px 1fr 1.2fr;gap:24px;padding:26px 0;border-top:1px solid #303033;align-items:start}
.app-use-row>span{font:12px/1.8 'Geist Mono',monospace;color:#dda15f}.app-use-row h3{font-size:22px;font-weight:550;letter-spacing:-.02em}.app-use-row p{color:#bdb8b1;margin:0;line-height:1.7}
.app-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:30px;margin-top:44px}
.app-step{border-top:2px solid #9c713f;padding-top:20px}.app-step>span{font:12px 'Geist Mono',monospace;color:#dda15f}.app-step h3{margin:35px 0 16px;font-size:23px;font-weight:550}.app-step p{font-size:15px;color:#bdb8b1;line-height:1.7;margin:0}
.app-case{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.app-case img{width:100%;height:auto;border-radius:10px;display:block}.app-case p{line-height:1.75;color:#bdb8b1;margin:20px 0}.app-beta-note{font-size:13px!important;border-left:2px solid #dda15f;padding-left:16px}
.app-faq{max-width:800px;margin-top:35px}.app-faq details{border-top:1px solid #343437;padding:20px 0}.app-faq summary{font-size:19px;font-weight:500;cursor:pointer;min-height:44px;padding:6px 20px 6px 0}.app-faq details p{color:#bdb8b1;line-height:1.8;margin:18px 0 0}
.app-contact{display:grid;grid-template-columns:1.3fr 1fr;gap:50px;align-items:center;padding:60px 0 80px}.app-contact h2{font-size:clamp(34px,4vw,56px);font-weight:550;letter-spacing:-.04em}.app-contact p{color:#bdb8b1;font-size:17px;line-height:1.7;margin:22px 0 0}.app-contact>.app-cta{justify-self:end}
.app-page .site-footer{border-top:1px solid #303033}.app-page .footer-inner{padding-block:32px}.app-page .footer-inner>div{display:flex;flex-wrap:wrap;gap:14px 20px}.app-page .footer-inner p{color:#aaa59e}
.help-page{background:#f4f7fb;color:#24335c}.help-page .site-header,.help-page .site-footer{color:#f0ede8;background:#0c0c0d}
.help-page strong{color:#24335c}.help-page a:focus-visible,.help-page button:focus-visible,.help-page summary:focus-visible{outline-color:#6248ac}.help-hero:not(:has(img)){grid-template-columns:1fr}.help-hero:not(:has(img))>div{max-width:820px}
.help-page .app-kicker{color:#7051ae}.help-page .text-link{color:#6042a2}.help-page .app-cta{background:#6248ac;border-color:#6248ac;color:#fff}.help-page .app-cta:hover{background:#7459bd}
.help-hero{padding:66px 0 44px;display:grid;grid-template-columns:1fr .9fr;gap:55px;align-items:center}.help-hero h1{font-size:clamp(42px,5vw,68px);font-weight:650;line-height:1.05;letter-spacing:-.045em}.help-hero p{color:#53637d;font-size:18px;line-height:1.75;margin:24px 0}.help-hero img{width:100%;height:auto;display:block;border-radius:16px;border:5px solid #fff}
.help-links{display:flex;flex-wrap:wrap;gap:10px 24px;margin-top:20px}.help-status{font-size:13px!important;margin-top:20px!important;max-width:530px}
.help-content{display:grid;grid-template-columns:230px 1fr;gap:70px;padding:44px 0 80px;border-top:1px solid #d8dfeb}
.help-index{align-self:start;position:sticky;top:98px}.help-index p{font:11px 'Geist Mono',monospace;text-transform:uppercase;letter-spacing:.1em;color:#64718b}.help-index a{display:block;padding:11px 0;border-bottom:1px solid #dce2ed;font-size:14px;color:#455477;min-height:44px}
.help-article{min-width:0;max-width:760px}.help-article section{scroll-margin-top:100px;margin-bottom:46px}.help-article h2{font-size:30px;font-weight:600;letter-spacing:-.025em;margin:0 0 18px;line-height:1.2}.help-article h3{font-size:19px;margin:25px 0 14px}.help-article p,.help-article li{font-size:16px;line-height:1.85;color:#43536f}.help-article a{color:#6042a2;text-decoration:underline;text-underline-offset:3px}.help-article li+li{margin-top:9px}.help-article ul,.help-article ol{padding-left:22px}.help-article address{font-style:normal;line-height:1.85;color:#43536f}.help-notice{background:#e8e4f6;border-left:3px solid #8061bd;padding:20px 24px;margin-bottom:30px}.help-notice p{margin:0}.help-article details{border-block-start:1px solid #d8dfeb;padding:18px 0}.help-article summary{font-size:17px;font-weight:600;line-height:1.55;cursor:pointer}.help-article details p{margin:16px 0 0}.help-date{font:12px 'Geist Mono',monospace!important;color:#64718b!important}
.help-overview{padding:55px 0 80px}.help-overview .app-case{gap:60px}.help-overview h2{font-size:36px}.help-overview p{color:#43536f}.help-overview .app-platforms{color:#53637d}
@media(min-width:981px){.app-page .menu-toggle,.app-page .mobile-nav{display:none!important}}
@media(max-width:980px){.app-page .desktop-nav{display:none}.app-page .menu-toggle{display:grid;place-content:center;gap:6px}.app-hero{gap:36px;grid-template-columns:1.1fr .9fr;padding-block:60px;min-height:0}.app-hero h1{font-size:57px}.app-proof{padding-inline:18px}.app-hero .intro{font-size:17px}.app-section-intro{gap:35px}.app-steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:35px}.app-case{gap:30px}.help-content{grid-template-columns:180px 1fr;gap:35px}.help-hero{gap:30px}.app-page .footer-inner{display:flex;flex-wrap:wrap;align-items:center;gap:25px}}
@media(max-width:650px){.app-shell{width:calc(100% - 40px)}.app-page .header-inner{width:calc(100% - 40px)}.app-page .brand img{width:145px}.app-hero{grid-template-columns:1fr;padding:47px 0 45px;gap:40px}.app-hero h1{font-size:52px}.app-hero .intro{font-size:17px;margin:25px 0}.app-kicker{font-size:10px;margin-bottom:21px}.app-proof{max-width:none;width:100%;justify-self:stretch;padding:18px 24px 0}.app-proof-label{margin-bottom:16px}.app-phone{height:300px;width:250px}.app-platforms{font-size:11px;gap:10px 18px}.app-panel{padding:48px 0}.app-section-intro{grid-template-columns:1fr;gap:20px;margin-bottom:30px}.app-section-intro p{font-size:16px}.app-use-row{grid-template-columns:26px 1fr;gap:8px 16px;padding:23px 0}.app-use-row h3{font-size:20px}.app-use-row p{grid-column:2;font-size:15px}.app-steps{grid-template-columns:1fr;gap:30px}.app-step h3{margin-top:18px;font-size:22px}.app-case{grid-template-columns:1fr;gap:30px}.app-case h2{font-size:34px}.app-faq summary{font-size:17px}.app-contact{grid-template-columns:1fr;padding:48px 0 60px;gap:28px}.app-contact>.app-cta{justify-self:start}.app-contact p{font-size:16px}.app-page .footer-inner{gap:22px}.app-page .footer-inner>div{font-size:13px;gap:12px 18px}.help-hero{grid-template-columns:1fr;padding:42px 0 30px;gap:24px}.help-hero h1{font-size:44px}.help-hero p{font-size:16px;margin:20px 0}.help-hero img{max-height:220px;object-fit:cover}.help-links{gap:6px 20px}.help-content{display:block;padding:30px 0 50px}.help-index{position:static;display:flex;gap:0 20px;flex-wrap:wrap;margin-bottom:35px}.help-index p{width:100%;margin-bottom:10px}.help-index a{font-size:13px;min-height:40px;padding-block:9px}.help-article h2{font-size:27px}.help-article p,.help-article li{font-size:15px;line-height:1.85}.help-notice{padding:17px 20px}.help-article section{margin-bottom:38px}.help-overview{padding-block:35px 55px}}
@media(prefers-reduced-motion:reduce){.app-page *{scroll-behavior:auto!important;animation:none!important;transition:none!important}}

/* Actual app project galleries. */
.app-project-intro h2{font-size:clamp(32px,3.5vw,48px);line-height:1.12;letter-spacing:-.035em;font-weight:550}.app-project-intro>p:last-of-type{max-width:720px;color:#bdb8b1;font-size:18px;line-height:1.7;margin:24px 0 0}.app-project-nav{display:flex;flex-wrap:wrap;gap:14px 34px;margin-top:32px}.app-project-nav a{display:inline-flex;gap:20px;align-items:center;color:#e3b279;border-bottom:1px solid #695238;padding:9px 0;font-size:15px}.app-project{display:grid;grid-template-columns:.78fr 1.4fr;gap:52px;border-top:1px solid #303033;padding:70px 0;align-items:center;scroll-margin-top:96px}.app-project-copy h2{font-size:clamp(32px,3.4vw,46px);font-weight:550;line-height:1.1;letter-spacing:-.035em}.app-project-copy>p{color:#bdb8b1;line-height:1.75;margin:22px 0}.app-project-copy .app-kicker{color:#dda15f;margin:0 0 20px;font-size:10px}.app-project-copy .app-project-lead{font-size:21px;line-height:1.4;color:#f0e8dd;margin:24px 0 16px}.app-project-copy ul{list-style:none;margin:25px 0 32px;padding:0;border-top:1px solid #303033}.app-project-copy li{padding:12px 0;border-bottom:1px solid #303033;color:#d4cec5;font-size:14px}.app-project-shots{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.72fr);gap:16px;align-items:start}.app-project-shots figure{margin:0;min-width:0}.app-shot{width:100%;display:block;background:#f2f4f4;border:1px solid #424448;border-radius:15px;padding:10px;position:relative;cursor:zoom-in;overflow:hidden}.app-shot img{display:block;width:100%;height:390px;object-fit:contain;object-position:top;background:#f2f4f4}.app-shot>span{display:block;margin:10px -10px -10px;padding:11px 7px;color:#e6ded2;background:#232326;font:11px 'Geist Mono',monospace}.app-project-shots figcaption{color:#aaa69f;font:11px/1.6 'Geist Mono',monospace;margin-top:12px}.app-shot:focus-visible,.app-shot-dialog button:focus-visible{outline:3px solid #dda15f;outline-offset:4px}.app-shot:hover{border-color:#dda15f}.app-shot-dialog{padding:0;border:1px solid #5b5348;border-radius:14px;color:#eee7dc;background:#171719;width:min(1250px,calc(100vw - 48px));max-width:none;max-height:90dvh;box-shadow:0 20px 100px #0009}.app-shot-dialog::backdrop{background:#000c;backdrop-filter:blur(5px)}.app-shot-dialog-header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:15px 20px;border-bottom:1px solid #3c3933}.app-shot-dialog-header p{margin:0;font-size:14px;line-height:1.5}.app-shot-dialog-header button{flex:none;min-height:44px;min-width:100px;border:1px solid #7c6548;border-radius:5px;background:#26231f;color:#eee7dc;padding:8px 14px;cursor:pointer}.app-shot-dialog-header button span{margin-left:10px;font-size:20px}.app-shot-dialog-body{overflow:auto;max-height:calc(90dvh - 90px);background:#fff}.app-shot-dialog-body img{display:block;width:100%;height:auto}.app-shot-dialog[data-portrait="true"]{width:min(740px,calc(100vw - 40px))}.app-page:has(.app-shot-dialog[open]){overflow:hidden}
@media(max-width:1050px){.app-project{grid-template-columns:1fr 1.5fr;gap:32px}.app-shot img{height:340px}.app-project-copy .app-project-lead{font-size:19px}}
@media(max-width:760px){.app-project{grid-template-columns:1fr;gap:28px;padding:48px 0}.app-project-copy{max-width:650px}.app-project-shots{grid-template-columns:minmax(0,1.2fr) minmax(0,.7fr);gap:12px}.app-shot img{height:360px}.app-project-copy>p{margin:18px 0}.app-project-intro>p:last-of-type{font-size:17px}.app-project-nav{gap:12px 24px}.app-shot-dialog-header{padding:10px 12px;gap:10px}.app-shot-dialog-header p{font-size:12px}.app-shot-dialog-header button{min-width:82px;padding:6px 8px;font-size:12px}}
@media(max-width:430px){.app-shot{padding:5px;border-radius:9px}.app-shot img{height:260px}.app-shot>span{margin:6px -5px -5px;font-size:9px;padding:10px 3px}.app-project-shots figcaption{font-size:10px}.app-project-nav{column-gap:23px}.app-project-nav a{font-size:13px;gap:10px}}

.app-detail-hero{padding:75px 0 70px;max-width:1040px}.app-detail-hero>.text-link{font-size:13px}.app-detail-hero>.app-kicker{margin-top:58px}.app-detail-hero h1{font-size:clamp(45px,6.4vw,80px);font-weight:550;line-height:1.04;letter-spacing:-.05em}.app-detail-hero h1 em{font-style:normal;color:#dda15f}.app-detail-hero .intro{max-width:760px;color:#bdb8b1;font-size:20px;line-height:1.7;margin-top:30px}.app-connected{margin-top:44px;border-top:1px solid #42382c;padding-top:20px}.app-connected>p{font:11px 'Geist Mono',monospace;color:#bdb8b1;margin-bottom:19px}.app-connected>div{display:flex;flex-wrap:wrap;gap:20px 45px}.app-connected strong{font-size:24px;font-weight:500;color:#eee5d9}.app-detail-screens{display:grid;grid-template-columns:.7fr 1.3fr;gap:64px;border-top:1px solid #303033;padding:70px 0;align-items:center}.app-detail-screens h2,.app-detail-row h2,.app-detail-end h2{font-size:clamp(29px,3.2vw,43px);font-weight:550;line-height:1.12;letter-spacing:-.03em}.app-detail-screens>div>p:last-child{color:#bdb8b1;line-height:1.7;margin-top:25px;max-width:350px}.app-detail-row{display:grid;grid-template-columns:1fr 1.2fr;gap:80px;border-top:1px solid #303033;padding:42px 0;scroll-margin-top:100px}.app-detail-row h2{font-size:30px}.app-detail-row>p{color:#bdb8b1;line-height:1.8;font-size:17px;margin:0}.app-detail-row .app-kicker{font-size:10px;margin-bottom:20px}.app-detail-end{max-width:800px}.app-detail-end>p:not(.app-kicker){max-width:640px;color:#bdb8b1;line-height:1.8;font-size:18px;margin:25px 0}.app-detail-end>.text-link{display:block;margin-top:25px}
@media(max-width:760px){.app-detail-hero{padding:40px 0 48px}.app-detail-hero>.app-kicker{margin-top:42px;font-size:10px}.app-detail-hero .intro{font-size:18px}.app-connected strong{font-size:21px}.app-detail-screens{grid-template-columns:1fr;gap:30px;padding:48px 0}.app-detail-screens>div>p:last-child{max-width:none}.app-detail-row{grid-template-columns:1fr;gap:22px;padding:34px 0}.app-detail-row h2{font-size:28px}.app-detail-row>p{font-size:16px}.app-detail-row .app-kicker{margin-bottom:16px}.app-detail-end>p:not(.app-kicker){font-size:17px}}