.webapps-page{--wa-ink:#102018;--wa-green:#126c3d;--wa-muted:#4f6458;--wa-line:rgb(47 146 107/15%);position:relative;isolation:isolate;overflow:clip;padding-bottom:clamp(76px,7vw,108px);color:var(--wa-ink);background:radial-gradient(ellipse 42% 20% at 6% 1%,rgb(191 234 87/23%),transparent 72%),radial-gradient(ellipse 38% 24% at 97% 12%,rgb(89 191 192/20%),transparent 74%),radial-gradient(ellipse 34% 22% at 4% 50%,rgb(132 220 101/12%),transparent 76%),radial-gradient(ellipse 36% 23% at 96% 79%,rgb(89 191 192/11%),transparent 76%),linear-gradient(135deg,#fbfdfb 0%,#f5fbf6 48%,#f1faf9 100%)}
.webapps-page .shell{width:min(calc(100% - 48px),1320px);margin-inline:auto}.webapps-page h1,.webapps-page h2,.webapps-page h3,.webapps-page p{margin-top:0}
.webapps-breadcrumb{display:flex;gap:12px;align-items:center;padding-top:18px;padding-bottom:4px;color:#53635b;font-size:13px;font-weight:700}.webapps-breadcrumb a{color:var(--wa-green);text-decoration:none}.webapps-breadcrumb a:hover{text-decoration:underline;text-underline-offset:4px}
.webapps-hero{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(320px,.7fr);gap:clamp(28px,3vw,48px);align-items:center;margin-top:18px;padding:clamp(28px,3.8vw,50px);border:1px solid rgb(255 255 255/84%);border-radius:32px;background:linear-gradient(145deg,rgb(255 255 255/78%),rgb(241 250 246/58%));box-shadow:0 24px 62px rgb(47 146 107/10%),inset 0 1px 0 rgb(255 255 255/86%);backdrop-filter:blur(18px) saturate(120%);-webkit-backdrop-filter:blur(18px) saturate(120%)}
.webapps-hero-copy h1{max-width:820px;margin-bottom:0;font-size:clamp(39px,3.4vw,50px);font-weight:680;line-height:1.04;letter-spacing:-.05em}.webapps-hero-copy>p{max-width:760px;margin:19px 0 0;color:#40564a;font-size:17px;line-height:1.65}
.webapps-hero-visual{position:relative;display:grid;min-height:310px;place-items:center;margin:0}.webapps-hero-visual::before{position:absolute;width:min(350px,79%);aspect-ratio:1;border-radius:50%;background:linear-gradient(145deg,rgb(191 234 87/34%),rgb(89 191 192/18%));filter:blur(2px);content:"";transform:translate(-10%,8%)}.webapps-hero-visual picture,.webapps-hero-visual img{position:relative;z-index:1;display:block;width:min(100%,500px);height:auto}.webapps-hero-visual img{filter:drop-shadow(0 25px 30px rgb(39 83 56/14%))}
.webapps-overview{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));overflow:hidden;margin-top:24px;border:1px solid rgb(255 255 255/84%);border-radius:22px;background:rgb(255 255 255/62%);box-shadow:0 17px 42px rgb(47 146 107/8%),inset 0 1px 0 rgb(255 255 255/86%);backdrop-filter:blur(16px) saturate(116%);-webkit-backdrop-filter:blur(16px) saturate(116%)}.webapps-overview a{display:grid;min-width:0;gap:5px;padding:22px clamp(16px,2vw,28px);color:var(--wa-ink);text-decoration:none;transition:background .2s}.webapps-overview a+a{border-left:1px solid var(--wa-line)}.webapps-overview a:hover{background:rgb(255 255 255/58%)}.webapps-overview span{color:#21824e;font-size:12px;font-weight:850}.webapps-overview strong{line-height:1.35}.webapps-overview small{color:var(--wa-muted);font-size:13px;line-height:1.45}
.webapp-detail{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(38px,6vw,86px);align-items:center;margin-top:clamp(34px,4vw,54px);padding:clamp(28px,4vw,52px);scroll-margin-top:96px;border:1px solid rgb(255 255 255/84%);border-radius:28px;background:linear-gradient(145deg,rgb(255 255 255/76%),rgb(242 250 246/56%));box-shadow:0 20px 52px rgb(47 146 107/8%),inset 0 1px 0 rgb(255 255 255/86%);backdrop-filter:blur(17px) saturate(118%);-webkit-backdrop-filter:blur(17px) saturate(118%)}.webapp-detail--reverse .webapp-detail-visual{grid-column:2}.webapp-detail--reverse .webapp-detail-copy{grid-row:1;grid-column:1}.webapp-detail-visual{display:grid;min-height:310px;place-items:center}.webapp-detail-visual img{display:block;width:100%;height:auto;filter:drop-shadow(0 22px 28px rgb(39 83 56/13%))}
.webapp-number{margin:0 0 10px;color:#21824e;font-size:13px;font-weight:850}.webapp-detail-copy h2{max-width:22ch;margin:0;font-size:clamp(31px,3vw,43px);font-weight:700;line-height:1.08;letter-spacing:-.042em}.webapp-direction{margin:15px 0 0;color:#157343;font-weight:820}.webapp-direction span{margin-inline:7px}.webapp-detail-copy>p:not(.webapp-number,.webapp-direction){margin:18px 0 0;color:#40554a;line-height:1.68}.webapp-detail-copy ul{display:grid;gap:9px;margin:20px 0 0;padding:0;list-style:none}.webapp-detail-copy li{position:relative;padding-left:21px;color:#354b3d;line-height:1.5}.webapp-detail-copy li::before{position:absolute;left:0;color:#118447;content:"✓";font-weight:900}
.webapp-edition-membership{margin-top:22px;padding-top:18px;border-top:1px solid var(--wa-line)}.webapp-edition-membership>p{margin:0;color:var(--wa-muted);font-size:13px;font-weight:760;line-height:1.45}.webapp-edition-pills{display:flex;flex-wrap:wrap;gap:7px 18px;margin-top:9px}.webapp-edition-pills a{color:#17683f;font-size:13px;font-weight:800;line-height:1.35;text-decoration:underline;text-decoration-color:rgb(23 104 63/35%);text-underline-offset:3px}.webapp-edition-pills a:hover{text-decoration-color:currentColor}
.webapp-detail-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:25px}.webapps-button{display:inline-flex;min-height:46px;align-items:center;justify-content:center;gap:9px;padding:10px 18px;border:1px solid;border-radius:12px;font-size:13px;font-weight:800;text-align:center;text-decoration:none;transition:transform .2s,box-shadow .2s,background .2s}.webapps-button:hover{transform:translateY(-2px)}.webapps-button-primary,.webapps-button-light{border-color:var(--button-primary-border);color:#fff;background:linear-gradient(105deg,var(--button-primary-start),var(--button-primary-middle) 56%,var(--button-primary-end));box-shadow:inset 0 1px 0 rgb(255 255 255/28%),var(--button-primary-shadow);text-shadow:0 1px 1px rgb(9 67 49/24%)}.webapps-button-primary:hover,.webapps-button-light:hover{color:#fff;background:linear-gradient(105deg,#267f48,#37975e 56%,#358e81);box-shadow:inset 0 1px 0 rgb(255 255 255/24%),var(--button-primary-shadow-hover)}
.webapps-editions,.webapps-benefits,.webapps-faq{margin-top:clamp(42px,5vw,68px);padding:clamp(28px,4vw,48px);border:1px solid rgb(255 255 255/84%);border-radius:28px;background:linear-gradient(145deg,rgb(255 255 255/76%),rgb(242 250 246/56%));box-shadow:0 20px 52px rgb(47 146 107/8%),inset 0 1px 0 rgb(255 255 255/86%);backdrop-filter:blur(17px) saturate(118%);-webkit-backdrop-filter:blur(17px) saturate(118%)}.webapps-editions h2,.webapps-benefits h2,.webapps-faq h2,.webapps-final h2{margin:0;font-size:clamp(30px,3vw,42px);font-weight:700;line-height:1.1;letter-spacing:-.04em}.webapps-editions>header p,.webapps-benefits>header p{max-width:1000px;margin:13px 0 0;color:#40554a;line-height:1.65}.webapps-text-link{display:inline-block;margin-top:13px;color:#17683f;font-weight:800;text-decoration:underline;text-decoration-color:rgb(23 104 63/35%);text-underline-offset:4px}.webapps-text-link:hover{text-decoration-color:currentColor}
.webapps-edition-table-wrap,.webapps-benefit-table-wrap{overflow-x:auto;margin-top:30px;border:1px solid var(--wa-line);border-radius:18px;background:rgb(255 255 255/52%)}.webapps-edition-table,.webapps-benefit-table{width:100%;border-collapse:collapse}.webapps-edition-table{min-width:760px}.webapps-edition-table th,.webapps-edition-table td,.webapps-benefit-table th,.webapps-benefit-table td{padding:17px 20px;border-bottom:1px solid var(--wa-line)}.webapps-edition-table thead th,.webapps-benefit-table thead th{background:rgb(235 247 239/72%);font-size:14px}.webapps-edition-table thead th:not(:first-child),.webapps-edition-table tbody td{text-align:center}.webapps-edition-table tbody th{font-weight:760}.webapps-edition-table tbody td{color:#17683f;font-size:13px;font-weight:780}.webapps-yes{color:#087d3f;font-size:23px;line-height:1}.webapps-no{color:#687a70;font-size:21px;line-height:1}.webapps-edition-table tbody tr:last-child>*,.webapps-benefit-table tbody tr:last-child>*{border-bottom:0}.webapps-table-note{margin:19px 0 0;color:#53655a;font-size:13px;line-height:1.6}
.webapps-benefit-table{min-width:620px;table-layout:fixed}.webapps-benefit-table th,.webapps-benefit-table td{width:50%;text-align:left;vertical-align:top}.webapps-benefit-table th:first-child{color:#08723f;background:rgb(226 245 232/78%)}.webapps-benefit-table th:nth-child(2){color:#31594b;background:rgb(225 243 241/76%)}.webapps-benefit-table th+th,.webapps-benefit-table td+td{border-left:1px solid var(--wa-line)}.webapps-benefit-table td{position:relative;padding-left:47px;color:#33483c;font-size:13px;line-height:1.48}.webapps-benefit-table td:first-child{background:rgb(246 252 248/62%);font-weight:700}.webapps-benefit-table td:nth-child(2){background:rgb(247 252 251/62%)}.webapps-benefit-table td::before{position:absolute;top:16px;left:20px;display:grid;width:18px;height:18px;place-items:center;border-radius:50%;color:#fff;content:"✓";font-size:11px;font-weight:900}.webapps-benefit-table td:first-child::before{background:#35a965}.webapps-benefit-table td:nth-child(2)::before{background:#64a9a3}
.webapps-faq-list{margin-top:27px;border-top:1px solid var(--wa-line)}.webapps-faq-list details{border-bottom:1px solid var(--wa-line)}.webapps-faq-list summary{position:relative;padding:21px 46px 21px 0;cursor:pointer;list-style:none;font-size:14px;font-weight:800}.webapps-faq-list summary::-webkit-details-marker{display:none}.webapps-faq-list summary::after{position:absolute;top:50%;right:0;width:28px;height:28px;border-radius:50%;background:linear-gradient(#fff,#fff) center/10px 2px no-repeat,linear-gradient(#fff,#fff) center/2px 10px no-repeat,var(--wa-green);content:"";transform:translateY(-50%)}.webapps-faq-list details[open] summary::after{background:linear-gradient(#fff,#fff) center/10px 2px no-repeat,var(--wa-green)}.webapps-faq-list details p{width:100%;max-width:none;margin:0;padding:0 46px 21px 0;color:var(--wa-muted);line-height:1.65}
.webapps-final{display:flex;gap:32px;align-items:center;justify-content:space-between;margin-top:clamp(42px,5vw,68px);padding:clamp(27px,3.5vw,44px);border:1px solid rgb(255 255 255/86%);border-radius:24px;color:var(--wa-ink);background:radial-gradient(circle at 88% 0%,rgb(89 191 192/25%),transparent 40%),linear-gradient(125deg,rgb(191 234 87/25%),rgb(98 200 116/18%) 52%,rgb(89 191 192/22%));box-shadow:0 20px 50px rgb(35 111 76/10%),inset 0 1px 0 rgb(255 255 255/84%);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}.webapps-final h2{color:var(--wa-ink);font-size:clamp(27px,2.7vw,38px)}.webapps-final p{margin:9px 0 0;color:#365344}.webapps-button-light{min-width:190px;flex:0 0 auto}
.webapps-button:focus-visible,.webapps-text-link:focus-visible,.webapps-overview a:focus-visible,.webapp-edition-pills a:focus-visible,.webapps-faq-list summary:focus-visible{outline:3px solid #82d0a1;outline-offset:3px}
@media(max-width:1050px){.webapps-hero{grid-template-columns:minmax(0,1fr) minmax(300px,.75fr)}.webapp-detail{gap:38px}}
@media(max-width:880px){.webapps-hero,.webapp-detail{grid-template-columns:1fr}.webapps-hero-visual{min-height:0}.webapps-hero-visual img{width:min(100%,570px)}.webapps-overview{grid-template-columns:repeat(2,minmax(0,1fr))}.webapps-overview a:nth-child(3){border-top:1px solid var(--wa-line);border-left:0}.webapps-overview a:nth-child(4){border-top:1px solid var(--wa-line)}.webapp-detail--reverse .webapp-detail-visual,.webapp-detail--reverse .webapp-detail-copy{grid-row:auto;grid-column:auto}.webapp-detail--reverse .webapp-detail-visual{order:0}.webapp-detail--reverse .webapp-detail-copy{order:1}}
@media(max-width:640px){.webapps-page .shell{width:min(calc(100% - 32px),1320px)}.webapps-breadcrumb{padding-top:14px}.webapps-hero{gap:24px;margin-top:12px;padding:25px 22px;border-radius:24px}.webapps-hero-copy h1{font-size:clamp(34px,10vw,43px)}.webapps-hero-copy>p{font-size:15px;line-height:1.6}.webapps-overview{grid-template-columns:1fr;border-radius:18px}.webapps-overview a+a,.webapps-overview a:nth-child(3),.webapps-overview a:nth-child(4){border-top:1px solid var(--wa-line);border-left:0}.webapp-detail,.webapps-editions,.webapps-benefits,.webapps-faq{padding:25px 21px;border-radius:22px}.webapp-detail-visual{min-height:0}.webapp-detail-copy h2,.webapps-editions h2,.webapps-benefits h2,.webapps-faq h2{font-size:30px}.webapp-edition-pills{gap:8px 14px}.webapp-detail-actions .webapps-button{width:100%}.webapps-edition-table-wrap,.webapps-benefit-table-wrap{margin-top:24px;border-radius:14px}.webapps-final{align-items:stretch;flex-direction:column;padding:25px 22px;border-radius:22px}.webapps-final .webapps-button{width:100%}}
@media(prefers-reduced-motion:reduce){.webapps-button,.webapps-overview a{transition:none}}

/* Einheitliche Ankernavigation für lange Produktübersichten. */
.webapps-overview{position:sticky;z-index:20;top:76px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));overflow:hidden;margin-top:24px;padding:5px;border:1px solid rgb(255 255 255/88%);border-radius:18px;background:rgb(247 252 249/88%);box-shadow:0 14px 38px rgb(47 146 107/10%),inset 0 1px 0 rgb(255 255 255/90%);backdrop-filter:blur(16px) saturate(125%);-webkit-backdrop-filter:blur(16px) saturate(125%)}
.webapps-overview a{display:grid;grid-template-columns:30px minmax(0,1fr);grid-template-rows:auto auto;column-gap:10px;min-width:0;min-height:54px;align-items:center;padding:7px 12px;border:1px solid transparent;border-radius:12px;color:#30483b;text-decoration:none;transition:color .18s ease,background .18s ease}
.webapps-overview a+a{border-left-color:transparent}
.webapps-overview a:hover,.webapps-overview a:focus-visible{color:#075d33;background:#f0f7f2}
.webapps-overview a.is-active{color:#075d33;background:linear-gradient(120deg,rgb(191 234 87/24%),rgb(89 191 192/17%))}
.webapps-overview span{grid-row:1/3;display:grid;width:30px;height:30px;place-items:center;border-radius:50%;color:#11683b;background:#e9f4ec;font-size:12px;font-weight:800;transition:color .18s ease,background .18s ease}
.webapps-overview a.is-active span{color:#fff;background:linear-gradient(135deg,#62c874,#398f91);box-shadow:0 7px 18px rgb(47 146 107/22%)}
.webapps-overview strong{align-self:end;overflow:hidden;font-size:13px;line-height:1.2;text-overflow:ellipsis;white-space:nowrap}
.webapps-overview small{align-self:start;overflow:hidden;color:var(--wa-muted);font-size:11px;line-height:1.2;text-overflow:ellipsis;white-space:nowrap}
.webapp-detail{scroll-margin-top:158px}
@media(min-width:1801px){.webapps-overview{top:92px}}
@media(max-width:1050px){.webapps-overview{display:flex;overflow-x:auto;scrollbar-width:none}.webapps-overview::-webkit-scrollbar{display:none}.webapps-overview a{flex:0 0 auto;min-width:220px}.webapps-overview a:nth-child(3),.webapps-overview a:nth-child(4){border-top-color:transparent}}
@media(max-width:760px){.webapps-overview{top:68px}}
@media(max-width:640px){.webapps-overview{top:68px;border-radius:16px}.webapps-overview a{min-width:210px}.webapps-overview a+a,.webapps-overview a:nth-child(3),.webapps-overview a:nth-child(4){border-top-color:transparent;border-left-color:transparent}}